<%inherit file="/template.html" />
<%namespace name="components" file="/components.html"/>
<%def name="title()">${_(u"Categories")|n}</%def>

<%def name="breadcrumbs()">
${h.category.breadcrumbs(None)|n}
</%def>


<%block name="headline">
%if c.heading_title and c.heading_text:
<div class="custom_heading">
%endif

    %if c.heading_title:
    <h2>${_(c.heading_title)|n}</h2>
    %else:
    <h2>${_(u"Categories")}
    %if can.badge.manage_instance():
    <a class="button_small edit"
        href="${h.base_url('/badge/category')}"
        rel="#overlay-form">${_(u"Edit")}</a>
    %endif
    </h2>
    %endif

    %if c.heading_text:
    <div class="description">${_(c.heading_text)|n}</div>
    %else:
    <hr />
    %endif

%if c.heading_title and c.heading_text:
</div>
%endif

<div class="tile-table">
    <% counter = 0 %>

    %for category in c.categories:

    %if counter % 3 == 0:
    <div class="tile-row">
    %endif

        <a class="tile" href="${h.base_url(member='category/%s' % category.id)|n}">
            <img class="tile-image" src="${h.logo_url(category, 160, 320)}" alt="" />
            <h3>${category.title}</h3>
            <p>${category.description}</p>
            <span class="button tile-button">${_('View and discuss')}</span>
        </a>

    <% counter += 1 %>
    %if counter % 3 == 0:
    </div>
    %endif

    %endfor

    %if counter % 3 != 0:

    %for i in range(counter % 3, 3):
        <span class="tile"></span>
    %endfor

    </div>
    %endif
</div>

</%block>
