From ef78a3c70ec3bd1779be2f52956c6916934aed46 Mon Sep 17 00:00:00 2001 From: SandObserver <260779319+SandObserver@users.noreply.github.com> Date: Mon, 28 Sep 2026 19:49:40 -0400 Subject: [PATCH] Document the 1.15.0 colour control, messages and toolbox helper --- public/js/admin-app-form.js | 10 +++++----- public/js/admin-auth.js | 4 ++-- public/js/admin-color-control.js | 4 ++-- public/js/admin-drag.js | 2 +- public/js/admin-error.js | 2 -- public/js/admin-list.js | 8 ++++---- public/js/admin-settings.js | 8 ++++---- public/js/admin-shared.js | 2 +- public/js/admin-widget-form.js | 8 ++++---- public/js/admin.js | 18 +++++++++--------- public/js/background.js | 2 +- public/js/dashboard.js | 8 ++++---- public/js/listbox.js | 2 +- public/js/spotlight.js | 2 +- public/js/ui.js | 2 +- public/js/utils.js | 2 +- public/js/widget-config-form.js | 10 +++++----- public/js/widget-toolbox.js | 11 +++++++++++ public/widgets/backup/backup.html | 2 +- public/widgets/books/index.html | 2 +- .../widgets/connections/connections-map.html | 2 +- .../widgets/connections/connections-vpn.html | 2 +- public/widgets/dashboard-switch/index.html | 2 +- public/widgets/disk-health/index.html | 2 +- public/widgets/dns/index.html | 2 +- public/widgets/github/contributions.html | 2 +- public/widgets/github/pullrequests.html | 2 +- public/widgets/nowplaying/index.html | 2 +- public/widgets/system-summary/index.html | 2 +- public/widgets/weather/index.html | 3 ++- .../docs/docs/create-a-widget/widget-page.md | 1 + src/content/docs/docs/settings-reference.md | 2 +- src/content/docs/docs/troubleshooting.md | 3 +++ 33 files changed, 75 insertions(+), 61 deletions(-) diff --git a/public/js/admin-app-form.js b/public/js/admin-app-form.js index fca5458..79ef848 100644 --- a/public/js/admin-app-form.js +++ b/public/js/admin-app-form.js @@ -1,4 +1,4 @@ -import { clr, el, inp as inpById, q as qSel, qa, qi, tgt } from '/js/utils.js?v=6d4d869b'; +import { clr, el, inp as inpById, q as qSel, qa, qi, tgt } from '/js/utils.js?v=b1cfbd45'; import { html, raw, setHtml } from '/js/html.js?v=c71f8903'; import { loadLocalIcons, resolveIcon, iconChain, cdnIconRef, splitIconRef } from '/js/icons.js?v=9c8c550c'; import { state } from '/js/admin-state.js?v=831e219e'; @@ -21,11 +21,11 @@ import { reveal, setTogDisabled, swapContent, -} from '/js/admin-shared.js?v=10665320'; -import { createListbox } from '/js/listbox.js?v=7372c1d5'; +} from '/js/admin-shared.js?v=3870d0d0'; +import { createListbox } from '/js/listbox.js?v=6e7b7060'; import { MAX_LABELS } from '/js/badge-logic.js?v=9e6d9d4b'; -import { renderColorControl, BADGE_DEFAULT } from '/js/admin-color-control.js?v=60fe4b32'; -import { badgeErrorAdvice, TONE } from '/js/admin-error.js?v=e4ea7820'; +import { renderColorControl, BADGE_DEFAULT } from '/js/admin-color-control.js?v=844bdeb2'; +import { badgeErrorAdvice, TONE } from '/js/admin-error.js?v=f82486b2'; import { fluidHoverClear, fluidHoverKb } from '/js/fluid-hover.js?v=cb886e86'; import { iconSvg } from '/js/icon-set.js?v=34af798f'; diff --git a/public/js/admin-auth.js b/public/js/admin-auth.js index 90ecb79..8b17940 100644 --- a/public/js/admin-auth.js +++ b/public/js/admin-auth.js @@ -1,7 +1,7 @@ -import { apiGet, apiPost } from '/js/admin-shared.js?v=10665320'; +import { apiGet, apiPost } from '/js/admin-shared.js?v=3870d0d0'; import { t } from '/js/i18n.js?v=1f1ea9c1'; import { pwStrength } from '/js/password-strength.js?v=42f45ac7'; -import { el, inp as inpById, qa } from '/js/utils.js?v=6d4d869b'; +import { el, inp as inpById, qa } from '/js/utils.js?v=b1cfbd45'; export async function checkAuth(onLogin) { try { diff --git a/public/js/admin-color-control.js b/public/js/admin-color-control.js index 129dbb2..6234bfb 100644 --- a/public/js/admin-color-control.js +++ b/public/js/admin-color-control.js @@ -1,7 +1,7 @@ -import { PE_SVG, initInlineEdit, toast, reveal } from '/js/admin-shared.js?v=10665320'; +import { PE_SVG, initInlineEdit, toast, reveal } from '/js/admin-shared.js?v=3870d0d0'; import { t } from '/js/i18n.js?v=1f1ea9c1'; import { html, raw, setHtml } from '/js/html.js?v=c71f8903'; -import { qa, q } from '/js/utils.js?v=6d4d869b'; +import { qa, q } from '/js/utils.js?v=b1cfbd45'; import { iconSvg } from '/js/icon-set.js?v=34af798f'; import { HUE_NAMES, ROLE_NAMES, TILE_KEYWORDS, pageTheme, tileColor } from '/js/palette.js?v=3fb8ae43'; diff --git a/public/js/admin-drag.js b/public/js/admin-drag.js index 401e5a9..37a1df4 100644 --- a/public/js/admin-drag.js +++ b/public/js/admin-drag.js @@ -12,7 +12,7 @@ import { applyDrop, canJoinFolder, folderRowZone } from '/js/admin-drag-logic.js?v=6b767e76'; import { state } from '/js/admin-state.js?v=831e219e'; import { snapshotItems } from '/js/admin-save-logic.js?v=60a82419'; -import { qa } from '/js/utils.js?v=6d4d869b'; +import { qa } from '/js/utils.js?v=b1cfbd45'; /** @type {(before: unknown) => void} */ let _save = () => {}; diff --git a/public/js/admin-error.js b/public/js/admin-error.js index f12a64b..12b352f 100644 --- a/public/js/admin-error.js +++ b/public/js/admin-error.js @@ -79,8 +79,6 @@ export function badgeErrorAdvice(e) { return { ...adviceFor(read), code, tone: warn ? TONE.WARN : TONE.ERROR, openAuth: false, sessionExpired: false }; } -/* Same wording as badgeErrorAdvice: a settings Fetch and a badge test report the - same failures and must not disagree about either the text or the tone. */ export function optionsErrorAdvice(e) { const { tone, key, vars, code } = badgeErrorAdvice(e); return vars ? { tone, code, key, vars } : { tone, code, key }; diff --git a/public/js/admin-list.js b/public/js/admin-list.js index 1109d1f..ff3fb1c 100644 --- a/public/js/admin-list.js +++ b/public/js/admin-list.js @@ -14,12 +14,12 @@ import { collapsedFolders, filter, state } from '/js/admin-state.js?v=831e219e'; import { snapshotItems } from '/js/admin-save-logic.js?v=60a82419'; import { reorderItems } from '/js/admin-logic.js?v=cbb7417d'; -import { initDrag, wireRowDrag } from '/js/admin-drag.js?v=5e47c084'; -import { paintIcon } from '/js/admin-shared.js?v=10665320'; -import { clr, el, qa, setUserText } from '/js/utils.js?v=6d4d869b'; +import { initDrag, wireRowDrag } from '/js/admin-drag.js?v=7fe4a0bf'; +import { paintIcon } from '/js/admin-shared.js?v=3870d0d0'; +import { clr, el, qa, setUserText } from '/js/utils.js?v=b1cfbd45'; import { html, raw, setHtml } from '/js/html.js?v=c71f8903'; import { t } from '/js/i18n.js?v=1f1ea9c1'; -import { sizeLabel } from '/js/admin-widget-form.js?v=8d526d32'; +import { sizeLabel } from '/js/admin-widget-form.js?v=bcfb87e2'; import { widgetGlyph } from '/js/widget-glyphs.js?v=648cc374'; import { iconSvg } from '/js/icon-set.js?v=34af798f'; diff --git a/public/js/admin-settings.js b/public/js/admin-settings.js index 66b81c5..eba58e8 100644 --- a/public/js/admin-settings.js +++ b/public/js/admin-settings.js @@ -1,4 +1,4 @@ -import { toast, apiGet, apiPost, reveal, swapContent } from '/js/admin-shared.js?v=10665320'; +import { toast, apiGet, apiPost, reveal, swapContent } from '/js/admin-shared.js?v=3870d0d0'; import { pwStrength } from '/js/password-strength.js?v=42f45ac7'; import { t } from '/js/i18n.js?v=1f1ea9c1'; import { @@ -9,9 +9,9 @@ import { BLOCK, } from '/js/admin-logic.js?v=cbb7417d'; import { confirmText } from '/js/modal.js?v=11fa1eff'; -import { el, inp, setUserText } from '/js/utils.js?v=6d4d869b'; -import { renderColorControl } from '/js/admin-color-control.js?v=60fe4b32'; -import { BACKDROP } from '/js/background.js?v=0caab98e'; +import { el, inp, setUserText } from '/js/utils.js?v=b1cfbd45'; +import { renderColorControl } from '/js/admin-color-control.js?v=844bdeb2'; +import { BACKDROP } from '/js/background.js?v=cd1cc453'; /* Mirrors the server's rule: auth cannot be switched on with no password. */ let _passwordSet = false; diff --git a/public/js/admin-shared.js b/public/js/admin-shared.js index c448f67..39d60f8 100644 --- a/public/js/admin-shared.js +++ b/public/js/admin-shared.js @@ -1,6 +1,6 @@ /* Stateless helpers shared by the admin modules. Mutable state stays out. */ import { recoversSession, toastHoldMs } from '/js/admin-logic.js?v=cbb7417d'; -import { el, q } from '/js/utils.js?v=6d4d869b'; +import { el, q } from '/js/utils.js?v=b1cfbd45'; import { t } from '/js/i18n.js?v=1f1ea9c1'; import { iconChain } from '/js/icons.js?v=9c8c550c'; import { iconSvg } from '/js/icon-set.js?v=34af798f'; diff --git a/public/js/admin-widget-form.js b/public/js/admin-widget-form.js index 45d2d3a..83576c2 100644 --- a/public/js/admin-widget-form.js +++ b/public/js/admin-widget-form.js @@ -1,11 +1,11 @@ import { state } from '/js/admin-state.js?v=831e219e'; -import { PE_SVG, initInlineEdit, swapContent } from '/js/admin-shared.js?v=10665320'; -import { createListbox } from '/js/listbox.js?v=7372c1d5'; -import { renderWidgetConfigForm } from '/js/widget-config-form.js?v=cf2a5a6e'; +import { PE_SVG, initInlineEdit, swapContent } from '/js/admin-shared.js?v=3870d0d0'; +import { createListbox } from '/js/listbox.js?v=6e7b7060'; +import { renderWidgetConfigForm } from '/js/widget-config-form.js?v=1dcd31e2'; import { html, raw, setHtml } from '/js/html.js?v=c71f8903'; import { sizesForView, widgetConfigMode, rejectionLines, carriesTypedValues } from '/js/admin-logic.js?v=cbb7417d'; import { t } from '/js/i18n.js?v=1f1ea9c1'; -import { q, qi, qa } from '/js/utils.js?v=6d4d869b'; +import { q, qi, qa } from '/js/utils.js?v=b1cfbd45'; import { iconSvg } from '/js/icon-set.js?v=34af798f'; const SIZES_WITH_ICONS = new Set(['small', 'medium', 'large', 'xlarge']); diff --git a/public/js/admin.js b/public/js/admin.js index a2a2a41..1a252b6 100644 --- a/public/js/admin.js +++ b/public/js/admin.js @@ -1,6 +1,6 @@ -import { buildAppForm, buildFolderForm, captureActLabels, serializeKvRows } from '/js/admin-app-form.js?v=cbb0e02c'; -import { checkAuth, requireLogin, wirePasswordStrength } from '/js/admin-auth.js?v=06cea8ee'; -import { initList, render, syncFilterUI } from '/js/admin-list.js?v=333a9833'; +import { buildAppForm, buildFolderForm, captureActLabels, serializeKvRows } from '/js/admin-app-form.js?v=e203674f'; +import { checkAuth, requireLogin, wirePasswordStrength } from '/js/admin-auth.js?v=a3a03ef9'; +import { initList, render, syncFilterUI } from '/js/admin-list.js?v=fc772edc'; import { resolveAdminSection } from '/js/admin-logic.js?v=cbb7417d'; import { buildAppItem, @@ -10,7 +10,7 @@ import { snapshotItems, upsertItem, } from '/js/admin-save-logic.js?v=60a82419'; -import { loadSettings, settingsDirty, showBgFields, showWallpaperFile } from '/js/admin-settings.js?v=36fd9c08'; +import { loadSettings, settingsDirty, showBgFields, showWallpaperFile } from '/js/admin-settings.js?v=ac7685df'; import { apiGet, apiPost, @@ -19,12 +19,12 @@ import { reveal, setReauthHandler, toast, -} from '/js/admin-shared.js?v=10665320'; +} from '/js/admin-shared.js?v=3870d0d0'; import { collapsedFolders, filter, state } from '/js/admin-state.js?v=831e219e'; -import { buildWidgetForm } from '/js/admin-widget-form.js?v=8d526d32'; +import { buildWidgetForm } from '/js/admin-widget-form.js?v=bcfb87e2'; import { initFluidHover } from '/js/fluid-hover.js?v=cb886e86'; import { initGlideSelect, syncGlideSelect } from '/js/glide-select.js?v=8b39e9d0'; -import { createListbox } from '/js/listbox.js?v=7372c1d5'; +import { createListbox } from '/js/listbox.js?v=6e7b7060'; import { html, raw, setHtml } from '/js/html.js?v=c71f8903'; import { initI18n, LANGUAGES, t } from '/js/i18n.js?v=1f1ea9c1'; import { loadLocalIcons } from '/js/icons.js?v=9c8c550c'; @@ -49,8 +49,8 @@ import { watchSystemTheme, writeMode, } from '/js/theme.js?v=eeafa4b5'; -import { el, inp, q, qa, clr, setUserText, tgt } from '/js/utils.js?v=6d4d869b'; -import { applyBackground, resolveBackground } from '/js/background.js?v=0caab98e'; +import { el, inp, q, qa, clr, setUserText, tgt } from '/js/utils.js?v=b1cfbd45'; +import { applyBackground, resolveBackground } from '/js/background.js?v=cd1cc453'; import { parseYamlTolerant, YamlLiteError } from '/js/yaml-lite.js?v=6ebb564c'; ensureSprite(); diff --git a/public/js/background.js b/public/js/background.js index 19bde79..a29f231 100644 --- a/public/js/background.js +++ b/public/js/background.js @@ -1,5 +1,5 @@ // @ts-check -import { cssColor, sanitizeCssUrl } from '/js/utils.js?v=6d4d869b'; +import { cssColor, sanitizeCssUrl } from '/js/utils.js?v=b1cfbd45'; import { loadWallpaper, saveWallpaper } from '/js/wallpaper-cache.js?v=c5f8a3e6'; export const BACKDROP = '#0d1117'; diff --git a/public/js/dashboard.js b/public/js/dashboard.js index 3b20496..c463ef2 100644 --- a/public/js/dashboard.js +++ b/public/js/dashboard.js @@ -24,9 +24,9 @@ import { setUserText, teardownWidgets, titleWhenTruncated, -} from '/js/utils.js?v=6d4d869b'; +} from '/js/utils.js?v=b1cfbd45'; import { initFluidHover } from '/js/fluid-hover.js?v=cb886e86'; -import { initSpotlight } from '/js/spotlight.js?v=bc6d6187'; +import { initSpotlight } from '/js/spotlight.js?v=53fd6b55'; import { html, setHtml, raw } from '/js/html.js?v=c71f8903'; import { initI18n, t, currentLang } from '/js/i18n.js?v=1f1ea9c1'; import { pwStrength, passwordMismatch } from '/js/password-strength.js?v=42f45ac7'; @@ -40,7 +40,7 @@ import { buildMobile, resetMobileChrome, mkFolderGlyph, -} from '/js/ui.js?v=cb1af792'; +} from '/js/ui.js?v=9bdba35c'; import { badgeMinimum, badgeSignature, computeBadgeVisual, readBadgeUpdate } from '/js/badge-logic.js?v=9e6d9d4b'; import { formatNumber } from '/js/format-number.js?v=4a5ccef4'; import { closeBadgePopover, wireBadgePopover } from '/js/badge-popover.js?v=aa52b1a3'; @@ -52,7 +52,7 @@ import { landingAfterSetup, restorePage, } from '/js/dashboard-logic.js?v=0d519f8b'; -import { applyBackground, BACKDROP, resolveBackground } from '/js/background.js?v=0caab98e'; +import { applyBackground, BACKDROP, resolveBackground } from '/js/background.js?v=cd1cc453'; import { jitter } from '/js/jitter.js?v=4eeef4c9'; import { isMobileLayout, onLayoutChange } from '/js/layout.js?v=e9f4b607'; import { startWakeLock } from '/js/wake-lock.js?v=6b9591cf'; diff --git a/public/js/listbox.js b/public/js/listbox.js index 45454b3..4562747 100644 --- a/public/js/listbox.js +++ b/public/js/listbox.js @@ -9,7 +9,7 @@ import { nextActiveIndex } from '/js/admin-logic.js?v=cbb7417d'; import { fluidHoverClear, fluidHoverKb } from '/js/fluid-hover.js?v=cb886e86'; import { html, raw, setHtml } from '/js/html.js?v=c71f8903'; -import { qa } from '/js/utils.js?v=6d4d869b'; +import { qa } from '/js/utils.js?v=b1cfbd45'; import { iconSvg } from '/js/icon-set.js?v=34af798f'; const CHEV = iconSvg('chevrons', 22, 'solid', 'dd-chev'); diff --git a/public/js/spotlight.js b/public/js/spotlight.js index f0cec56..82df046 100644 --- a/public/js/spotlight.js +++ b/public/js/spotlight.js @@ -1,5 +1,5 @@ import { fluidHoverClear, fluidHoverKb } from '/js/fluid-hover.js?v=cb886e86'; -import { mk, clr, el, inp as inpById, q, qa, setUserText } from '/js/utils.js?v=6d4d869b'; +import { mk, clr, el, inp as inpById, q, qa, setUserText } from '/js/utils.js?v=b1cfbd45'; import { t } from '/js/i18n.js?v=1f1ea9c1'; /* Attached to the window so a re-open can undo the previous one. */ diff --git a/public/js/ui.js b/public/js/ui.js index 7990dd1..eae0432 100644 --- a/public/js/ui.js +++ b/public/js/ui.js @@ -14,7 +14,7 @@ import { q, qa, setUserText, -} from '/js/utils.js?v=6d4d869b'; +} from '/js/utils.js?v=b1cfbd45'; import { t, currentLang } from '/js/i18n.js?v=1f1ea9c1'; import { toneForColor } from '/js/label-contrast.js?v=c1ac6fb8'; import { mobileMetrics, gridColumnWidth, gridCellCount } from '/js/mobile-metrics.js?v=349f4300'; diff --git a/public/js/utils.js b/public/js/utils.js index 153927d..0564d51 100644 --- a/public/js/utils.js +++ b/public/js/utils.js @@ -128,7 +128,7 @@ export function mkWrap(item, sz, r, isz, cls, breg) { w.className = cls ? `plate ${cls}` : 'plate'; const wrapBg = clr(item.system === 'settings' ? 'auto' : item.color); const clear = item.color === 'clear' && item.system !== 'settings'; - w.style.cssText = `--pw:${sz}px;--tc:${wrapBg};width:${sz}px;height:${sz}px;border-radius:${r}px;${clear ? '' : `background-color:${wrapBg};`}position:relative;flex-shrink:0;overflow:visible;display:flex;align-items:center;justify-content:center;`; + w.style.cssText = `--tc:${wrapBg};width:${sz}px;height:${sz}px;border-radius:${r}px;${clear ? '' : `background-color:${wrapBg};`}position:relative;flex-shrink:0;overflow:visible;display:flex;align-items:center;justify-content:center;`; if (clear) { w.classList.add('plate-clear', 'glass-surface'); w.appendChild(mkGlassRim(sz, sz, smoothRectPath(sz, sz, r, 0))); diff --git a/public/js/widget-config-form.js b/public/js/widget-config-form.js index 9d47850..2159967 100644 --- a/public/js/widget-config-form.js +++ b/public/js/widget-config-form.js @@ -3,9 +3,9 @@ import { t } from '/js/i18n.js?v=1f1ea9c1'; import { html, raw, setHtml } from '/js/html.js?v=c71f8903'; -import { reveal, wireInlineEdit } from '/js/admin-shared.js?v=10665320'; -import { createListbox } from '/js/listbox.js?v=7372c1d5'; -import { renderColorControl } from '/js/admin-color-control.js?v=60fe4b32'; +import { reveal, wireInlineEdit } from '/js/admin-shared.js?v=3870d0d0'; +import { createListbox } from '/js/listbox.js?v=6e7b7060'; +import { renderColorControl } from '/js/admin-color-control.js?v=844bdeb2'; import { seedCarried, applyOptionSet, @@ -14,8 +14,8 @@ import { groupBounds, visibleFieldFlags, } from '/js/admin-logic.js?v=cbb7417d'; -import { optionsErrorAdvice, TONE } from '/js/admin-error.js?v=e4ea7820'; -import { qi } from '/js/utils.js?v=6d4d869b'; +import { optionsErrorAdvice, TONE } from '/js/admin-error.js?v=f82486b2'; +import { qi } from '/js/utils.js?v=b1cfbd45'; const PE = ''; diff --git a/public/js/widget-toolbox.js b/public/js/widget-toolbox.js index 85a360b..8cfbe04 100644 --- a/public/js/widget-toolbox.js +++ b/public/js/widget-toolbox.js @@ -40,6 +40,17 @@ export function theme() { const NS = 'http://www.w3.org/2000/svg'; const _params = new URLSearchParams(location.search); +/** Gives the card the dark card's edge and border while the widget paints its own dark background. + @param {boolean} dark */ +export function setCardAppearance(dark) { + const card = /** @type {HTMLElement | null | undefined} */ ( + window.frameElement?.closest('.widget, .mob-widget-card') + ); + if (!card) return; + if (dark) card.dataset.appearance = 'dark'; + else delete card.dataset.appearance; +} + export function widgetId() { return _params.get('id') || ''; } diff --git a/public/widgets/backup/backup.html b/public/widgets/backup/backup.html index d0fc383..ee2bb5d 100644 --- a/public/widgets/backup/backup.html +++ b/public/widgets/backup/backup.html @@ -121,7 +121,7 @@