nevaforget/moonset
1
0
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects Releases Wiki Activity

fix: use GTK theme colors, translucent cards, focus confirm on keyboard

Browse Source 
- Replace hardcoded colors with @theme_* variables for consistency
- Card backgrounds use alpha for subtle translucency over wallpaper
- Confirmation dialog grabs focus on "No" button for safe keyboard nav
This commit is contained in:
nevaforget 2026-03-27 14:02:11 +01:00
parent e770a40beb
commit 2e359f358d
2 changed files with 20 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/moonset/panel.py
View File

@ -263,6 +263,9 @@ class PanelWindow(Gtk.ApplicationWindow):
self._confirm_box.append(button_box) self._confirm_box.append(button_box)
self._confirm_area.append(self._confirm_box) self._confirm_area.append(self._confirm_box)
# Focus the "No" button — safe default for keyboard navigation
no_btn.grab_focus()
def _dismiss_confirm(self) -> None: def _dismiss_confirm(self) -> None:
"""Remove the confirmation prompt.""" """Remove the confirmation prompt."""
if self._confirm_box is not None: if self._confirm_box is not None:

34
src/moonset/style.css
View File

@ -1,16 +1,16 @@
/* ABOUTME: GTK4 CSS stylesheet for the Moonset power menu. */ /* ABOUTME: GTK4 CSS stylesheet for the Moonset power menu. */
/* ABOUTME: Catppuccin Mocha theme with action buttons and confirmation styling. */ /* ABOUTME: Uses GTK theme colors for consistency with the active desktop theme. */
/* Main panel window background */ /* Main panel window background */
window.panel { window.panel {
background-color: #1a1a2e; background-color: @theme_bg_color;
background-size: cover; background-size: cover;
background-position: center; background-position: center;
} }
/* Wallpaper-only window for secondary monitors */ /* Wallpaper-only window for secondary monitors */
window.wallpaper { window.wallpaper {
background-color: #1a1a2e; background-color: @theme_bg_color;
} }
/* Action button — square card */ /* Action button — square card */
@ -19,37 +19,37 @@ window.wallpaper {
min-height: 120px; min-height: 120px;
padding: 16px; padding: 16px;
border-radius: 16px; border-radius: 16px;
background-color: alpha(white, 0.08); background-color: alpha(@theme_base_color, 0.55);
color: white; color: @theme_fg_color;
border: none; border: none;
} }
.action-button:hover { .action-button:hover {
background-color: alpha(white, 0.20); background-color: alpha(@theme_base_color, 0.7);
} }
/* Action icon inside button */ /* Action icon inside button */
.action-icon { .action-icon {
color: white; color: @theme_fg_color;
} }
/* Action label below icon */ /* Action label below icon */
.action-label { .action-label {
font-size: 14px; font-size: 14px;
color: white; color: @theme_unfocused_fg_color;
} }
/* Confirmation box below action buttons */ /* Confirmation box below action buttons */
.confirm-box { .confirm-box {
padding: 16px 24px; padding: 16px 24px;
border-radius: 12px; border-radius: 12px;
background-color: alpha(white, 0.08); background-color: @theme_base_color;
} }
/* Confirmation prompt text */ /* Confirmation prompt text */
.confirm-label { .confirm-label {
font-size: 16px; font-size: 16px;
color: white; color: @theme_fg_color;
margin-bottom: 4px; margin-bottom: 4px;
} }
@ -57,31 +57,31 @@ window.wallpaper {
.confirm-yes { .confirm-yes {
padding: 8px 24px; padding: 8px 24px;
border-radius: 8px; border-radius: 8px;
background-color: #ff6b6b; background-color: @error_color;
color: white; color: @theme_bg_color;
border: none; border: none;
font-weight: bold; font-weight: bold;
} }
.confirm-yes:hover { .confirm-yes:hover {
background-color: #ff8787; background-color: lighter(@error_color);
} }
/* Confirm "No/Cancel" button */ /* Confirm "No/Cancel" button */
.confirm-no { .confirm-no {
padding: 8px 24px; padding: 8px 24px;
border-radius: 8px; border-radius: 8px;
background-color: alpha(white, 0.12); background-color: @theme_unfocused_bg_color;
color: white; color: @theme_fg_color;
border: none; border: none;
} }
.confirm-no:hover { .confirm-no:hover {
background-color: alpha(white, 0.25); background-color: @theme_selected_bg_color;
} }
/* Error message label */ /* Error message label */
.error-label { .error-label {
color: #ff6b6b; color: @error_color;
font-size: 14px; font-size: 14px;
} }