aboutsummaryrefslogtreecommitdiffstats
path: root/styles/modules.css
diff options
context:
space:
mode:
Diffstat (limited to 'styles/modules.css')
-rw-r--r--styles/modules.css17
1 files changed, 12 insertions, 5 deletions
diff --git a/styles/modules.css b/styles/modules.css
index 9044455..cac68da 100644
--- a/styles/modules.css
+++ b/styles/modules.css
@@ -20,11 +20,18 @@
min-width: 20px;
}
-/* The accent pill inverts on hover rather than lightening: it is already the
- * brightest thing on the bar. */
-#image.launcher:hover {
- background-color: @main-bg;
-}
+/* This pill deliberately has NO hover background.
+ *
+ * The mark is a rendered image inside the module, not a CSS background, so
+ * CSS cannot recolour it for a hover state. It is filled with @main-bg to
+ * contrast against the accent pill, which means any hover that sets the
+ * background to @main-bg paints the mark in its own colour and the pill goes
+ * blank. That shipped twice: first filled with @accent on an @accent pill,
+ * then hovering to @main-bg with an @main-bg mark.
+ *
+ * Changing the background here at all requires a colour that contrasts with
+ * BOTH @accent and @main-bg, which the palette does not owe us. So the pill
+ * holds its colour and the cursor alone signals it is clickable. */
/* ---------------------------------------------- *
* Clock: the only text, each with a leading icon. *