www.moonwalks.be/theme/templates/partials/calendar.html

<!--
  the important thing is that: it is a walk!! (walk must be written in big somewhere)
  then time and place.
  also:
  clear separation between mono and the other one! (like find a precise protocol)
-->

<header class="date-time-info mono">
  {{ page.multilang.datetime }} <span class="timezone"></span>
</header>

<div class="calendar-content">

  <div class="cal-loading mono">
    {{ page.multilang.loading }}
  </div>

  <!-- CALENDAR ENTRY TEMPLATE -->
  <template id="cal-entry__template">

    <div class="cal-entry">

      <time class="cal-entry__date" datetime="">
        <div class="day font-up"></div>
        <div class="date mono-big">
        </div>
      </time>

      <div class="cal-entry__moon">
        <div class="moon-drawing"></div>
      </div>

      <div class="cal-entry__phase">
        <h2 class="phase-name font-big"></h2>
      </div>

      <div class="cal-entry__reservation">
        <div class="reservation font-up">

          <a class="signup">
            {{ page.multilang.signup }}
          </a>

          <span class="not-confirmed">{{ page.multilang.notconfirmed }}</span>

          <span class="past">{{ page.multilang.past }}</span>

        </div>
      </div>

      <div class="cal-entry__description">
        <span class="event-type"></span>,
        <time class="start-time" datetime=""></time>,
        <span class="start-location"><a target="_blank"></a></span>
      </div>

      <div class="cal-entry__data mono">
        <div>
          {{ page.multilang.sunsetat }} <span class="sunset-time"></span>
        </div>
        <div>
          <span class="phase-name"></span> <span class="moon-time"></span>
        </div>
      </div>

    </div>

  </template>
</div>

<footer class="mono">
  {{ page.multilang.more }}
</div>