My dotfiles for Arch Linux
1* {
2 font-family: "Fira Sans Semibold", "Font Awesome 6 Free", FontAwesome, Roboto, Helvetica, Arial, sans-serif;
3}
4
5window#waybar {
6 background-color: #0f1117;
7 font-size: 14px;
8 border-radius: 0px;
9 margin: 0px;
10 padding: 0;
11}
12
13/* Left-most: Arch icon */
14#custom-appmenu {
15 font-size: 4px;
16 background-image: url('/usr/share/icons/cachyos.svg');
17 background-color: #1e222a;
18 background-position: center;
19 background-repeat: no-repeat;
20 background-size: contain;
21 padding: 0px 12px;
22
23}
24
25/* Right-most: Clock */
26#clock {
27 font-size: 14px;
28 background-color: #1e222a;
29 color: #c0c0c0;
30 border-radius: 0px;
31 padding: 0px 8px;
32}
33
34/* Active window title */
35#window {
36 font-size: 14px;
37 font-weight: 800;
38 color: #e0e0e0;
39 border-radius: 0px;
40 padding: 4px 12px;
41 background-color: #1e222a;
42}
43
44/* Workspace container */
45#niri-workspaces {
46 background: #1e222a;
47 font-weight: bold;
48 border-radius: 0px;
49 font-size: 8px;
50 color: #e0e0e0;
51}
52
53/* Individual workspace buttons */
54#niri-workspaces button {
55 border-radius: 0px;
56 font-size: 8px;
57}
58
59#workspaces button.active {
60 border-radius: 0px;
61 color: #0f1117;
62 background: #00ac89;
63}
64
65#workspaces button:hover {
66 border-radius: 0px;
67 background: #0d3531;
68 border-width: 0px;
69}
70
71/* Power/exit button */
72#custom-exit {
73 background-color: #00ac89;
74 font-size: 14px;
75 font-weight: 800;
76 color: #0f1117;
77 padding: 0px 6px;
78 margin: 2px 2px 2px 0;
79}
80
81/* Tooltips */
82tooltip {
83 border-radius: 12px;
84 background-color: #0f1117;
85 color: #c0c0c0;
86 padding: 4px 8px;
87}
88
89/* Taskbar */
90#taskbar {
91 background-color: #1e222a;
92 margin: 0px;
93 border-radius: 0px;
94 font-weight: normal;
95}
96
97/* All system info modules */
98#backlight,
99#pulseaudio,
100#network,
101#bluetooth,
102#battery,
103#tray,
104#custom-updates,
105#custom-notification {
106 background-color: #1e222a;
107 font-size: 14px;
108 font-weight: 800;
109 color: #c0c0c0;
110 border-radius: 0px;
111 padding: 4px 10px;
112}
113
114/* Battery critical warning */
115#battery.critical:not(.charging) {
116 background-color: #e65100;
117 color: #ffffff;
118 animation: blink 0.5s linear infinite alternate;
119}
120
121@keyframes blink {
122 to {
123 background-color: #0f1117;
124 color: #ffffff;
125 }
126}