style: replace solid accent hover/active with glass effect

- glass-hover: alpha(@foreground,0.08) → alpha(white,0.10)
- glass-active: alpha(@foreground,0.14) → alpha(white,0.50)
- panel, settings, dropdown, tray, notification hover → glass-hover
- battery, wifi, bluetooth connected icons → glass-active
- wifi-icon-box base dimmed to glass-hover for contrast
This commit is contained in:
sankalp committed 2026-07-18 21:23:28 +05:45
1 parent 2ba5cc9ccc
commit 8ee6003241
9 files changed
+40 -30

No files matched your search

+2 -2
View File
@@ -38,8 +38,8 @@
/* Interactive States */
@define-color glass-hover alpha(@foreground, 0.08);
@define-color glass-active alpha(@foreground, 0.14);
@define-color glass-hover alpha(white, 0.10);
@define-color glass-active alpha(white, 0.50);
@define-color glass-selected alpha(@primary, 0.18);
@define-color glass-focus alpha(@primary, 0.25);
+11 -1
View File
@@ -37,7 +37,17 @@
}
#wifi-connections #device-icon.connected {
background-color: @glass-accent;
background-color: @glass-active;
color: @glass-text;
}
/* Bluetooth-specific device icon styles */
#bluetooth-connections #device-icon {
background-color: @glass-hover;
}
#bluetooth-connections #device-icon.connected {
background-color: @glass-active;
color: @glass-text;
}
+4 -4
View File
@@ -31,7 +31,7 @@
}
#device-icon.connected {
background-color: @glass-accent;
background-color: @glass-active;
}
#toggle-button {
@@ -53,7 +53,7 @@
}
#toggle-button:checked {
background-color: @glass-accent;
background-color: @glass-active;
}
@@ -123,13 +123,13 @@
font-weight: bold;
}
.wifi-icon-box {
background-color: @glass-text-secondary;
background-color: @glass-hover;
border-radius: apply(radius-full);
padding: 2px;
}
.wifi-icon-box-connected {
background-color: @glass-accent;
background-color: @glass-active;
border-radius: apply(radius-full);
padding: 2px;
}
@@ -77,8 +77,8 @@ menu.mac-context-menu {
}
.mac-context-menu menuitem:hover {
background-color: @glass-accent;
color: @glass-overlay-dark;
background-color: @glass-hover;
color: @glass-text;
}
.mac-header-pill {
+4 -4
View File
@@ -21,13 +21,13 @@
}
#dropdown-option:hover {
color: @on-primary;
color: @glass-text;
transition: all 20ms ease-in-out;
background-color: @glass-accent;
background-color: @glass-hover;
}
#dropdown-option:hover #dropdown-option-label {
color: @on-primary;
color: @glass-text;
}
#dropdown-option-label {
@@ -42,7 +42,7 @@
}
#dropdown-option:hover #dropdown-option-keybind {
color: @on-primary;
color: @glass-text;
}
#dropdown-option-keybind {
+3 -3
View File
@@ -40,11 +40,11 @@ menu > menuitem:hover {
transition: all 20ms ease-in-out;
font-size: apply(font-md);
border-radius: apply(radius-xs);
color: @on-primary;
background-color: @glass-accent;
color: @glass-text;
background-color: @glass-hover;
}
menu > menuitem:hover > label {
color: @on-primary;
color: @glass-text;
font-weight: 400;
}
+4 -4
View File
@@ -137,11 +137,11 @@
}
#energy-mode-icon.connected {
background-color: @glass-accent;
color: @on-primary;
background-color: @glass-active;
color: @glass-text;
}
#game-mode-icon.connected {
background-color: @glass-accent;
color: @on-primary;
background-color: @glass-active;
color: @glass-text;
}
+5 -5
View File
@@ -15,8 +15,8 @@
#global-menu:hover,
#global-menu.active,
#workspaces>button:hover {
background-color: @glass-accent;
color: @on-primary;
background-color: @glass-hover;
color: @glass-text;
}
#panel-button,
@@ -60,11 +60,11 @@
}
#workspaces>button.active:hover {
background-color: @glass-accent;
background-color: @glass-hover;
}
#workspaces>button.active:hover label {
color: @on-primary;
color: @glass-text;
}
#workspaces>button.urgent {
@@ -83,7 +83,7 @@
#global-menu:hover *,
#global-menu.active *,
#workspaces>button:hover * {
color: @on-primary;
color: @glass-text;
}
+5 -5
View File
@@ -24,8 +24,8 @@
}
#settings-sidebar-button:hover {
background-color: @glass-accent;
color: @on-primary;
background-color: @glass-hover;
color: @glass-text;
}
#settings-sidebar-button Label {
@@ -34,16 +34,16 @@
}
#settings-sidebar-button.active {
background-color: @glass-accent;
background-color: @glass-hover;
}
#settings-sidebar-button.active Label {
color: @on-primary;
color: @glass-text;
}
#settings-sidebar-button:hover *,
#settings-sidebar-button.active * {
color: @on-primary;
color: @glass-text;
}
#settings-content-wrapper {