Yuika/tag.hbs

{{!< default}}
<div>
{{> "site-header"}}
</div>

{{#tag}}
<div class="h-64 relative">
  {{> header-background background=feature_image}} {{!--Special header-image.hbs partial to generate the background image--}}
    <div class="h-full opacity-50 bg-black">
    </div>
  </div>
  <div class="absolute bottom-0 py-6">
   <div class="container mx-auto px-2 sm:px-8 md:px-16 lg:px-32 xl:px-64">
    <div>
      <p class="bg-blue-700 w-auto inline-block px-2 py-1 text-white text-sm">Tag</p>
    </div>
    <div>
      <h1 class="text-white text-2xl md:text-4xl">{{name}}</h1>
    </div>
    <div class="text-white">
      {{#if description}}
      <p>{{description}}</p>
      {{else}}
      <p>A collection of {{plural ../pagination.total empty='posts' singular='% post' plural='% posts'}}</p>
      {{/if}}
    </div>
   </div>
  </div>
</div>
{{/tag}}

<div class="flex flex-wrap justify-start post-feed content w-full px-4">
  {{#foreach posts}}
    {{> "post-card"}}
  {{/foreach}}
</div>