veenm
75ab27db10
- Container cards: horizontal scroll (snap, arrows, keeps position) and swipe (dots, optional autoplay that survives redraws and respects reduced motion), with add/edit/reorder of the cards inside - Nine new themes, contrast-checked, including High contrast; bright accents get dark text - Choose which dashboard opens per device (optionally in kiosk mode) and per Home Assistant user, via /api/whoami and the ingress user headers Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
76 lines
3.8 KiB
HTML
76 lines
3.8 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
|
<meta name="theme-color" content="#f2f2f7" media="(prefers-color-scheme: light)">
|
|
<meta name="theme-color" content="#0f0f11" media="(prefers-color-scheme: dark)">
|
|
<meta name="ds-version" content="__VERSION__">
|
|
<title>Dashboard Studio</title>
|
|
<link rel="icon" type="image/png" href="static/favicon.png">
|
|
<link rel="stylesheet" href="static/style.css">
|
|
</head>
|
|
<body>
|
|
<div id="app">
|
|
<header id="topbar" role="toolbar" aria-label="Dashboard">
|
|
<div class="tb-group">
|
|
<label class="picker">
|
|
<span class="sr-only" data-i18n>Dashboard</span>
|
|
<select id="dash-select"></select>
|
|
<svg class="i" viewBox="0 0 24 24" aria-hidden="true"><path d="M6 9l6 6 6-6"/></svg>
|
|
</label>
|
|
<button id="btn-new" class="btn icon" aria-label="New dashboard" title="New dashboard"></button>
|
|
</div>
|
|
<div class="tb-group">
|
|
<span id="conn" class="conn" role="status" data-i18n>Offline</span>
|
|
<span id="save-status" class="save-status edit-only" role="status"></span>
|
|
<span class="edit-only tb-group">
|
|
<button id="btn-undo" class="btn icon" aria-label="Undo" title="Undo (⌘Z)"></button>
|
|
<button id="btn-redo" class="btn icon" aria-label="Redo" title="Redo (⇧⌘Z)"></button>
|
|
<button id="btn-menu" class="btn icon" aria-label="More actions" aria-haspopup="menu" aria-expanded="false" title="More actions"></button>
|
|
</span>
|
|
<button id="btn-kiosk" class="btn view-only label-wide" aria-label="Kiosk" title="Kiosk mode"><span data-i18n>Kiosk</span></button>
|
|
<button id="btn-edit" class="btn primary" data-i18n>Edit</button>
|
|
</div>
|
|
<div id="menu" class="menu" role="menu" hidden>
|
|
<button role="menuitem" data-menu="rename" data-icon="edit" data-i18n>Rename…</button>
|
|
<button role="menuitem" data-menu="duplicate" data-icon="copy" data-i18n>Duplicate</button>
|
|
<button role="menuitem" data-menu="starter" data-icon="sparkles" data-i18n>New dashboard from my devices</button>
|
|
<button role="menuitem" data-menu="assign" data-icon="person" data-i18n>Who sees which dashboard…</button>
|
|
<hr>
|
|
<button role="menuitem" data-menu="export" data-icon="exit" data-i18n>Export as JSON</button>
|
|
<button role="menuitem" data-menu="import" data-icon="plus" data-i18n>Import JSON…</button>
|
|
<hr>
|
|
<button role="menuitem" data-menu="delete" data-icon="trash" class="danger" data-i18n>Delete dashboard…</button>
|
|
</div>
|
|
</header>
|
|
|
|
<div id="workspace">
|
|
<aside id="palette" class="edit-only" aria-label="Widgets">
|
|
<div class="panel-title" data-i18n>Add widget</div>
|
|
<div id="palette-list"></div>
|
|
<p class="hint" data-i18n>Click to add. Drag to move, drag the corner to resize. Arrow keys move the selected widget, Shift+arrows resize, ⌘D duplicates, Delete removes.</p>
|
|
</aside>
|
|
|
|
<main id="stage">
|
|
<nav id="tabnav" aria-label="Tabs" hidden></nav>
|
|
<div id="canvas"><div id="grid"></div></div>
|
|
</main>
|
|
|
|
<aside id="inspector" class="edit-only" aria-label="Inspector"></aside>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="saver" hidden aria-hidden="true"><div class="time num"></div><div class="date"></div></div>
|
|
|
|
<div id="modal" class="modal" hidden><div class="modal-card" role="dialog" aria-modal="true"></div></div>
|
|
<div id="toasts" aria-live="polite"></div>
|
|
<input type="file" id="import-file" accept="application/json,.json" hidden>
|
|
|
|
<script src="static/i18n.js"></script>
|
|
<script src="static/icons.js"></script>
|
|
<script src="static/widgets.js"></script>
|
|
<script src="static/app.js"></script>
|
|
</body>
|
|
</html>
|