{{template "layout" .}}

{{define "title"}}Luxtools · Go + HTMX demo{{end}}

{{define "content"}}
<fieldset class="tui-fieldset" style="padding: 2rem;">
  <legend>Luxtools control panel</legend>
  <p class="tui-text-white">
    Luxtools demonstrates a Go backend compiled into a single binary. The UI
    uses <strong>TUI.CSS</strong> for a retro feel and <strong>HTMX</strong> for
    partial page updates without JavaScript glue code.
  </p>

  <section style="margin-top: 1.5rem;">
    <h2 class="tui-text-green">Interactive counter</h2>
    <p class="tui-text-silver">
      Click the button to trigger an <code>hx-post</code> request. The response
      replaces only the counter panel.
    </p>
    <div
      id="counter"
      hx-get="/counter"
      hx-trigger="load"
      hx-swap="outerHTML"
    >
      <div class="tui-panel tui-panel-inline">Loading…</div>
    </div>
  </section>

  <section style="margin-top: 1.5rem;">
    <h2 class="tui-text-green">Server time</h2>
    <p class="tui-text-silver">
      A periodic <code>hx-get</code> refresh keeps this panel in sync with the
      server clock.
    </p>
    <div
      id="server-time"
      hx-get="/time"
      hx-trigger="load, every 5s"
    >
      <div class="tui-panel tui-panel-inline">Loading…</div>
    </div>
  </section>
</fieldset>
{{end}}