author.hbs

{{!< default}}

{{#author}}
  <section class="px-4 sm:px-6" data-author>
    <div class="max-w-xl mx-auto py-16 md:py-20 flex flex-col gap-3 items-center justify-center text-center">
      {{#if profile_image}}
        <figure class="rounded-full h-full relative">
          {{> image
            image_type="author"
            image_class="w-full object-cover w-24 h-24 rounded-full aspect-square"
            image_url=profile_image
            size_xs=true
            size_s=true
            size_m=true
            sizes="(max-width: 600px) 100px, 160px"
            loading="eager"
          }}
        </figure>
      {{/if}}
      <h1 class="font-semibold tracking-tight text-2xl md:text-3xl lg:text-4xl">{{name}}</h1>
      {{#if bio}}
        <p class="font-light text-lg text-typ-tone">{{bio}}</p>
      {{/if}}
    </div>
  </section>
{{/author}}

{{!-- Posts --}}
<section class="px-4 sm:px-6 mb-24" data-feed-section="{{posts.length}}">
  <div class="max-w-container mx-auto">
    <h2 class="text-sm font-semibold uppercase text-typ-tone border-b border-brd mb-6 pb-2.5">{{t "Latest"}}</h2>

    {{!-- Feed --}}
    {{> post-feed}}
    
    {{!-- Pagination --}}
    {{> pagination}}
  </div>
</section>