Style kiosk dashboards with the CubeCraft Creations display system

The design system was only ever expressed in the production card's
stylesheet (custom_components/cubecraft_production/www/
cubecraft-production-card.js), which is gitignored, so the dashboards had
no way to share it. Mirror those tokens into an HA theme and apply the
card's own motifs to the wall panels.

themes/cubecraft.yaml carries the brand gradient, Nunito, the 4px scale,
radii, shadows and semantic colours. It uses `modes:` so it follows HA's
light/dark setting: light is the system as authored, dark uses
violet-tinted neutrals with the primary lifted to #8B8AF2 (5.6:1 on the
card surface) since #3B3AB8 is unreadable as an accent on dark. The
gradient itself is unchanged in both modes -- white clears AA across its
whole span.

At-a-Glance, Family Hub and Voice Alarms pick up three motifs from the
card: the .title gradient bar, .column header section labels, and the
4px brand left rule on each tile. Tile colour is cut back to brand
indigo, with green/amber/red reserved for real signals (printer offline,
bin full) -- the same discipline the card uses, where only a blocked
order goes red. CubeOps gets the theme too, so the board and the
dashboards land on the same ramp instead of the card improvising against
HA's defaults.

The card injects its @font-face only on its own page, so a small frontend
module declares Nunito document-wide. It points at the woff2 the
integration already serves rather than vendoring a second copy, which
needed a .gitignore carve-out since www/ is excluded wholesale.

dakboard-dark is left in place; switching a dashboard back is a one-line
change.

Not yet validated by `ha core check` -- this worktree is outside the
config tree HA actually loads.

Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
root
2026-07-27 11:27:35 -04:00
parent 0c35647203
commit 92b68ca21a
8 changed files with 702 additions and 55 deletions
+11 -2
View File
@@ -13,12 +13,21 @@
# and registers its own Lovelace resource, so there is nothing to add under
# Settings > Dashboards > Resources.
# kiosk-mode plugin (HACS > Frontend). Without it the board still fills the
# screen; you just keep HA's header and sidebar.
# kiosk-mode plugin (HACS > Frontend). NOT currently installed — there is no
# lovelace-kiosk-mode under www/community — so this block is inert today.
# `theme: cubecraft` below already collapses the header via header-height, so
# installing the plugin now only buys you hide_sidebar.
kiosk_mode:
hide_header: true
hide_sidebar: true
# The CubeCraft display system. The card reads HA's theme variables for its
# surfaces, text and borders (see the `--cc-surface` fallbacks in
# cubecraft-production-card.js), so setting this makes the board and the rest
# of the dashboards land on exactly the same ramp instead of the card
# improvising against HA's defaults.
theme: cubecraft
views:
- title: Production
# Panel mode gives the card the whole viewport with no dashboard padding.