From 3df6f5fd8b66aed6b146d79af42f5f1ded56b927 Mon Sep 17 00:00:00 2001
From: stroblme <stroblme@posteo.de>
Date: Thu, 15 Oct 2026 15:55:00 +0200
Subject: [PATCH] Give a Glass Switch or Button face a stronger press in light

A face has no card behind its disc, so the tile button's white wash all but
vanished into a light ground. The look's root states the press's own wash,
tinted with the primary and casting the pane's shadow.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01WgBfkm4rCmtd1T4vHWjEPx
---
 .../components/Dashboard/ui/glass/glass.css    | 18 ++++++++++++++++++
 1 file changed, 18 insertions(+)

diff --git a/frontend/src/components/Dashboard/ui/glass/glass.css b/frontend/src/components/Dashboard/ui/glass/glass.css
index 8c23b93..ce34197 100644
--- a/frontend/src/components/Dashboard/ui/glass/glass.css
+++ b/frontend/src/components/Dashboard/ui/glass/glass.css
@@ -26,6 +26,9 @@
   --gl-radius: 1.25rem;
   --gl-track: rgb(255 255 255 / 0.16);
   --gl-blob-opacity: 0.5;
+  /* A round face's press, which has no card behind it. See below. */
+  --gl-press: var(--gl-bg);
+  --gl-press-shadow: var(--gl-inset);
 }
 
 [data-look="glass"].light {
@@ -37,6 +40,8 @@
   --gl-track: rgb(0 0 0 / 0.1);
   /* Diluted by the white it mixes into, so it takes more of it to show. */
   --gl-blob-opacity: 0.6;
+  --gl-press: color-mix(in srgb, var(--primary) 14%, rgb(255 255 255 / 0.85));
+  --gl-press-shadow: var(--gl-shadow), var(--gl-inset);
 }
 
 /* --- the ground ---------------------------------------------------------- */
@@ -238,6 +243,19 @@
   pointer-events: none;
 }
 
+/*
+ * A Switch's or a Button's face on a round dashboard is one large press with
+ * only the ground behind it. A tile's button has a card for contrast; this has
+ * none, so in light the white wash all but disappears into the ground. The
+ * look's root states the press's own wash, so a dashboard keeps its own when
+ * a round panel draws it beside one in another look or theme.
+ */
+.dui-face-press
+> .gl-button:not([data-variant="filled"], [aria-pressed="true"]) {
+  background: var(--gl-press);
+  box-shadow: var(--gl-press-shadow);
+}
+
 .gl-switch {
   position: relative;
   display: inline-flex;