/* astal-menu — CyberQueer theme. Colours come from _colors.css (@text/@bg/@accent/ * @violet/@danger). Mirrors the existing bar idiom: Agave Nerd Font Mono, 3px * borders, ~25px pill radii. Touch-friendly hit targets throughout. */ * { font-family: "Agave Nerd Font Mono", monospace; font-size: 13pt; } /* ---- window / letterbox --------------------------------------------- */ /* The backmost surface must be fully transparent so each module floats on its own * drawn border/background. The bare `window` (and its default `.background` node) * is included because the GTK theme paints a solid colour there that a plain * `.menu-window` rule does not always override. */ window, window.background, .menu-window, #menu-window, .panel, #panel-root { background: transparent; background-color: transparent; } #backdrop { background: alpha(black, 0.25); } /* Letterbox margins are set in code (window.py) as a fraction of the monitor so * the inset scales per display; this box just carries the panel background. */ /* ---- quad grid + cards ---------------------------------------------- */ .quad-grid.dimmed { opacity: 0.15; } .quad-card { min-height: 190px; } .section-title { color: @text; font-weight: bold; opacity: 0.85; } .quad-card, .quad-expanded, .appdrawer, .taskbar, .favorites { background: @bg; border: 3px solid @accent; border-radius: 18px; padding: 12px 14px; margin: 3px; /* keep the border off the grid/overlay clip edge */ } .quad-header, .appdrawer-header, .expanded-header { margin-bottom: 8px; } .quad-title { color: @text; font-weight: bold; } .quad-icon { color: @accent; font-size: 15pt; } .quad-body { color: @text; } /* pill action buttons */ .quad-action, .enable-btn { color: @text; background: @bg; border: 3px solid @violet; border-radius: 25px; padding: 6px 14px; min-height: 32px; min-width: 32px; } .quad-action:hover, .enable-btn:hover { border-color: @accent; color: @accent; } .quad-action:active, button:checked.quad-action { background: @accent; color: @bg; border-color: @accent; } .quad-disabled { color: @text; opacity: 0.7; } .enable-btn { border-color: @accent; } /* settings popover */ .quad-settings { background: @bg; border: 3px solid @violet; border-radius: 16px; padding: 10px; } .switch-row { min-height: 36px; } .expanded-header .quad-title { font-size: 14pt; } /* ---- appdrawer ------------------------------------------------------ */ .appdrawer-search { border: 3px solid @violet; border-radius: 25px; padding: 8px 14px; margin-bottom: 8px; color: @text; background: @bg; } .appdrawer-search:focus-within { border-color: @accent; } .app-tile { background: transparent; border: 2px solid transparent; border-radius: 16px; padding: 10px 6px; min-width: 92px; } .app-tile:hover { border-color: @accent; background: alpha(@violet, 0.18); } .app-tile label { color: @text; font-size: 10pt; } /* ---- favourites row (top of drawer) --------------------------------- */ .favorites-row { padding: 4px 0; } .fav-tile { background: @bg; border: 2px solid @violet; border-radius: 16px; padding: 6px 12px; min-height: 40px; } .fav-tile:hover { border-color: @accent; } .fav-tile label { color: @text; font-size: 11pt; } /* ---- taskbar (open windows) ----------------------------------------- */ .taskbar-row { padding: 4px 0; } .task-tile { background: transparent; border: 2px solid transparent; border-radius: 14px; padding: 6px 10px; min-height: 44px; min-width: 44px; } .task-tile:hover { border-color: @accent; background: alpha(@violet, 0.18); } .task-badge { color: @bg; background: @accent; border-radius: 10px; padding: 0 6px; font-size: 9pt; } .task-popover { background: @bg; border: 3px solid @violet; border-radius: 14px; padding: 6px; } .task-window { color: @text; background: transparent; border-radius: 10px; padding: 6px 12px; } .task-window:hover { color: @accent; } /* ---- location map --------------------------------------------------- */ .map-view { border-radius: 14px; } .map-info { color: @text; padding: 6px 2px 0 2px; font-size: 11pt; } .map-marker { color: @accent; } /* ---- weather -------------------------------------------------------- */ .ansi-view, .ansi-view text { background: @bg; color: @text; font-family: "Agave Nerd Font Mono", monospace; font-size: 11pt; padding: 4px; } .weather-status { color: @text; opacity: 0.7; } /* ---- bluetooth / network shared rows -------------------------------- */ .bt-row, .net-row { padding: 8px 6px; border-radius: 12px; min-height: 40px; } .bt-row:hover, .net-row:hover { background: alpha(@violet, 0.15); } .bt-status { color: @accent; font-size: 10pt; } .bt-history label, .net-ip { color: @text; opacity: 0.85; font-size: 11pt; } .net-switcher { margin-bottom: 8px; } .net-entry { border: 2px solid @violet; border-radius: 12px; padding: 6px 10px; color: @text; background: @bg; } .net-entry:focus-within { border-color: @accent; } .pubip { color: @accent; font-size: 15pt; } /* switches / scrollbars pick up the accent */ switch:checked { background: @accent; } scrollbar slider { background: @violet; border-radius: 8px; min-width: 6px; } scrollbar slider:hover { background: @accent; } /* module frames — Gtk.Frame paints borders reliably where boxes do not */ .module-frame { border: 3px solid @accent; border-radius: 16px; background: @bg; } .module-frame > box { padding: 10px 12px; } /* floating panel + close button */ .panel { padding: 2px; } .close-btn { color: @text; background: @bg; border: 2px solid @accent; border-radius: 20px; min-width: 34px; min-height: 34px; margin: 2px 4px; } .close-btn:hover { background: @accent; color: @bg; }