Files
datatools-dev/layout-review/home.html
Michael b6c39d7a09 refactor(layout-review): move assets to repo root
Relocate assets/ (app.css, shell.js) from layout-review/ up to the repo
root and rewrite every page's link/script refs to ../assets/.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
2026-06-08 15:31:53 +00:00

165 lines
7.3 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Layout review — File Analysis (Home)</title>
<link rel="stylesheet" href="../assets/app.css">
</head>
<body data-page="home">
<div class="dt-app">
<aside class="dt-sidebar" id="dt-sidebar"></aside>
<main class="dt-main">
<div class="dt-review-banner">
<span class="dt-mi">visibility</span>
<span>Static layout preview of the <strong>Home / File Analysis</strong> page, shown with three imported files in the post-analysis state. <a href="index.html">All pages →</a></span>
</div>
<div class="dt-main-inner">
<!-- Page header: brand block + privacy pill -->
<header class="dt-page-header">
<div class="dt-page-brand">
<div class="dt-page-brand-row">
<div class="dt-page-brand-mark">D</div>
<div class="dt-page-brand-words">
<span class="dt-page-eyebrow">UNALOGIX</span>
<h1 class="dt-page-wordmark">DataTools</h1>
</div>
</div>
<p class="dt-page-subtitle">Clean. Normalize. Transform.</p>
</div>
<span class="dt-privacy-pill">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor">
<rect x="4" y="11" width="16" height="10" rx="2"/>
<path d="M8 11V7a4 4 0 018 0v4"/>
</svg>
Runs 100% locally
</span>
</header>
<!-- Files section head -->
<div class="dt-files-section-head">
<h2>Files</h2>
<span class="dt-section-meta">3 files · 4.7 MB total</span>
</div>
<!-- Files card -->
<div class="dt-card" style="padding-bottom:0">
<div class="dt-file-row" style="padding:6px 0">
<button class="dt-btn dt-btn-tertiary" title="Remove"></button>
<span class="dt-file-icon-chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6"/></svg></span>
<span class="dt-file-name">customers_export.csv</span>
<span class="dt-file-size" style="margin-left:auto">2.1 MB</span>
</div>
<div class="dt-file-row" style="padding:6px 0">
<button class="dt-btn dt-btn-tertiary" title="Remove"></button>
<span class="dt-file-icon-chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6"/></svg></span>
<span class="dt-file-name">q3_transactions.xlsx</span>
<span class="dt-file-size" style="margin-left:auto">1.8 MB</span>
</div>
<div class="dt-file-row" style="padding:6px 0">
<button class="dt-btn dt-btn-tertiary" title="Remove"></button>
<span class="dt-file-icon-chip"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6"/></svg></span>
<span class="dt-file-name">vendor_list.csv</span>
<span class="dt-file-size" style="margin-left:auto">0.8 MB</span>
</div>
<button class="dt-file-add" style="margin-left:-16px;margin-right:-16px;width:calc(100% + 32px)">
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor"><path d="M12 5v14M5 12h14"/></svg> Add more files
</button>
</div>
<!-- Action bar -->
<div class="dt-btn-row" style="margin-top:16px;max-width:340px">
<button class="dt-btn dt-btn-primary">Run analysis</button>
<button class="dt-btn">Clear results</button>
</div>
<hr class="dt-divider">
<!-- Stats overview -->
<div class="dt-stats">
<div class="dt-stat">
<div class="dt-stat-label">Files analyzed</div>
<div class="dt-stat-value">3</div>
</div>
<div class="dt-stat">
<div class="dt-stat-label">Total findings</div>
<div class="dt-stat-value">14</div>
</div>
<div class="dt-stat is-warn">
<div class="dt-stat-label">Warnings</div>
<div class="dt-stat-value">9 <span class="dt-stat-unit">to review</span></div>
</div>
<div class="dt-stat is-info">
<div class="dt-stat-label">Info</div>
<div class="dt-stat-value">5 <span class="dt-stat-unit">suggestions</span></div>
</div>
</div>
<!-- Per-file findings panel #1 -->
<div class="dt-card">
<div class="dt-finding-group-head">
<span class="dt-finding-group-chevron" style="transform:rotate(90deg)">chevron_right</span>
<span class="dt-severity-dot warn"></span>
<span class="dt-group-filename">customers_export.csv</span>
<div class="dt-group-counts">
<span class="dt-count-pill warn">6 warnings</span>
<span class="dt-count-pill info">2 info</span>
</div>
</div>
<div class="dt-finding-row">
<span class="dt-finding-icon warn"><span class="dt-mi">priority_high</span></span>
<div class="dt-finding-body">
<p class="dt-finding-title"><strong>312 duplicate rows</strong> across exact + near matches</p>
<p class="dt-finding-meta">column: email · Find Duplicates →</p>
</div>
</div>
<div class="dt-finding-row">
<span class="dt-finding-icon warn"><span class="dt-mi">format_color_text</span></span>
<div class="dt-finding-body">
<p class="dt-finding-title"><strong>1,204 cells</strong> with leading / trailing whitespace</p>
<p class="dt-finding-meta">columns: name, city · Clean Text →</p>
</div>
</div>
<div class="dt-finding-row">
<span class="dt-finding-icon info"><span class="dt-mi">event</span></span>
<div class="dt-finding-body">
<p class="dt-finding-title">Mixed date formats in <strong>signup_date</strong></p>
<p class="dt-finding-meta">3 formats detected · Standardize Formats →</p>
</div>
</div>
</div>
<!-- Per-file findings panel #2 (collapsed) -->
<div class="dt-card" style="padding-bottom:16px">
<div class="dt-finding-group-head" style="margin-bottom:-16px;border-radius:var(--r-lg);border-bottom:none">
<span class="dt-finding-group-chevron">chevron_right</span>
<span class="dt-severity-dot warn"></span>
<span class="dt-group-filename">q3_transactions.xlsx</span>
<div class="dt-group-counts">
<span class="dt-count-pill warn">3 warnings</span>
<span class="dt-count-pill info">3 info</span>
</div>
</div>
</div>
<!-- Per-file findings panel #3 (clean) -->
<div class="dt-card" style="padding-bottom:16px">
<div class="dt-finding-group-head" style="margin-bottom:-16px;border-radius:var(--r-lg);border-bottom:none">
<span class="dt-severity-dot success"></span>
<span class="dt-group-filename">vendor_list.csv</span>
<div class="dt-group-counts">
<span class="dt-count-pill success">no issues</span>
</div>
</div>
</div>
</div>
</main>
</div>
<footer class="dt-footer" id="dt-footer"></footer>
<script src="../assets/shell.js"></script>
</body>
</html>