156 lines
4.9 KiB
CSS
156 lines
4.9 KiB
CSS
/* station-bar — "Voidstation Status Bar" theme. Colours come from _colors.css
|
|
* (@text/@bg/@accent/@violet/@danger). Mirrors orbit-menu/horizon-dock/
|
|
* astro-menu: Agave Nerd Font Mono, glow-on-hover, CyberQueer palette — this
|
|
* bar is meant to read as one more orbit of the same suite, not a separate
|
|
* look. Thin (30px) and semi-transparent violet rather than solid, with the
|
|
* shallow Cairo-drawn curve (bar.py's _draw_background) and the hologram
|
|
* overlay's scanlines/noise (lib/hologram.py) doing the visual work instead
|
|
* of a solid strip.
|
|
*/
|
|
|
|
/* Glow palette — bright, saturated variants that read as emitted light over the
|
|
* dark/blurred strip (the raw @violet is too dark for glowing text). Added in
|
|
* this process only, so the rest of the suite keeps its palette. */
|
|
@define-color glow_violet #8A5CFF;
|
|
@define-color glow_magenta #EB00A6;
|
|
@define-color glow_cyan #22D3EE;
|
|
@define-color glow_green #2BE08A;
|
|
@define-color glow_amber #F5A623;
|
|
|
|
* {
|
|
font-family: "Agave Nerd Font Mono", monospace;
|
|
font-size: 13pt;
|
|
}
|
|
|
|
window,
|
|
window.background,
|
|
.station-bar-window,
|
|
.station-content,
|
|
.station-zone,
|
|
overlay,
|
|
drawingarea {
|
|
background: transparent;
|
|
background-color: transparent;
|
|
}
|
|
|
|
.station-hologram {
|
|
background: transparent;
|
|
}
|
|
|
|
/* Neutralise the CyberQueer GTK theme's `* { background-color:#1a1a1a }` on
|
|
* every node — enumerating node names above misses some (labels, the CenterBox
|
|
* boxes). This provider is at USER+1, above the theme; interactive elements
|
|
* re-assert their own fills via the higher-specificity .class rules below. */
|
|
* {
|
|
background-color: transparent;
|
|
}
|
|
|
|
/* Everything on the bar is now a bare glowing glyph — no pills, borders, fills
|
|
* or box-shadows. Each element type is a distinct colour and glows via
|
|
* text-shadow, like the satellites orbiting an orbit-menu node. */
|
|
.station-launcher,
|
|
.station-node,
|
|
button.station-badge,
|
|
.station-badge {
|
|
background: none;
|
|
background-color: transparent;
|
|
border: none;
|
|
box-shadow: none;
|
|
min-width: 0;
|
|
min-height: 0;
|
|
padding: 0 5px;
|
|
}
|
|
|
|
.station-title {
|
|
color: @text;
|
|
opacity: 0.95;
|
|
font-size: 12pt;
|
|
text-shadow: 0 0 7px alpha(@glow_violet, 0.7);
|
|
}
|
|
|
|
/* readouts — battery / volume / clock, each its own colour */
|
|
.station-badge { color: @text; transition: text-shadow 160ms ease; }
|
|
.station-battery { color: @glow_green; text-shadow: 0 0 7px alpha(@glow_green, 0.85); }
|
|
.station-volume { color: @glow_cyan; text-shadow: 0 0 7px alpha(@glow_cyan, 0.85); }
|
|
.station-clock { color: @glow_amber; text-shadow: 0 0 7px alpha(@glow_amber, 0.85); }
|
|
.station-volume:hover { text-shadow: 0 0 13px @glow_cyan; }
|
|
|
|
/* Orbit / Astro launchers — larger glowing icon glyphs */
|
|
.station-launcher {
|
|
font-size: 17pt;
|
|
padding: 0 7px;
|
|
transition: text-shadow 160ms ease, color 160ms ease;
|
|
}
|
|
.station-orbit { color: @glow_violet; text-shadow: 0 0 9px alpha(@glow_violet, 0.9); }
|
|
.station-astro { color: @accent; text-shadow: 0 0 9px alpha(@accent, 0.9); }
|
|
.station-orbit:hover { text-shadow: 0 0 16px @glow_violet, 0 0 5px @glow_violet; }
|
|
.station-astro:hover { text-shadow: 0 0 16px @accent, 0 0 5px @accent; }
|
|
|
|
/* workspace "stations" row */
|
|
.station-ws-row { padding: 0 4px; }
|
|
.station-node {
|
|
color: alpha(@glow_violet, 0.9);
|
|
font-size: 13pt;
|
|
text-shadow: 0 0 6px alpha(@glow_violet, 0.6);
|
|
transition: color 160ms ease, text-shadow 160ms ease;
|
|
}
|
|
.station-node:hover {
|
|
color: @glow_violet;
|
|
text-shadow: 0 0 11px @glow_violet;
|
|
}
|
|
/* the focused workspace — brightest, magenta, reticle-framed in bar.py */
|
|
.station-node-active {
|
|
color: @glow_magenta;
|
|
font-weight: 700;
|
|
font-size: 14pt;
|
|
text-shadow: 0 0 13px @glow_magenta, 0 0 4px @glow_magenta;
|
|
}
|
|
|
|
/* tray pod — the drawn space-station pictogram + its icon row */
|
|
.station-tray-pod {
|
|
padding: 0 4px;
|
|
}
|
|
.station-tray-item {
|
|
background: transparent;
|
|
border: none;
|
|
padding: 0 2px;
|
|
min-width: 18px;
|
|
min-height: 18px;
|
|
transition: opacity 160ms ease;
|
|
opacity: 0.85;
|
|
}
|
|
.station-tray-item:hover { opacity: 1; }
|
|
|
|
/* Right-click context menu, rendered by us from the item's com.canonical.dbusmenu
|
|
* (tray.py). Themed to match the suite: translucent violet-charcoal glass, violet
|
|
* frame, accent on the hovered/active row. */
|
|
.station-tray-menu > contents,
|
|
.station-tray-menu > arrow {
|
|
background-color: alpha(@bg, 0.92);
|
|
border: 1px solid alpha(@violet, 0.85);
|
|
border-radius: 12px;
|
|
box-shadow: 0 0 18px alpha(@violet, 0.35);
|
|
}
|
|
.station-tray-menu modelbutton {
|
|
border-radius: 8px;
|
|
padding: 4px 10px;
|
|
color: @text;
|
|
min-height: 22px;
|
|
}
|
|
.station-tray-menu modelbutton:hover {
|
|
background-color: alpha(@violet, 0.35);
|
|
color: #F0E6EA;
|
|
}
|
|
.station-tray-menu modelbutton:active,
|
|
.station-tray-menu modelbutton:checked {
|
|
background-color: alpha(@accent, 0.40);
|
|
}
|
|
.station-tray-menu separator {
|
|
background-color: alpha(@violet, 0.35);
|
|
min-height: 1px;
|
|
margin: 3px 6px;
|
|
}
|
|
.station-tray-menu modelbutton:disabled {
|
|
color: alpha(@text, 0.45);
|
|
}
|