byceps/byceps

View on GitHub
byceps/blueprints/site/tourney/templates/site/tourney/tourney_index.html

Summary

Maintainability
Test Coverage
{% extends 'layout/base.html' %}
{% from 'macros/icons.html' import render_icon %}
{% set page_title = _('Tourneys') %}

{% block head %}
<style>
  .tourney-category {
    font-weight: bold;
    margin: 0.5rem 0;
  }

  .tourney-icon {
    margin-left: 1rem;
  }

  .tourney-icon img {
    height: 32px;
    width: 32px;
    display: block;
  }

  .tourney-icon .icon {
    font-size: 2rem;
  }

  .tourney-title {
    font-weight: bold;
  }
</style>
{%- endblock %}

{% block body %}

  <h1 class="title">{{ page_title }}</h1>

  <div class="main-body-box">
  {%- if categories_with_tourneys %}
    <table class="itemlist is-vcentered is-wide">
      <thead>
        <tr>
          <th></th>
          <th></th>
          <th class="centered">{{ _('Participants') }}</th>
        </tr>
      </thead>
      <tbody>
      {%- for category, tourneys in categories_with_tourneys %}
        <tr>
          <td colspan="3"><div class="tourney-category">{{ category.title }}</div></td>
        </tr>
        {%- for tourney in tourneys %}
        <tr>
          <td>
            <div class="tourney-icon">
            {%- if tourney.logo_url %}
              <img src="{{ tourney.logo_url }}">
            {%- else %}
              {{ render_icon('trophy') }}
            {%- endif %}
            </div>
          </td>
          <td>
            <a href="{{ url_for('.tourney_view', tourney_id=tourney.id) }}" class="disguised">
              <div class="tourney-title">{{ tourney.title }}</div>
              <div class="tourney-subtitle">{{ tourney.subtitle|safe if tourney.subtitle else '' }}</div>
            </a>
          </td>
          <td class="bignumber centered nowrap">{{ tourney.current_participant_count }} / {{ tourney.max_participant_count }}</td>
        </tr>
        {%- endfor %}
      {%- endfor %}
      </tbody>
    </table>
  {%- else %}
    <p class="dimmed">{{ _('No tourneys found.') }}</p>
  {%- endif %}
  </div>

{%- endblock %}