ZDDC-website/index.html
Me Here 3d94478891
All checks were successful
Deploy content to live site / deploy (push) Successful in 2s
ZDDC website: archive, browse, and classify tools + reference
2026-06-11 12:53:40 -05:00

185 lines
11 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ZDDC — Zero Day Document Control</title>
<meta name="description" content="A file-naming convention and a few single-file HTML tools — browse any folder, classify files into deliverables, search the archive — for managing project deliverables. Self-contained, offline-capable, dependency-free.">
<meta property="og:type" content="website">
<meta property="og:url" content="https://zddc.varasys.io/">
<meta property="og:title" content="ZDDC — Zero Day Document Control">
<meta property="og:description" content="A file-naming convention and a few single-file HTML tools — browse any folder, classify files into deliverables, search the archive — for managing project deliverables. Self-contained, offline-capable, dependency-free.">
<meta name="theme-color" content="#2a5a8a">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
<link rel="stylesheet" href="css/style.css">
<style>
code.inline { background: var(--color-bg-subtle); padding: 0.1rem 0.35rem; border-radius: 4px; font-size: 0.9em; }
.tool-card--featured { border-color: var(--color-accent); box-shadow: 0 0 0 1px var(--color-accent) inset; }
.tool-card__tag { display: inline-block; font-size: 0.72em; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; color: #fff; background: var(--color-accent); border-radius: 4px; padding: 0.1rem 0.45rem; margin-bottom: 0.5rem; }
.tool-card__list { margin: 0.6rem 0 0 0; padding-left: 1.15rem; line-height: 1.55; color: var(--color-text); font-size: 0.95em; }
.tool-card__list li { margin-bottom: 0.35rem; }
.trust-card { background: var(--color-bg); border: 1px solid var(--color-border); border-radius: 10px; padding: 24px; }
.trust-card__icon { font-size: 1.7rem; line-height: 1; }
.trust-card h3 { margin: 0.5rem 0 0.4rem; font-size: 1.05rem; }
.trust-card p { margin: 0; color: var(--color-text-muted); font-size: 0.95rem; line-height: 1.55; }
</style>
</head>
<body>
<!-- Header -->
<header class="site-header">
<div class="container header-content">
<a href="/" class="brand">
<svg class="brand-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" aria-hidden="true">
<rect width="64" height="64" rx="12" fill="#1e3a5f"/>
<g fill="#fff">
<rect x="14" y="18" width="36" height="7"/>
<polygon points="43,25 50,25 21,43 14,43"/>
<rect x="14" y="43" width="36" height="7"/>
</g>
</svg>
<span class="brand-name">ZDDC</span>
</a>
<nav class="header-nav">
<div class="dropdown">
<button class="dropdown-toggle" type="button" aria-haspopup="true">
<span>Tools</span>
<svg viewBox="0 0 24 24" style="width: 14px; height: 14px; fill: currentColor;">
<path d="M7 10l5 5 5-5z"/>
</svg>
</button>
<div class="dropdown-menu">
<div class="dropdown-menu__inner">
<a href="releases/browse.html">
<svg class="dropdown-menu-icon" viewBox="0 0 24 24"><path d="M10 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V8c0-1.1-.9-2-2-2h-8l-2-2z"/></svg>
Browse
</a>
<a href="releases/classifier.html">
<svg class="dropdown-menu-icon" viewBox="0 0 24 24"><path d="M3 5h18v2H3V5zm0 6h18v2H3v-2zm0 6h12v2H3v-2z"/></svg>
Classify
</a>
<a href="releases/archive.html">
<svg class="dropdown-menu-icon" viewBox="0 0 24 24"><path d="M20 6H4a2 2 0 00-2 2v10a2 2 0 002 2h16a2 2 0 002-2V8a2 2 0 00-2-2zm0 12H4V8h16v10zM4 2h16v2H4z"/></svg>
Archive
</a>
</div>
</div>
</div>
<a href="reference.html" class="nav-link">Docs</a>
<a href="releases/" class="nav-link">Releases</a>
</nav>
</div>
</header>
<!-- Hero -->
<section class="hero">
<div class="container">
<h1>Zero Day Document Control</h1>
<p class="hero-subtitle">Three small tools for managing project deliverables, plus a simple file-naming convention. Each tool is one HTML file that runs entirely in your browser — open it, point it at a folder on your computer, and go. Nothing to install, no account, no server. Your files never leave your machine.</p>
<p style="margin-top: var(--spacing-md);"><a href="releases/browse.html" class="tool-card__link">Open Browse now →</a></p>
</div>
</section>
<main class="container" style="margin-bottom: var(--spacing-2xl);">
<section style="margin-top: var(--spacing-xl);">
<h2>What is it?</h2>
<p>ZDDC is a convention, not a platform. Every deliverable's filename encodes its tracking number, revision, status, and title; every transmittal folder is date-prefixed and self-describing. A plain folder on your computer or a shared drive becomes a fully searchable, auditable record — no server, no database, no software required to read it.</p>
<p>The three tools below are <em>optional</em> helpers around this structure. Each is a single HTML file that works entirely on your own machine: open it, pick a folder, and you're working. They run offline and never upload anything. You can start with <strong>Browse</strong> on your existing files right now — there's nothing to set up first.</p>
<p style="margin-top: var(--spacing-md);"><a href="reference.html">Read the full specification →</a></p>
</section>
<section style="margin-top: var(--spacing-2xl);">
<h2>The tools</h2>
<p>Three single-file apps. Click one to open it now, or right-click → <em>Save As</em> to keep your own copy — each works offline forever, with no install and no updates.</p>
<div class="tools-grid">
<a href="releases/browse.html" class="tool-card tool-card--featured" style="text-decoration: none; display: block;">
<span class="tool-card__tag">Start here</span>
<div class="tool-card__title">Browse</div>
<div class="tool-card__desc">Look at any folder — no setup at all.</div>
<ul class="tool-card__list">
<li>Open files on your computer and preview them instantly — PDFs, Word, Excel, images, markdown</li>
<li>Move through your folders the way you already think about them</li>
<li>Edit markdown in place and save it as Word, PDF, or HTML</li>
<li>Works completely offline; your files stay on your machine</li>
</ul>
<div class="tool-card__link" style="margin-top: var(--spacing-lg);">Open Browse →</div>
</a>
<a href="releases/classifier.html" class="tool-card" style="text-decoration: none; display: block;">
<div class="tool-card__title">Classify</div>
<div class="tool-card__desc">Name and sort a pile of incoming files.</div>
<ul class="tool-card__list">
<li>Rename messy files into clean, consistent names</li>
<li>Give each file a tracking number, revision, and status just by dropping it into place</li>
<li>Group deliverables into dated transmittal folders, ready to send</li>
<li>Edit like a spreadsheet; saves the organized copies back to your folder</li>
</ul>
<div class="tool-card__link" style="margin-top: var(--spacing-lg);">Open Classify →</div>
</a>
<a href="releases/archive.html" class="tool-card" style="text-decoration: none; display: block;">
<div class="tool-card__title">Archive</div>
<div class="tool-card__desc">Find anything in your record.</div>
<ul class="tool-card__list">
<li>Search and filter by tracking number, status, discipline, or plain text</li>
<li>See every revision of a deliverable and where it is in its lifecycle</li>
<li>Group by transmittal to see what was sent, and when</li>
<li>Download any selection as a ZIP — read-only, nothing gets changed</li>
</ul>
<div class="tool-card__link" style="margin-top: var(--spacing-lg);">Open Archive →</div>
</a>
</div>
<p style="margin-top: var(--spacing-lg); color: var(--color-text-muted);">To open a folder straight from your computer, use a Chromium-based browser — Chrome, Edge, or Brave. That one feature isn't available in Firefox or Safari yet. <a href="releases/">Browse all versions →</a></p>
</section>
<section style="margin-top: var(--spacing-2xl);">
<h2>But how can I trust you?</h2>
<p style="font-size: 1.1rem;">Great instinct — so don't. <strong>Verify instead.</strong> It takes about thirty seconds, and you never have to take our word for a thing.</p>
<div class="tools-grid">
<div class="trust-card">
<div class="trust-card__icon">🔌</div>
<h3>Pull the plug</h3>
<p>Turn off your WiFi and use it anyway. Still works? Then nothing is being uploaded — there's nowhere for it to go. Do your real work this way and the question answers itself.</p>
</div>
<div class="trust-card">
<div class="trust-card__icon">🧱</div>
<h3>It only sees what you hand it</h3>
<p>When you pick a folder, your browser fences the tool inside that one folder. It cannot peek anywhere else on your computer — even if it wanted to. That guarantee comes from the browser itself, not from us.</p>
</div>
<div class="trust-card">
<div class="trust-card__icon">🔎</div>
<h3>Read it yourself</h3>
<p>Each tool is a single open-source file. Open it up and look — or paste it into your favorite AI and ask, <em>“is this sending my data anywhere?”</em> Honest tools survive that question.</p>
</div>
</div>
<p style="margin-top: var(--spacing-lg); color: var(--color-text-muted);">We built it this way on purpose. The best privacy promise is the kind you can check for yourself.</p>
</section>
<section style="margin-top: var(--spacing-2xl);">
<h2>Learn more</h2>
<ul style="line-height: 1.9;">
<li><a href="reference.html">Technical Reference</a> — the full ZDDC convention: filename format, tracking numbers, revisions, status codes, folder naming, and transmittal workflow.</li>
<li><a href="releases/">All releases</a> — every version of every tool.</li>
<li><a href="https://codeberg.org/VARASYS/ZDDC">codeberg.org/VARASYS/ZDDC</a> — source code and issue tracker.</li>
</ul>
</section>
</main>
<footer class="site-footer">
<div class="container footer-content">
<span>ZDDC is open source — <a href="https://codeberg.org/VARASYS/ZDDC">codeberg.org/VARASYS/ZDDC</a></span>
</div>
</footer>
<script src="js/layout.js"></script>
</body>
</html>