Dotfiles/desktopenvs/hyprdrive/transmitter-panel/style/style.css

134 lines
3.5 KiB
CSS

/* transmitter-panel — beacon's notification-history viewer. Matches the
* astro-menu/beacon idiom: emitted-magenta text, violet holo-glass fills,
* glow-violet/accent frames, Agave Nerd Font Mono, rounded panels. The
* compositor blurs behind the translucent fill (see the `transmitter-panel`
* layer-rule in hypr/usr/windowrules.lua); the scanline/sweep/noise depth is
* Cairo-drawn on top by lib/hologram.py. */
@define-color text #EB00A6; /* emitted magenta, same override astro-menu/beacon use */
* {
font-family: "Agave Nerd Font Mono", monospace;
font-size: 12pt;
}
/* Blank the structural nodes so the CyberQueer theme's `* { background-color:
* #1a1a1a }` doesn't fill the surface/gaps with an opaque slab — the panel
* asserts its own glass fill below (same trick as beacon/style/style.css). */
window,
window.background,
.tx-window,
.tx-list,
box,
overlay,
label,
image,
drawingarea {
background: transparent;
background-color: transparent;
}
/* the holo-glass panel */
.tx-panel {
background-color: alpha(@violet, 0.40);
border: 2px solid #8A5CFF;
border-radius: 16px;
padding: 14px 16px;
box-shadow: 0 0 16px 1px alpha(#8A5CFF, 0.35);
}
/* right margin keeps "Clear All" clear of the overlaid panel-level ✕ button
* (min-width 34px + its own 20px right margin, see .close-btn below — a
* ~54px footprint from the right edge), since both sit in the top-right
* corner otherwise. */
.tx-header { margin: 0 64px 8px 0; }
.tx-title {
color: @text;
font-weight: bold;
font-size: 13pt;
letter-spacing: 1px;
}
.tx-clear-all {
color: @text;
background-color: alpha(@violet, 0.4);
border: 2px solid #8A5CFF;
border-radius: 20px;
padding: 4px 14px;
min-height: 26px;
transition: border-color 180ms ease, color 180ms ease, box-shadow 220ms ease, background 180ms ease;
}
.tx-clear-all:hover {
border-color: @accent;
color: @accent;
box-shadow: 0 0 12px 1px alpha(@accent, 0.55);
}
.tx-empty {
color: @text;
opacity: 0.6;
padding: 18px 4px;
}
/* per-entry rows */
.tx-row {
padding: 8px 10px;
border-radius: 12px;
min-height: 34px;
transition: background 180ms ease;
}
.tx-row:hover { background: alpha(@violet, 0.16); }
.tx-row-icon { margin-right: 2px; }
.tx-row-app {
color: @text;
opacity: 0.65;
font-size: 9pt;
letter-spacing: 0.5px;
}
.tx-row-summary {
color: @text;
font-weight: bold;
font-size: 11.5pt;
}
.tx-row-body {
color: @text;
font-size: 10.5pt;
opacity: 0.9;
}
/* small per-row dismiss ✕ — a scaled-down .close-btn */
.tx-row-close {
color: @text;
background: alpha(@violet, 0.4);
border: none;
border-radius: 14px;
min-width: 24px;
min-height: 24px;
transition: background 180ms ease, color 180ms ease, box-shadow 220ms ease;
}
.tx-row-close:hover {
background: @accent;
color: @bg;
box-shadow: 0 0 10px 1px alpha(@accent, 0.5);
}
/* floating panel-level close button (top-right, closes the whole popup) —
* copied verbatim from astro-menu/style/style.css's .close-btn idiom. */
.close-btn {
color: @text; background: alpha(@violet, 0.4);
border: none; border-radius: 20px;
min-width: 34px; min-height: 34px;
margin: 16px 20px;
transition: background 180ms ease, color 180ms ease, box-shadow 220ms ease;
}
.close-btn:hover {
background: @accent;
color: @bg;
box-shadow: 0 0 14px 2px alpha(@accent, 0.55);
}
scrollbar slider { background: @violet; border-radius: 8px; min-width: 6px; }
scrollbar slider:hover { background: @accent; }
.tx-hologram { background: transparent; }