home.j2

{% block style %}
  <link href="https://fonts.googleapis.com/css?family=Lato:300,400,700&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="{{ static_url }}ginza.css">
{% endblock %}


{%- macro render_item(subject) -%}
  <div id="item-{{ subject.id }}" class="item {{ subject.type|title }}">
    {% if subject.cover and subject.cover.src %}
      <a class="item-image js-cover" data-src="{{ subject.cover.src|thumbnail('m') }}" href="{{ linkify(subject.url) }}"></a>
    {% elif subject.image %}
      <a class="item-image js-cover" data-src="{{ subject.image|thumbnail('m') }}" href="{{ linkify(subject.url) }}"></a>
    {% else %}
      <a class="item-image" href="{{ linkify(subject.url) }}"></a>
    {% endif %}
    <a class="item-main" href="{{ linkify(subject.url) }}">
      <div class="item-meta">
        {% if subject.duration %}
          <span class="item-label">{{ subject.duration }}</span>
        {% endif %}
        <time datetime="{{ subject.published_at|xmldatetime }}">{{ subject.published_at.strftime('%b %d, %Y') }}</time>
      </div>
      <h3>{{ subject.title }}</h3>
      {%- if subject.subtitle %}
        <div class="item-subtitle">{{ subject.subtitle }}</div>
      {%- endif -%}
    </a>
  </div>
{%- endmacro -%}

{% macro render_head(site) %}
<div class="head">
  <div class="inner">
    <div class="head_logo">
      <a href="{{ linkify('/') }}">
        {% if site.logo %}
          <img src="{{ site.logo.src|thumbnail('ss') }}" alt="{{ site.name }}"/>
        {% endif %}
        <span>{{ site.name }}</span>
      </a>
    </div>
    <div class="head_subscribe">
      <a href="#" class="js-search"
        {% if features.algolia %}data-id="{{ site.algolia_id }}" data-key="{{ site.algolia_key }}"{% endif %}>
        <i class="icon icon-search" aria-label="Search"></i>
      </a>
      {% if features.post %}
        <button class="js-subscribe">Subscribe</button>
      {% endif %}
    </div>
  </div>
</div>
{% endmacro %}

{% macro render_site_info(site) %}
  <div class="info_main">
    <h1 class="info_title"><a class="h-card" rel="me" href="{{ linkify('/') }}">{{ site.name }}</a></h1>
    {% if site.summary %}
      <h2 class="info_subtitle">{{ site.summary }}</h2>
    {% endif %}
    <nav class="info_nav">
      {% for nav in site.primary_links -%}
        <a href="{{ nav.url }}"{% if nav.blank %} target="_blank"{% endif %}>{{ nav.title }}</a>
      {% endfor %}
    </nav>
  </div>
{% endmacro %}

{% macro render_podcast_info(site) %}
  {% set podcast = site.podcast %}
  {% if podcast.image %}
    <a class="info_logo" href="{{ linkify('/') }}">
      <img src="{{ podcast.image|thumbnail('ss') }}" alt="{{ podcast.title }}">
    </a>
  {% endif %}
  <div class="info_main">
    <h1 class="info_title"><a class="h-card" rel="me" href="{{ linkify('/') }}">{{ podcast.title }}</a></h1>
    {% if podcast.subtitle %}
      <h2 class="info_subtitle">{{ podcast.subtitle }}</h2>
    {% endif %}
    <nav class="info_nav">
      <a href="/feed/audio.xml">RSS</a>
      {% for nav in podcast.links %}
        <a href="{{ nav.url }}"{% if nav.blank %} target="_blank"{% endif %}>{{ nav.title }}</a>
      {% endfor %}
    </nav>
  </div>
{% endmacro %}


{% block body %}
  <div {% if site.cover -%}
    class="head-cover js-cover" data-src="{{ site.cover.src|thumbnail }}"
  {%- else -%}
    class="head-cover"
  {%- endif %}>
    {{ render_head(site) }}
    <div class="info">
      <div class="inner">
        {% if features.post %}
          {{ render_site_info(site) }}
        {% elif site.podcast %}
          {{ render_podcast_info(site) }}
        {% else %}
          {{ render_site_info(site) }}
        {% endif %}
      </div>
    </div>
  </div>
  <div class="main">
    <div class="inner">
      <div class="items">
        {% for subject in query.latest_subjects(count=12) %}
          {{ render_item(subject) }}
        {% endfor %}
      </div>
      <div class="navigation">
        <a href="{{ linkify('/archive/') }}">More</a>
      </div>
    </div>
  </div>
  {% include "_snippets/site_foot.j2" %}
  {% include "_snippets/brand_foot.j2" %}
{% endblock %}