AkurAI-Framework / site/frontend/header.html

Latest change 68c23789cce8e807c988190dcb1e6a3699cd5ed6 - OLI-156: path-prefix locales, hreflang alternates, sitemap xhtml:link by Ólafur Búi Ólafsson

<!doctype html>
<html lang="{{ __locale }}">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>{% if meta_title %}{{ meta_title }}{% else %}{{ title }}{% endif %}</title>
    <meta name="description" content="{% if meta_description %}{{ meta_description }}{% else %}{{ description }}{% endif %}" />
    <meta property="og:type" content="website" />
    <meta property="og:title" content="{% if meta_title %}{{ meta_title }}{% else %}{{ title }}{% endif %}" />
    <meta property="og:description" content="{% if meta_description %}{{ meta_description }}{% else %}{{ description }}{% endif %}" />
    {% if hreflang_links %}{{{ hreflang_links }}}{% endif %}
    <link rel="icon" href="/favicon.svg" type="image/svg+xml" />
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" />
    <link rel="stylesheet" href="/styles.css" />
    <!-- Named multi-theme tokens (:root[data-theme]); must come after styles.css
         so the active theme's values win. -->
    <link rel="stylesheet" href="/themes.css" />
    <!-- Flash-guard: set the suite-wide theme before first paint. Reads the
         shared `.olibuijr.com` cookie first (global across apps), then this
         app's localStorage, then the OS preference. -->
    <script>
      (function () {
        try {
          var m = document.cookie.match(/(?:^|; )akurai-theme=([^;]*)/);
          var t = (m ? decodeURIComponent(m[1]) : null) || localStorage.getItem("akurai-theme");
          if (!t) t = matchMedia("(prefers-color-scheme: light)").matches ? "akurai-light" : "akurai";
          document.documentElement.setAttribute("data-theme", t);
        } catch (e) {}
      })();
    </script>
    <script type="module" src="/theme.js"></script>
    <script type="module" src="/lang.js"></script>
  </head>
  <body>
    <header class="nav">
      <a class="brand" href="/"><span class="mark" aria-hidden="true"><svg viewBox="0 0 32 32" fill="currentColor" role="img"><path fill-rule="evenodd" clip-rule="evenodd" d="M13.38 3.23c1.05-2.23 4.19-2.23 5.24 0l11.05 23.62A2.91 2.91 0 0 1 27.03 31h-3.42c-1.17 0-2.22-.7-2.67-1.78l-2.05-4.93h-5.78l-2.05 4.93A2.9 2.9 0 0 1 8.39 31H4.97a2.91 2.91 0 0 1-2.64-4.15L13.38 3.23ZM16 11.17l-5.13 13.1h10.26L16 11.17Z"/><path d="M10.38 20.54h11.24a2.23 2.23 0 0 1 0 4.46H10.38a2.23 2.23 0 0 1 0-4.46Z"/></svg></span> AkurAI<span class="brand-dim">/Framework</span></a>
      <nav class="nav-links">
        {% for link in nav %}<a href="{{ link.href }}">{{ link.label }}</a>{% endfor %}
        <span data-lang-toggle></span>
        <span class="theme-picker" data-theme-picker></span>
      </nav>
    </header>