dot

vizie's NixOS desktop: Hyprland, CachyOS kernel and gaming tweaks

SearchHelp
76 lines3404 bytesCSS
1/* Signal Desktop: how the main window looks.
2
3 Same recipe as Philly, Waybar, fuzzel and the control centre: near-transparent
4 black over the compositor's blur, white text, no borders, monochrome highlights.
5 Signal has no user stylesheet, so signal/launch builds a copy of the app with this
6 file added as stylesheets/custom.css and the main window made transparent;
7 decoration.blur (modules/home/desktop.nix) then does the frosting, as it does for kitty.
8
9 Signal draws nearly everything from its --axo-color-* variables, so most of the
10 theme is just new values for those. It assumes Signal's dark theme (Settings >
11 Appearance, or "System" with a dark desktop). */
12
13:root {
14 /* The window, and the panes that sit straight on it: glass. */
15 --axo-color-surface-primary: transparent;
16 --axo-color-surface-secondary: transparent;
17 --axo-color-legacy-conversation-header-bg: transparent;
18
19 /* One more layer of the same black for things drawn on the glass. */
20 --axo-color-surface-tertiary: rgba(0, 0, 0, 0.16);
21 --axo-color-surface-quaternary: rgba(0, 0, 0, 0.16);
22 --axo-color-surface-card: rgba(0, 0, 0, 0.16);
23
24 /* Message bubbles and the text field, monochrome: other people's messages a
25 faint white, your own a stronger one (Philly's hover and accent). */
26 --axo-color-surface-message-incoming: rgba(255, 255, 255, 0.08);
27 --axo-color-surface-message-outgoing: rgba(255, 255, 255, 0.2);
28
29 /* Menus and dialogs float over content Hyprland can't blur for them, so they
30 are nearly solid (the control centre's ink colour) to stay legible. */
31 --axo-color-material-primary: rgba(24, 24, 28, 0.92);
32 --axo-color-material-secondary: rgba(24, 24, 28, 0.92);
33 --axo-color-material-tertiary: rgba(24, 24, 28, 0.92);
34 --axo-color-material-tertiary-pressed: rgba(44, 44, 50, 0.92);
35 --axo-color-material-quaternary: rgba(24, 24, 28, 0.92);
36 --axo-color-material-quaternary-pressed: rgba(44, 44, 50, 0.92);
37 --axo-color-material-dialog: rgba(24, 24, 28, 0.92);
38
39 /* White text; secondary text at the control centre's dim. */
40 --axo-color-label-primary: #ffffff;
41 --axo-color-label-secondary: rgba(255, 255, 255, 0.55);
42 --axo-color-label-placeholder: rgba(255, 255, 255, 0.4);
43
44 /* No borders; a white ring for keyboard focus and selection. */
45 --axo-color-border-primary: transparent;
46 --axo-color-border-secondary: transparent;
47 --axo-color-border-focused-outer: rgba(255, 255, 255, 0.6);
48 --axo-color-border-selected: rgba(255, 255, 255, 0.6);
49
50 /* Signal's blue accent becomes white: buttons, badges, links. */
51 --axo-color-brand-primary: #ffffff;
52 --axo-color-fill-accent: rgba(255, 255, 255, 0.2);
53 --axo-color-fill-accent-pressed: rgba(255, 255, 255, 0.28);
54 --axo-color-fill-accent-tint: rgba(255, 255, 255, 0.12);
55 --axo-color-fill-accent-tint-pressed: rgba(255, 255, 255, 0.16);
56 --axo-color-label-accent: #ffffff;
57}
58
59/* The one layer of black behind everything. */
60html {
61 background: rgba(0, 0, 0, 0.1);
62}
63
64/* The desktop's font. Signal's emoji fonts stay in the list. */
65body,
66button,
67input,
68textarea {
69 font-family: "NotoSans Nerd Font", "Noto Sans", "Signal Emoji Large", "Signal Emoji Small", sans-serif;
70}
71
72/* Your own bubbles ignore the per-chat colour (ultramarine, crimson, ...), which
73 Signal sets through classes and inline styles of its own. */
74.module-message__container--outgoing[class] {
75 background: var(--axo-color-surface-message-outgoing) !important;
76}