201 lines
7.8 KiB
HTML
201 lines
7.8 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<script>window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments)}gtag("consent","default",{ad_storage:"granted",ad_user_data:"granted",ad_personalization:"granted",analytics_storage:"granted"});gtag("consent","default",{ad_storage:"denied",ad_user_data:"denied",ad_personalization:"denied",analytics_storage:"denied",region:"AT,BE,BG,HR,CY,CZ,DK,EE,FI,FR,DE,GR,HU,IE,IT,LV,LT,LU,MT,NL,PL,PT,RO,SK,SI,ES,SE,IS,LI,NO,GB,CH,UA".split(",")});</script>
|
|
<!-- Google tag (gtag.js) -->
|
|
<script async src="https://www.googletagmanager.com/gtag/js?id=G-X1MKL6C4B0"></script>
|
|
<script>window.dataLayer=window.dataLayer||[];function gtag(){dataLayer.push(arguments)}gtag("js",new Date());gtag("config","G-X1MKL6C4B0");</script>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<link rel="icon" href="favicon.ico">
|
|
<title>PCB ReTrace</title>
|
|
<link rel="stylesheet" href="common.css">
|
|
<style>
|
|
/* OVERRIDE COMMON.CSS APP LOCKS */
|
|
/* This ensures the landing page scrolls normally and footer is visible */
|
|
html, body {
|
|
height: auto !important;
|
|
overflow-y: auto !important; /* Force scrollbar */
|
|
display: block !important; /* Disable app flex layout */
|
|
margin: 0;
|
|
padding: 0;
|
|
background: white;
|
|
color: var(--text-default);
|
|
}
|
|
|
|
:root { --hero-bg: #f8fafc; --text-main: #0f172a; --text-sub: #475569; --primary: #2563eb; }
|
|
|
|
/* HERO SECTION */
|
|
.hero {
|
|
padding: 4rem 1rem 3rem;
|
|
text-align: center;
|
|
background: radial-gradient(circle at 50% 50%, #f1f5f9 0%, #fff 70%);
|
|
border-bottom: 1px solid #e2e8f0;
|
|
}
|
|
.hero h1 { font-size: 2.5rem; margin-bottom: 1rem; letter-spacing: -0.05em; color: var(--text-main); }
|
|
.hero p { font-size: 1.2rem; color: var(--text-sub); max-width: 600px; margin: 0 auto 2rem; }
|
|
|
|
.cta-button {
|
|
display: inline-block;
|
|
background: var(--primary); color: white;
|
|
padding: 0.8rem 2rem; border-radius: 2rem;
|
|
font-weight: 700; text-decoration: none; font-size: 1.1rem;
|
|
box-shadow: 0 4px 6px rgba(37, 99, 235, 0.2);
|
|
transition: transform 0.1s, box-shadow 0.1s;
|
|
}
|
|
.cta-button:hover { transform: translateY(-2px); box-shadow: 0 6px 12px rgba(37, 99, 235, 0.3); }
|
|
.cta-button:active { transform: translateY(0); }
|
|
|
|
.secondary-links { margin-top: 1.5rem; display: flex; gap: 1rem; justify-content: center; font-size: 0.9rem; }
|
|
.secondary-links a { color: var(--text-sub); text-decoration: none; border-bottom: 1px dotted #ccc; }
|
|
|
|
/* FEATURES GRID */
|
|
.features {
|
|
max-width: 1000px; margin: 3rem auto; padding: 0 1rem;
|
|
display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem;
|
|
}
|
|
.feature-card { padding: 1.5rem; border: 1px solid #e2e8f0; border-radius: 1rem; transition: border-color 0.2s; }
|
|
.feature-card:hover { border-color: var(--primary); }
|
|
.feature-icon { font-size: 2rem; margin-bottom: 1rem; display: block; }
|
|
.feature-icon-svg {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
.feature-icon-svg svg {
|
|
width: 2.5rem;
|
|
height: 2.5rem;
|
|
display: block;
|
|
}
|
|
.feature-card h3 { margin: 0 0 0.5rem; color: var(--text-main); }
|
|
.feature-card p { color: var(--text-sub); font-size: 0.95rem; margin: 0; }
|
|
|
|
/* TOOLS LIST */
|
|
.tools-section { background: #f8fafc; padding: 3rem 1rem; border-top: 1px solid #e2e8f0; }
|
|
.tools-container { max-width: 800px; margin: 0 auto; }
|
|
.tools-title { text-align: center; margin-bottom: 2rem; text-transform: uppercase; letter-spacing: 0.05em; color: #64748b; font-size: 0.9rem; font-weight: 700; }
|
|
|
|
.tool-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 1rem; }
|
|
.tool-link {
|
|
background: white; border: 1px solid #e2e8f0; border-radius: 0.5rem;
|
|
padding: 1rem; text-align: center; text-decoration: none; color: inherit;
|
|
transition: transform 0.2s;
|
|
}
|
|
.tool-link:hover { transform: translateY(-3px); border-color: var(--primary); }
|
|
.tool-link strong { display: block; color: var(--primary); margin-bottom: 0.2rem; }
|
|
.tool-link span { font-size: 0.8rem; color: #64748b; }
|
|
|
|
footer.landing-footer {
|
|
margin-top: 0;
|
|
padding: 2rem 1rem;
|
|
text-align: center;
|
|
background: white;
|
|
border-top: 1px solid #e2e8f0;
|
|
color: #94a3b8;
|
|
font-size: 0.8rem;
|
|
}
|
|
footer.landing-footer a { color: inherit; text-decoration: underline; }
|
|
|
|
@media (max-width: 600px) {
|
|
.hero { padding: 3rem 1rem; }
|
|
.hero h1 { font-size: 2rem; }
|
|
.tool-grid { grid-template-columns: 1fr; }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
|
|
<div class="hero">
|
|
<h1>PCB ReTrace</h1>
|
|
<p>Digitize, document, and reverse engineer printed circuit boards. Map components, trace nets, inspect layers, and generate schematics. Runs entirely in your browser.</p>
|
|
|
|
<a href="studio.html" class="cta-button">Launch Studio</a>
|
|
|
|
<div class="secondary-links">
|
|
<a href="guide.html">📖 User Guide & Documentation</a>
|
|
<a href="https://dev-lab.github.io/pcb-retrace-examples/" target="_blank">🚀 Examples Gallery</a>
|
|
<a href="https://github.com/dev-lab/pcb-retrace">GitHub Repo</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="features">
|
|
<!-- 1. Privacy (Core) -->
|
|
<div class="feature-card">
|
|
<span class="feature-icon">🔒</span>
|
|
<h3>Privacy First</h3>
|
|
<p>Zero cloud upload. All images and data are stored in your browser's local database. Works 100% offline.</p>
|
|
</div>
|
|
|
|
<!-- 2. Visual Inspection (Core) -->
|
|
<div class="feature-card">
|
|
<span class="feature-icon">👁️</span>
|
|
<h3>Auto-Stitch & X-Ray</h3>
|
|
<p>Align close-up shots with wide-angle views. Stitch Top vs. Bottom layers to inspect traces through the board.</p>
|
|
</div>
|
|
|
|
<!-- 3. BOM Management (New - Requested) -->
|
|
<div class="feature-card">
|
|
<span class="feature-icon">📝</span>
|
|
<h3>Visual BOM</h3>
|
|
<p>Map components directly on the image. Record values, references, and descriptions, then export to CSV.</p>
|
|
</div>
|
|
|
|
<!-- 4. Netlist Tracing (Workflow) -->
|
|
<div class="feature-card">
|
|
<span class="feature-icon">🕸️</span>
|
|
<h3>Net Tracing</h3>
|
|
<p>Document connectivity across layers. Define nets, label nodes, and export netlists (<code>.net</code>,<code>.cir</code> for KiCad, SPICE).</p>
|
|
</div>
|
|
|
|
<!-- 5. Schematics (Workflow) -->
|
|
<div class="feature-card">
|
|
<span class="feature-icon feature-icon-svg">
|
|
<svg viewBox="0 0 24 24" aria-hidden="true">
|
|
<line x1="3" y1="16" x2="21" y2="16" stroke="currentColor" stroke-width="2"/>
|
|
<line x1="12" y1="3" x2="12" y2="16" stroke="currentColor" stroke-width="2"/>
|
|
<circle cx="12" cy="16" r="2.5" fill="currentColor"/>
|
|
</svg>
|
|
</span>
|
|
<h3>Schematics</h3>
|
|
<p>Generate interactive schematic diagrams, resolve placeholders into real components, and export to KiCad (<code>.kicad_sch</code>).</p>
|
|
</div>
|
|
|
|
<!-- 6. Deep Linking (New - Sharing) -->
|
|
<div class="feature-card">
|
|
<span class="feature-icon">🔗</span>
|
|
<h3>Deep Linking</h3>
|
|
<p>Share projects instantly. Host your Device ZIP on GitHub or any CORS-enabled server and open it via a direct URL.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="tools-section">
|
|
<div class="tools-container">
|
|
<div class="tools-title">Included Utilities</div>
|
|
<div class="tool-grid">
|
|
<a href="schema.html" class="tool-link">
|
|
<strong>Schema ReTrace</strong>
|
|
<span>Standalone Schematic Generator</span>
|
|
</a>
|
|
<a href="resistor.html" class="tool-link">
|
|
<strong>Resistor Decoder</strong>
|
|
<span>3-6 Bands & Reverse Lookup</span>
|
|
</a>
|
|
<a href="inductor.html" class="tool-link">
|
|
<strong>Inductor Decoder</strong>
|
|
<span>Standard & Military Codes</span>
|
|
</a>
|
|
<a href="coil.html" class="tool-link">
|
|
<strong>Coil Calculator</strong>
|
|
<span>Air-core Inductance</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<footer class="landing-footer">
|
|
<p>Dual Licensed: <strong>AGPL v3</strong> (Open Source) + <strong>Commercial</strong>.</p>
|
|
<p>Copyright © 2025—2026 Taras Greben — <a href="https://pcb.etaras.com">pcb.eTaras.com</a></p>
|
|
</footer>
|
|
|
|
</body>
|
|
</html>
|