feat(layout-review): journey-level redesign — front door, taught order, consistency
Addresses the journey-level review (the app felt like 12 tools sharing a stylesheet, not one guided product). File-partitioned changes: Navigation (shell.js): rename Home -> "Start here" with front-door emphasis (.dt-nav-start); reorder Data Cleaners into pipeline order (Clean Text -> Standardize -> Fix Missing -> Find Duplicates); new "Finance" group (Reconcile, PDF to CSV); all stubs moved to a bottom "Coming soon" group, no longer interleaved with working tools. Front door (home.html): a prominent primary "Clean these files for me" that runs the recommended pipeline in order, above the existing per-finding cards (reframed as "fix one thing at a time"). Shared tokens (app.css): .dt-next-step suggestion strip + .dt-nav-start. Teach the order: a slim .dt-next-step strip at the end of each linear cleaner page points to the next pipeline step (Map Columns -> Start here; orchestrator/Finance pages correctly omit it). Local-first: the green "Runs 100% locally" pill now sits in every working tool page's header (home + 8 tools), where client data is entered. Plain English: jargon relabeled on input controls (coerce, E.164, NFC/NFKC, sentinels, survivor rule), technical terms kept in tooltips and audit/output cells only. Stubs (06/08/07): rebuilt to one identical skeleton — info line + plain feature list + a real "Notify me when this ships" button; every disabled control and uploader removed (a dimmed dropzone reads as broken). Intake: full dropzone+chip replaced with the compact "Using <file>" banner on Clean Text, Fix Missing, Find Duplicates, and both Reconcile sides. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -96,6 +96,44 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- ======================================================================
|
||||
FRONT DOOR — primary path. The orchestrator (09_pipeline_runner)
|
||||
wearing a friendly face: maps the analyzer's findings to the
|
||||
recommended pipeline (Clean Text → Standardize → Fix Missing →
|
||||
Find Duplicates) and runs them in order, returning a downloadable
|
||||
result. This is the hero of the page; the per-file findings below
|
||||
remain as the manual "fix one thing at a time" path.
|
||||
====================================================================== -->
|
||||
<div class="dt-card" style="border-color:var(--accent);background:var(--accent-fill);box-shadow:0 1px 2px rgba(28,25,23,0.03),0 0 0 1px var(--accent)">
|
||||
<div style="display:flex;align-items:flex-start;gap:14px;flex-wrap:wrap">
|
||||
<span class="dt-file-icon-chip" style="width:36px;height:36px;border-radius:var(--r-md)">
|
||||
<span class="dt-mi" style="font-family:'Material Symbols Outlined';font-size:20px">auto_awesome</span>
|
||||
</span>
|
||||
<div style="flex:1;min-width:240px">
|
||||
<h3 style="margin:0 0 4px;color:var(--ink)">Recommended</h3>
|
||||
<p style="margin:0;color:var(--ink-secondary)">Runs the recommended clean — fix text, standardize formats, fill blanks, remove duplicates — in the right order, then hands you the cleaned file.</p>
|
||||
</div>
|
||||
<button class="dt-btn dt-btn-primary" style="flex:0 0 auto;align-self:center">
|
||||
<span class="dt-mi">auto_fix_high</span> Clean these files for me
|
||||
</button>
|
||||
</div>
|
||||
<!-- Pipeline-step affordance: the order the findings will be resolved in -->
|
||||
<div style="display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:14px;padding-top:12px;border-top:1px solid var(--accent-fill-strong)">
|
||||
<span class="dt-count-pill" style="background:var(--surface);color:var(--ink-secondary)">1 · Clean Text</span>
|
||||
<span class="dt-mi" style="font-family:'Material Symbols Outlined';font-size:16px;color:var(--accent)">arrow_forward</span>
|
||||
<span class="dt-count-pill" style="background:var(--surface);color:var(--ink-secondary)">2 · Standardize</span>
|
||||
<span class="dt-mi" style="font-family:'Material Symbols Outlined';font-size:16px;color:var(--accent)">arrow_forward</span>
|
||||
<span class="dt-count-pill" style="background:var(--surface);color:var(--ink-secondary)">3 · Fix Missing</span>
|
||||
<span class="dt-mi" style="font-family:'Material Symbols Outlined';font-size:16px;color:var(--accent)">arrow_forward</span>
|
||||
<span class="dt-count-pill" style="background:var(--surface);color:var(--ink-secondary)">4 · Find Duplicates</span>
|
||||
<span class="dt-caption" style="margin-left:auto">Result downloads when finished</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Secondary / manual path — keep full control over each fix -->
|
||||
<h3 style="margin-top:24px">Or fix issues one at a time</h3>
|
||||
<p class="dt-caption" style="margin:-2px 0 4px">Prefer to handle things yourself? Open any finding to jump straight to the right tool.</p>
|
||||
|
||||
<!-- Per-file findings panel #1 -->
|
||||
<div class="dt-card">
|
||||
<div class="dt-finding-group-head">
|
||||
|
||||
Reference in New Issue
Block a user