517320aad2
the project lead: "a site now what is on par with our current miner and wallet app look and feel with the new animation ... simple and
beautiful ... apple and windows icons everywhere needed, GPU brand icons ... easy access to all of our pages without a header
that is crazy".
- site.css section 10: the miner and wallet apps' treatments (app.css miner-ui-5, wallet-0.1.5) over the package: buttons
(Plex Sans 600, radius 10), the status pill, graphite cards at 16 and rows at 12 on the hairline, the wallet lock screen's
ember glow, the mark wells; the fourteen palette tokens stay in the scene-tokens block (scene/tokens.css); light and dark.
- Navigation: the seven-item header is gone. The slim bar carries the mark, a DEVNET pill with the live dot, Mine / Network /
Learn (each opens a panel listing every route of its group with one line), the theme toggle and Download; on phones one
button opens a full-screen sheet with the same groups. Keyboard: arrows between groups, Escape closes and returns focus,
Tab walks a panel, the sheet is a dialog with its focus kept. The gate's header check is the new rule
(tools/ci/site-nav-check.mjs: the bar, the three groups with their aria, 18 routes in the panels and the sheet with their
descriptions, Download, the burger; self-test known-failed first).
- Home: one fold. The mark on the ember glow, one line, Download for Windows and Download for macOS with the OS glyphs and the
stamped version (the visitor's platform first), "Linux and HiveOS" to /download, IgneumDag 2.0.3 painting underneath from
/api/live through IgneumFeed (window 60, fps 60, poll false, no fork). Below: three lines on what a miner gets (E5 and X35
verbatim), the live network in three tiles (hash rate, blocks a second, locked checkpoint; X2 and X31 verbatim), the
community row (Discord, GitHub, Reddit), the footer (X7). The scene scripts are deferred; fonts preload with swap.
- /download: a new route. Windows, macOS, Linux and HiveOS cards with their marks, the stamped version, size and sha256, the
HiveOS flight sheet, the three steps, the card picker with the vendor badge, the wallet for macOS; Windows wallet named as
next with no file.
- Marks: brand/marks/vendor-marks.mjs (gpu-logos lane, a94dd192) copied byte for byte to site/lib/marks.mjs (the build and a
gate line refuse drift); site/lib/os-marks.mjs adds Linux and HiveOS in the same treatment. The build stamps
<span data-os> and <span data-gpu> and puts the vendor's mini badge in front of every table cell that names a card
(/miner, /miners, the bench table), writes the --mark-* tokens into site.css between markers, and hands yourcard.js the
badges as JSON for the card picker. The vendor well is scoped to [data-mark] so the ledger's and the journey's own
.badge keep their look.
- The footer carries the four OS download chips; the nav's group wrappers are .nav-group (the wallet page owns .group).
- tools/site/serve.mjs and capture.sh: the site as Vercel serves it with /api passed to the live observer, captured on
igneum-build-2 at 390 and 1440, dark and light (docs/plans/site-ui-5-shots, the home set in this commit). The overlap
lane's detector ran over every page on build-2: 0 overlaps after the two fixes here (the explorer's hash titles wrap, the
ledger's status badges wrap at 390).
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
18 lines
2.2 KiB
JavaScript
18 lines
2.2 KiB
JavaScript
// OS marks for the site (site-ui-5, 7 October 2026). Windows and macOS come from the vendor marks module verbatim
|
|
// (brand/marks/vendor-marks.mjs, copied byte for byte to site/lib/marks.mjs by the build's check). Linux and HiveOS are
|
|
// drawn here in the same treatment: 24 x 24 viewBox at 22 px, under 600 bytes, currentColor, a simplified monochrome
|
|
// mark that names the platform (the penguin's outline; a hive cell with its rig inside). Every OS mark sits in the
|
|
// brand's monochrome well (.osmark in site.css), never a vendor tint: an OS is a place the miner runs, not a card.
|
|
import { OS_MARKS } from './marks.mjs';
|
|
const SVG = '<svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true" focusable="false"';
|
|
export const OS = {
|
|
windows: { label: 'Windows', svg: OS_MARKS.windows },
|
|
mac: { label: 'macOS', svg: OS_MARKS.macos },
|
|
linux: { label: 'Linux', svg: SVG + ' fill="currentColor"><path d="M12 2c-2.4 0-4 1.9-4 4.6 0 1.2.2 2 0 2.8-.6 1.4-2.1 2.9-2.6 4.9-.3 1.1-.1 2 .3 2.6-.6.4-1.3 1-1.1 1.7.3 1 2.1 1.2 3.2 1.8.7.4 1.5.6 2.1.1.6.2 1.3.3 2.1.3s1.5-.1 2.1-.3c.6.5 1.4.3 2.1-.1 1.1-.6 2.9-.8 3.2-1.8.2-.7-.5-1.3-1.1-1.7.4-.6.6-1.5.3-2.6-.5-2-2-3.5-2.6-4.9-.2-.8 0-1.6 0-2.8C16 3.9 14.4 2 12 2zm-1.4 4.2c.5 0 .8.5.8 1.2s-.3 1.2-.8 1.2-.8-.5-.8-1.2.3-1.2.8-1.2zm2.8 0c.5 0 .8.5.8 1.2s-.3 1.2-.8 1.2-.8-.5-.8-1.2.3-1.2.8-1.2zM12 9.3c.9 0 1.9.5 1.9 1s-1 1.2-1.9 1.2-1.9-.7-1.9-1.2 1-1 1.9-1zm0 3.4c2.2 0 3.6 2.6 3.6 4.4 0 1.5-1.6 2.3-3.6 2.3s-3.6-.8-3.6-2.3c0-1.8 1.4-4.4 3.6-4.4z"/></svg>' },
|
|
hive: { label: 'HiveOS', svg: SVG + ' fill="none" stroke="currentColor" stroke-width="1.7" stroke-linejoin="round" stroke-linecap="round"><path d="M12 2.6 20.2 7.3v9.4L12 21.4 3.8 16.7V7.3z"/><path d="M12 7.4 16 9.7v4.6L12 16.6 8 14.3V9.7z"/><path d="M12 7.4V2.6M16 9.7l4.2-2.4M16 14.3l4.2 2.4M12 16.6v4.8M8 14.3l-4.2 2.4M8 9.7 3.8 7.3"/></svg>' },
|
|
};
|
|
// the well: <span class="osmark [mini|bare]" data-os="windows" title="Windows"><svg…></svg></span>
|
|
export function osHtml(key, size) {
|
|
const o = OS[key]; if (!o) throw new Error('unknown OS mark ' + key);
|
|
return '<span class="osmark' + (size ? ' ' + size : '') + '" data-os="' + key + '" title="' + o.label + '">' + o.svg + '</span>';
|
|
}
|