feat(landing): standalone-tool strip on the site picker

Above the Groups / Projects cards, a horizontal strip of one link per
tool — each pointing at the latest stable single-file build on the
canonical release host (zddc.varasys.io/releases/<tool>_stable.html).
Useful for "try this tool" / offline use without first picking a
project.

Seven links (Archive, Transmittal, Classifier, Markdown, Browse, Form,
Tables). Landing itself is omitted from the strip — clicking landing
from landing is a no-op. Each card has the tool name in the display
serif and a short sans hint underneath. Wraps on narrow widths instead
of scrolling horizontally; sits inside pickerView so it auto-hides on
the per-project landing view.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
ZDDC 2026-05-11 11:17:24 -05:00
parent 6d72f5c770
commit 436e8ca066
3 changed files with 88 additions and 1 deletions

View file

@ -13,6 +13,51 @@ body {
padding: 0 16px 64px;
}
/* Standalone-tool strip. Sits above the hero on the picker view. Each
link is a small card with the tool name (display serif) and a short
one-line hint (sans, muted). Hover lifts the card slightly to signal
it's clickable; the strip wraps onto multiple lines on narrow widths
rather than scrolling horizontally. */
.tool-strip {
display: flex;
flex-wrap: wrap;
gap: 0.5rem;
margin: 0 0 24px;
padding: 0 4px;
}
.tool-strip__link {
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 2px;
padding: 0.5rem 0.85rem;
background: var(--bg);
border: 1px solid var(--border);
border-radius: var(--radius);
color: var(--text);
text-decoration: none;
transition: transform 0.12s, border-color 0.12s, box-shadow 0.12s;
min-width: 110px;
}
.tool-strip__link:hover {
border-color: var(--primary);
transform: translateY(-1px);
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
text-decoration: none;
}
.tool-strip__name {
font-family: var(--font-display);
font-weight: 600;
font-size: 1rem;
line-height: 1.15;
color: var(--text);
}
.tool-strip__hint {
font-size: 0.78rem;
color: var(--text-muted);
line-height: 1.2;
}
/* Welcome / hero */
.landing-hero {
margin: 0 0 24px;

View file

@ -34,6 +34,48 @@
<main id="landingMain" class="landing-main">
<!-- Picker mode (deployment root /). Project picker + groups. -->
<div id="pickerView">
<!-- Standalone-tool strip. Each link opens the latest stable
single-file build of one ZDDC tool from the canonical
release host (zddc.varasys.io/releases/). Useful for
"try this tool" / offline use without a project context. -->
<nav class="tool-strip" aria-label="ZDDC tools">
<a class="tool-strip__link" href="https://zddc.varasys.io/releases/archive_stable.html"
title="Browse a project archive — filter by party, status, revision">
<span class="tool-strip__name">Archive</span>
<span class="tool-strip__hint">Browse &amp; filter</span>
</a>
<a class="tool-strip__link" href="https://zddc.varasys.io/releases/transmittal_stable.html"
title="Compose, validate, and publish transmittals">
<span class="tool-strip__name">Transmittal</span>
<span class="tool-strip__hint">Issue &amp; receive</span>
</a>
<a class="tool-strip__link" href="https://zddc.varasys.io/releases/classifier_stable.html"
title="Rename incoming files into ZDDC tracking numbers">
<span class="tool-strip__name">Classifier</span>
<span class="tool-strip__hint">Rename incoming</span>
</a>
<a class="tool-strip__link" href="https://zddc.varasys.io/releases/mdedit_stable.html"
title="Markdown editor with multi-file FS-Access workflow">
<span class="tool-strip__name">Markdown</span>
<span class="tool-strip__hint">Edit prose</span>
</a>
<a class="tool-strip__link" href="https://zddc.varasys.io/releases/browse_stable.html"
title="Unified file tree + per-file-type preview">
<span class="tool-strip__name">Browse</span>
<span class="tool-strip__hint">Files &amp; preview</span>
</a>
<a class="tool-strip__link" href="https://zddc.varasys.io/releases/form_stable.html"
title="Schema-driven form renderer for *.form.yaml files">
<span class="tool-strip__name">Form</span>
<span class="tool-strip__hint">Structured input</span>
</a>
<a class="tool-strip__link" href="https://zddc.varasys.io/releases/tables_stable.html"
title="Aggregate a directory of YAML rows into a sortable table">
<span class="tool-strip__name">Tables</span>
<span class="tool-strip__hint">YAML rollup</span>
</a>
</nav>
<!-- Welcome / hero -->
<section class="landing-hero">
<h1>Welcome to the ZDDC Archive</h1>

View file

@ -1300,7 +1300,7 @@ body.help-open .app-header {
</svg>
<div class="header-title-group">
<span class="app-header__title" id="table-title">ZDDC Table</span>
<span class="build-timestamp"><span style="color:red;font-weight:bold">v0.0.17-alpha · 2026-05-11 01:11:21 · 1f03631-dirty</span></span>
<span class="build-timestamp"><span style="color:red;font-weight:bold">v0.0.17-alpha · 2026-05-11 16:16:57 · 6d72f5c-dirty</span></span>
</div>
</div>
<div class="header-right">