diff options
| author | Craig Jennings <c@cjennings.net> | 2026-07-19 23:45:24 -0500 |
|---|---|---|
| committer | Craig Jennings <c@cjennings.net> | 2026-07-19 23:45:24 -0500 |
| commit | 0468fedb23ae34a140b6a5a903adedb4e9873ca5 (patch) | |
| tree | 188151ac2e0e9a27b205cd523c7872028795e5ca /docs/prototypes/2026-07-02-desktop-settings-panel-prototype-2.html | |
| parent | c4b3710b14a47d4c8297322297f217be264349ea (diff) | |
| download | archsetup-0468fedb23ae34a140b6a5a903adedb4e9873ca5.tar.gz archsetup-0468fedb23ae34a140b6a5a903adedb4e9873ca5.zip | |
docs: expand desktop-settings spec and add panel prototypes
I folded the home-handoff control-set decisions into the desktop-settings panel spec. The controls table gains night-light, Do Not Disturb, power profile, lock/suspend actions, scenes, and a wallpaper sub-view. Volume and theme are out of scope, with reasons, and the format pickers move to their own display-format sibling spec (stubbed). The scenes and wallpaper-shape decisions close. The spec stays DRAFT pending UI prototyping.
I added five direction prototypes over a shared engine (tile grid, sectioned rack, scenes-first, instrument cluster, expandable rows) so the layout gets picked against working behavior.
I closed the shipped Next Session Focus work in todo.org: notification loudness, clock right-click dismiss, date-only scrolling, the wired-interface indicator, and best-saved WiFi connect, plus velox boot recovery. The three design-blocked network and audio items stay TODO with their open question recorded.
Diffstat (limited to 'docs/prototypes/2026-07-02-desktop-settings-panel-prototype-2.html')
| -rw-r--r-- | docs/prototypes/2026-07-02-desktop-settings-panel-prototype-2.html | 99 |
1 files changed, 99 insertions, 0 deletions
diff --git a/docs/prototypes/2026-07-02-desktop-settings-panel-prototype-2.html b/docs/prototypes/2026-07-02-desktop-settings-panel-prototype-2.html new file mode 100644 index 0000000..af2160c --- /dev/null +++ b/docs/prototypes/2026-07-02-desktop-settings-panel-prototype-2.html @@ -0,0 +1,99 @@ +<!doctype html> +<html lang="en"> +<head> +<meta charset="utf-8"> +<meta name="viewport" content="width=device-width, initial-scale=1"> +<title>Desktop Settings — Prototype 2 (sectioned rack)</title> +<link rel="stylesheet" href="desktop-settings-shared.css"> +</head> +<body class="ds-stage"> + <div class="ds-caption"> + <b>Direction 2 — Sectioned rack.</b> Full-width console keys stacked under + engraved section labels, closest to the net/bt panel idiom. Densest and most + scannable; every control is one row you read top to bottom. + </div> + + <div class="ds-bar"><span>19:24</span><span class="gear">⚙</span></div> + + <div class="ds-panel" id="panel"> + <div class="ds-face"> + <span class="glyph">⚙</span> + <span class="title">Settings</span> + <span class="sub" id="scene-sub"></span> + <span class="x">✕</span> + </div> + <div id="body"></div> + <div class="ds-toast" id="toast"></div> + <div class="ds-subview" id="subview"></div> + </div> + +<script src="desktop-settings-shared.js"></script> +<script> +const body = document.getElementById("body"); +const subview = document.getElementById("subview"); +DS.bindToast(document.getElementById("toast")); + +function openWallpaper() { + subview.innerHTML = ""; + subview.appendChild(DS.wallpaperSubview(() => subview.classList.remove("open"))); + subview.classList.add("open"); +} + +function section(label, nodes) { + const wrap = DS.h("div", "ds-col"); + wrap.appendChild(DS.engrave(label)); + nodes.forEach((n) => wrap.appendChild(n)); + return wrap; +} + +// A wallpaper entry row styled like a console key that opens the sub-view. +function wallpaperRow() { + const el = DS.h("div", "ds-key"); + el.innerHTML = + `<span class="ds-lamp off"></span><span class="k-glyph">\u{f021c}</span>` + + `<span class="k-name">Wallpaper</span><span class="k-state">manage ›</span>`; + el.onclick = openWallpaper; + return el; +} + +function render() { + body.innerHTML = ""; + const col = DS.h("div", "ds-col"); + + col.appendChild(section("Display", [ + DS.toggleKey("autodim"), + DS.toggleKey("nightlight"), + (() => { const w = DS.h("div", "ds-well"); w.appendChild(DS.slider("brightness")); w.appendChild(DS.slider("kbd")); return w; })(), + ])); + + col.appendChild(section("Input", [ + DS.toggleKey("touchpad"), + DS.toggleKey("mouse"), + ])); + + const powerNodes = []; + if (DS.state.laptop) powerNodes.push(DS.toggleKey("airplane")); + powerNodes.push(DS.profileSeg()); + const acts = DS.h("div", "ds-grid2"); + acts.appendChild(DS.actionBtn("Lock", "\u{f033e}", false)); + acts.appendChild(DS.actionBtn("Suspend", "\u{f04b2}", false)); + powerNodes.push(acts); + col.appendChild(section("Power", powerNodes)); + + col.appendChild(section("Notifications", [DS.toggleKey("dnd")])); + + const scenes = DS.h("div", "ds-grid4"); + Object.keys(DS.SCENES).forEach((n) => scenes.appendChild(DS.sceneKey(n))); + col.appendChild(section("Scenes", [scenes])); + + col.appendChild(section("Wallpaper", [wallpaperRow()])); + + body.appendChild(col); + document.getElementById("scene-sub").textContent = DS.state.scene ? "▶ " + DS.state.scene : ""; +} + +DS.onChange(render); +render(); +</script> +</body> +</html> |