{% extends "blog/shell.html" %}

{% from "chirpui/card.html" import card %}
{% from "chirpui/hero.html" import page_hero %}
{% from "chirpui/layout.html" import cluster %}
{% from "chirpui/rendered_content.html" import rendered_content %}
{% from "chirpui/surface.html" import surface %}

{% block blog_content %}
{% let page_title = page?.title ?? "About" %}
{% let page_desc = params?.description ?? "" %}
{% let about_author = params?.author ?? "" %}
{% let about_author_title = params?.author_title ?? "" %}
{% let about_author_bio = params?.author_bio ?? "" %}
{% let about_author_links = params?.author_links ?? [] %}

{% call surface(variant="default", cls="chirp-theme-blog__surface chirp-theme-blog__surface--about") %}
  {% call page_hero(title=page_title, subtitle=page_desc, variant="minimal", background="solid", cls="chirp-theme-blog__hero") %}
    {% slot eyebrow %}About{% end %}
  {% end %}
  {% call rendered_content(cls="chirp-theme-blog__prose") %}{{ content | safe }}{% end %}
  {% if about_author %}
  {% call card(title=about_author, subtitle=about_author_title, cls="chirp-theme-blog__author") %}
    {% if about_author_bio %}<p>{{ about_author_bio }}</p>{% end %}
    {% if about_author_links | length > 0 %}
    {% call cluster(gap="xs") %}
      {% for link in about_author_links %}
      <a href="{{ link?.href ?? link?.url ?? '#' }}" rel="noopener">{{ link?.name ?? link?.label ?? "Link" }}</a>
      {% end %}
    {% end %}
    {% end %}
  {% end %}
  {% end %}
{% end %}
{% end %}