style: update dropdown CSS for native Gtk.Menu approach

Replace ID-based selectors with global menu/menuitem/separator
selectors matching fabric-shell's CSS strategy.
This commit is contained in:
sankalp committed 2026-07-28 09:59:38 +05:45
1 parent 8407c9685c
commit efcf54a6d2
1 file changed
+19 -78
+19 -78
View File
@@ -1,107 +1,48 @@
#dropdown-menu {
background-color: transparent;
/* ── GtkMenu global styles ── */
border-radius: 0.75rem;
margin: 0;
.background.popup {
background: transparent;
}
#dropdown-options {
background-color: @glass-menu;
/* GtkMenu container */
menu {
background-color: @glass-popup;
border: 1px solid @glass-border;
border-radius: 0.75rem;
padding: 0.5rem;
}
#dropdown-option {
background-color: transparent;
/* GtkMenuItem */
menu menuitem {
border-radius: apply(radius-xs);
padding: 0px 10px;
margin: 1px 2px;
color: @glass-text;
transition: all 0ms ease-in-out;
}
#dropdown-option:hover {
color: @glass-text;
transition: all 20ms ease-in-out;
/* GtkMenuItem hover */
menu menuitem:hover {
background-color: @glass-hover;
}
#dropdown-option:hover #dropdown-option-label {
color: @glass-text;
}
#dropdown-option-label {
/* GtkMenuItem label */
menu menuitem label {
font-size: apply(font-md);
margin: 0px;
color: @glass-text;
color: inherit;
font-weight: 400;
}
#dropdown-option-label:first-child {
padding-right: 5rem;
}
#dropdown-option:hover #dropdown-option-keybind {
color: @glass-text;
}
#dropdown-option-keybind {
font-weight: 500;
/* Submenu arrow */
menu menuitem arrow {
color: @glass-text-secondary;
}
/* Divider */
#dropdown-divider-box {
background-color: transparent;
border-radius: apply(radius-xs);
padding: 0px 10px;
margin: 2px;
}
#dropdown-divider {
border-bottom: 1px solid @glass-divider;
margin: 2px 0;
}
/* ── GtkMenu submenus — same IDs as ModusDropdown ── */
/* Popup window transparent background */
.background.popup {
background: transparent;
}
/* Hide GtkMenuButton default arrow indicator */
#global-menu indicator,
#panel-button indicator {
min-width: 0;
min-height: 0;
margin: 0;
padding: 0;
-gtk-icon-source: none;
}
/* Menu item label text */
#dropdown-option label {
font-size: apply(font-md);
margin: 0px;
color: @glass-text;
font-weight: 400;
}
/* Menu item submenu arrow */
#dropdown-option arrow {
color: @glass-text-secondary;
}
/* Disabled — GTK3 uses :insensitive */
#dropdown-option:insensitive {
/* Disabled */
menu menuitem:disabled {
color: @glass-text-disabled;
opacity: 0.5;
}
/* Separator line inside GtkSeparatorMenuItem */
#dropdown-divider menuitem *,
#dropdown-divider * {
background: @glass-divider;
min-height: 1px;
margin: 4px 0;
}