Files
cnx_vinyl/site/public/index.html
T
grabowski dd7b749af9
Deploy test site / deploy (push) Successful in 51s
Factory console: demo fleet of one Duplex system and one Classic
Three presses for now (D1-A, D1-B on one Newbilt Duplex system, C1
Classic) instead of the plan's two Duplex systems. Order arrivals scaled
to the smaller fleet (about 3,000 to 4,600 good records a day); press
row fills the width; landing page text updated.
2026-10-16 10:29:39 +07:00

156 lines
6.8 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="robots" content="noindex, nofollow">
<title>CNX Vinyl · internal test site</title>
<script>
(function(){var t=null;try{t=localStorage.getItem("cnx-theme")}catch(e){}
if(t!=="light"&&t!=="dark")t=window.matchMedia&&matchMedia("(prefers-color-scheme: light)").matches?"light":"dark";
document.documentElement.setAttribute("data-theme",t);})();
</script>
<style>
:root {
--bg: #0a0f1a; --panel: #0f1626; --stroke: #2a3a56;
--fg: #d6deeb; --mute: #8a97b0; --accent: #3ddc84;
}
:root { color-scheme: dark; }
html[data-theme=light] {
color-scheme: light;
--bg: #f4f6fa; --panel: #ffffff; --stroke: #cfd8e6;
--fg: #1b2533; --mute: #5b6880; --accent: #0e8f4f;
}
main { position: relative; }
.themebtn {
position: absolute; top: 48px; right: 20px; background: var(--panel); color: var(--fg);
border: 1px solid var(--stroke); border-radius: 5px; padding: 6px 12px; font: inherit; font-size: 14px; cursor: pointer;
}
.themebtn:hover { border-color: var(--accent); }
* { box-sizing: border-box; }
body {
margin: 0; background: var(--bg); color: var(--fg);
font: 16px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}
main { max-width: 760px; margin: 0 auto; padding: 48px 20px; }
h1 { margin: 0; font-size: 28px; letter-spacing: 0.02em; }
.tag {
display: inline-block; margin-top: 6px; padding: 2px 8px;
border: 1px solid var(--stroke); border-radius: 4px;
color: var(--mute); font-size: 13px;
}
p.lead { color: var(--mute); margin: 18px 0 32px; }
h2 {
font-size: 13px; text-transform: uppercase; letter-spacing: 0.08em;
color: var(--mute); margin: 32px 0 12px;
}
ul { list-style: none; margin: 0; padding: 0; }
li a {
display: block; padding: 14px 16px; margin-bottom: 10px;
background: var(--panel); border: 1px solid var(--stroke); border-radius: 6px;
color: var(--fg); text-decoration: none;
}
li a:hover, li a:focus-visible { border-color: var(--accent); }
li strong { display: block; color: var(--accent); font-weight: 600; }
li span { color: var(--mute); font-size: 14px; }
footer { margin-top: 40px; color: var(--mute); font-size: 13px; }
</style>
</head>
<body>
<main>
<button class="themebtn" id="themeBtn" type="button">Light mode</button>
<h1>CNX Vinyl</h1>
<span class="tag">internal test site</span>
<p class="lead">
Demos and static pages from the CNX Vinyl planning repository, a vinyl
pressing plant planned near Chiang Mai. Shared by link only and not
indexed. Figures in the demos are planning estimates.
</p>
<h2>Demos</h2>
<ul>
<li>
<a href="demos/plant-operation/">
<strong>Plant overview (simulated SCADA)</strong>
<span>The mature plant animated at real cycle times: Newbilt Duplex
and Classic presses, Pheenix Alpha electroforming and Sibert stamper
prep, from PVC intake and the material lab through pressing,
inspection, packaging and fulfillment, with the artist gates,
utilities and energy alongside. Real time up to a day in 24 s;
every station is clickable; on a phone, turn it sideways and pinch
to zoom.</span>
</a>
</li>
<li>
<a href="demos/fleet-calculator/">
<strong>Press fleet calculator</strong>
<span>Set the records a year and the share of splatter and specials;
it sizes the mix of Newbilt Duplex systems and Classic automatic
presses and lists what that fleet needs: people, power, central
hydraulics, steam, cooling, compressed air, floor, compound and
stampers, from the start fleet to a fully equipped press hall.
Every assumption is editable and a scenario can be shared by
link.</span>
</a>
</li>
<li>
<a href="demos/steam-cooling/">
<strong>Steam and cooling plant</strong>
<span>The utilities for the five-press fleet as a clickable process
diagram: boiler bank, steam header and condensate return, chiller
bank, plate heat exchanger and a branch to every press. Switch
between the launch press, the full fleet and one module down to see
demand against installed capacity.</span>
</a>
</li>
<li>
<a href="demos/make-a-record/">
<strong>Make a record (investor demo)</strong>
<span>The artist platform as a customer sees it: design a record
against a to-scale mock-up, check the music and artwork, see one
clear price, let fans fund the pressing, follow production through
the artist approvals and open the record passport of one delivered
copy. Switch on investor notes for the business case behind each
step, or press Tour for a one-minute walk-through.</span>
</a>
</li>
<li>
<a href="demos/factory/">
<strong>Factory console and order status (investor demo)</strong>
<span>The factory application on a simulated plant day: a Newbilt
Duplex system and a Classic with live counters, every record through optical
inspection, audio samples, the material lab gate, stamper
metrology and the hash-chained event log. Switch to the customer
portal to follow the same orders: steps and approvals, copies
pressed so far, lab and inspection results. Simulated data.</span>
</a>
</li>
<li>
<a href="demos/artist-order/">
<strong>Artist ordering and fan funding</strong>
<span>Configure a record, type the track list or drop the master
files and artwork (checked in the browser, nothing is uploaded), get
an itemised offer with the price per copy against quantity and the
lead time, then order directly or run a fan-funded campaign to a
funded or missed end and follow the production through the artist
approvals. Indicative demo prices.</span>
</a>
</li>
</ul>
<footer>Built from <code>site/</code> in the cnx_vinyl repository.</footer>
</main>
<script>
(function(){
var b=document.getElementById("themeBtn"),de=document.documentElement;
function set(t,save){de.setAttribute("data-theme",t);if(save){try{localStorage.setItem("cnx-theme",t)}catch(e){}}
b.textContent=t==="light"?"☾ Dark mode":"☀ Light mode";b.title="Switch to "+(t==="light"?"dark":"light")+" mode";}
set(de.getAttribute("data-theme")||"dark",false);
b.addEventListener("click",function(){set(de.getAttribute("data-theme")==="light"?"dark":"light",true);b.blur();});
var mq=window.matchMedia&&matchMedia("(prefers-color-scheme: light)");
if(mq&&mq.addEventListener)mq.addEventListener("change",function(e){var s=null;try{s=localStorage.getItem("cnx-theme")}catch(_){}if(!s)set(e.matches?"light":"dark",false);});
})();
</script>
</body>
</html>