gabe /presentato-mf

<!DOCTYPE html>
{%- set deck_theme = page.extra.theme | default(value=config.extra.default_theme) -%}
<html lang="en" data-theme="{{ deck_theme }}" data-default-theme="{{ deck_theme }}">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <title>{{ page.title }} — {{ config.title }}</title>

  {%- set hl = page.extra.reveal_highlight_theme | default(value=config.extra.reveal_highlight_theme) -%}
  {%- set transition = page.extra.reveal_transition | default(value=config.extra.reveal_transition) -%}

  {#- reveal.js needs the *raw* markdown, not Zola's rendered HTML, so read the
      source file back off disk and drop the TOML front matter. -#}
  {%- set source = load_data(path='content/' ~ page.relative_path, format='plain') -%}
  {%- set parts = source | split(pat='+++') -%}
  {%- set body = parts[2:] | join(sep='+++') -%}

  {% include "_theme_head.html" %}

  <link rel="stylesheet" href="{{ get_url(path='reveal/reset.css') }}">
  <link rel="stylesheet" href="{{ get_url(path='reveal/reveal.css') }}">
  {#- black.css supplies the structural dark theme; reveal-neiam.css then
      re-points every --r-* variable at the active neiam palette. -#}
  <link rel="stylesheet" href="{{ get_url(path='reveal/theme/black.css') }}">
  <link rel="stylesheet" href="{{ get_url(path='reveal-neiam.css') }}">
  <link rel="stylesheet" href="{{ get_url(path='reveal/plugin/highlight/' ~ hl ~ '.css') }}">
  {%- if page.extra.stylesheet %}
  <link rel="stylesheet" href="{{ get_url(path=page.extra.stylesheet) }}">
  {%- endif %}
</head>
<body>
  <div class="deck-theme" id="deck-theme" role="group" aria-label="Color scheme"></div>

  <div class="reveal">
    <div class="slides">
      <section data-markdown
               data-separator="^\r?\n---\r?\n"
               data-separator-vertical="^\r?\n--\r?\n"
               data-separator-notes="^Note:"
               data-charset="utf-8">
        <textarea data-template>
{{ body }}
        </textarea>
      </section>
    </div>
  </div>

  <script src="{{ get_url(path='themes.js') }}"></script>
  <script src="{{ get_url(path='reveal/reveal.js') }}"></script>
  <script src="{{ get_url(path='reveal/plugin/markdown.js') }}"></script>
  <script src="{{ get_url(path='reveal/plugin/highlight.js') }}"></script>
  <script src="{{ get_url(path='reveal/plugin/notes.js') }}"></script>
  <script src="{{ get_url(path='reveal/plugin/search.js') }}"></script>
  <script src="{{ get_url(path='reveal/plugin/zoom.js') }}"></script>
  <script>
    Reveal.initialize({
      hash: true,
      slideNumber: 'c/t',
      transition: '{{ transition }}',
      plugins: [RevealMarkdown, RevealHighlight, RevealNotes, RevealSearch, RevealZoom],
    });

    // Swatch row: pick any scheme directly, or cycle with T.
    (function () {
      const T = window.NeiamThemes;
      const box = document.getElementById("deck-theme");

      const buttons = T.themes.map((name) => {
        const b = document.createElement("button");
        b.className = "deck-theme__btn";
        b.type = "button";
        b.textContent = T.emoji[name];
        b.title = name;
        b.setAttribute("aria-label", name);
        b.addEventListener("click", () => T.set(name));
        box.appendChild(b);
        return [name, b];
      });

      function paint() {
        const active = T.current();
        buttons.forEach(([name, b]) =>
          b.setAttribute("aria-pressed", String(name === active)));
      }

      paint();
      window.addEventListener("themechange", paint);

      // reveal.js owns the keyboard; register through it so slides don't move.
      Reveal.addKeyBinding(
        { keyCode: 84, key: "T", description: "Cycle color scheme" },
        T.next);
    })();
  </script>
</body>
</html>