podcast-archive.twig

{# Template: podcast-archive template #}
{# Version: 1.3 #}

{# group - define the contributor group to be listed #}
{# role - define the contributor role to be listed #}
{# contributor_column - define the contributor role to be listed #}

{% import "metaebene-macros" as metaebene %}


{% set icon_size = '96' %}

{% if not avatar_size %}
  {% set avatar_size = '48' %}
{% endif %}


<table>
    <colgroup>
        <col id="episode_icon" width="{{ icon_size + 16 }}" />
        <col id="episode_description" />
        {% if contributor_column %}
        <col id="episode_contributors" />
        {% endif %}
    </colgroup>
    <tbody>
    {% for episode in podcast.episodes %}
        <tr id="{{ episode.slug }}" class="archive_episode_row">
            <td class="episode_icon">
                <img src="{{ episode.imageUrlWithFallback }}" width="{{ icon_size }}" height="{{ icon_size }}">
            </td>
            <td class="episode_description">
                <div class="episode_title"><a href="{{ episode.url }}">{{ episode.title }}</a></div>

                <div class="episode_meta">

                    {{ metaebene.print_date(episode.publicationDate, language) }}<br/>
                    {{ metaebene.print_duration(episode.duration, language) }}

                </div>

                <div class="episode_subtitle">{{ episode.subtitle }}</div>

            {% if contributor_column %}
            </td>
            <td>
            {% endif %}

                {# contributor avatars #}
                <div class="episode_contributor_avatars">
                {% for contributor in episode.contributors({group: group, role: role}) %}
                    <img src="{{ contributor.avatar.url }}" title="{{ contributor.name }}" height="{{ avatar_size }}" width="{{ avatar_size }}"/ />
                {% endfor %}
                </div>

                {# contributor names #}
                <div class="episode_contributor_names">
                {% for contributor in episode.contributors({group: group, role: role}) %}
                    {{ contributor.name }}{% if not loop.last %}, {% endif %}
                {% endfor %}
                </div>

            </td>
        </tr>
    {% endfor %}
    </tbody>
</table>

<style type="text/css">
.archive_episode_row .episode_icon {
    text-align: left;
}

.archive_episode_row .episode_title {
    color: #0199CA;
    font-size: larger !important;
    font-weight: bold !important;
}

.archive_episode_row .episode_meta {
    font-weight: bold !important;
}

.archive_episode_row .episode_contributor_names {
    font-weight: bold !important;
}

.archive_episode_row div.episode_contributor_avatars {
    margin-top: 16px;
}

.archive_episode_row div.episode_meta {
    vertical-align: baseline;
}

.archive_episode_row img.tiny_icon {
    vertical-align: -10%;
}

.archive_episode_row td {
    vertical-align: top;
    padding-top: 32px;
    padding-bottom: 32px;
}
</style>