summaryrefslogtreecommitdiff
path: root/dotfiles/system/.config/waybar/style.css
diff options
context:
space:
mode:
Diffstat (limited to 'dotfiles/system/.config/waybar/style.css')
-rw-r--r--dotfiles/system/.config/waybar/style.css194
1 files changed, 194 insertions, 0 deletions
diff --git a/dotfiles/system/.config/waybar/style.css b/dotfiles/system/.config/waybar/style.css
new file mode 100644
index 0000000..787fe7f
--- /dev/null
+++ b/dotfiles/system/.config/waybar/style.css
@@ -0,0 +1,194 @@
+/* =============================================================================
+ *
+ * Waybar configuration
+ *
+ * Configuration reference: https://github.com/Alexays/Waybar/wiki/Configuration
+ *
+ * =========================================================================== */
+
+/* -----------------------------------------------------------------------------
+ * Keyframes
+ * -------------------------------------------------------------------------- */
+
+@keyframes blink-warning {
+ 70% {
+ color: white;
+ }
+
+ to {
+ color: white;
+ background-color: orange;
+ }
+}
+
+@keyframes blink-critical {
+ 70% {
+ color: white;
+ }
+
+ to {
+ color: white;
+ background-color: red;
+ }
+}
+
+
+/* -----------------------------------------------------------------------------
+ * Base styles
+ * -------------------------------------------------------------------------- */
+
+/* Reset all styles */
+* {
+ border: none;
+ border-radius: 0;
+ min-height: 0;
+ margin: 0;
+ padding: 0;
+}
+
+/* The whole bar */
+#waybar {
+ background: #323232;
+ color: white;
+ font-family: Cantarell, Noto Sans, sans-serif;
+ font-size: 13px;
+}
+
+/* Each module */
+#battery,
+#clock,
+#cpu,
+#custom-keyboard-layout,
+#memory,
+#mode,
+#network,
+#pulseaudio,
+#temperature,
+#tray {
+ padding-left: 10px;
+ padding-right: 10px;
+}
+
+
+/* -----------------------------------------------------------------------------
+ * Module styles
+ * -------------------------------------------------------------------------- */
+
+#battery {
+ animation-timing-function: linear;
+ animation-iteration-count: infinite;
+ animation-direction: alternate;
+}
+
+#battery.warning {
+ color: orange;
+}
+
+#battery.critical {
+ color: red;
+}
+
+#battery.warning.discharging {
+ animation-name: blink-warning;
+ animation-duration: 3s;
+}
+
+#battery.critical.discharging {
+ animation-name: blink-critical;
+ animation-duration: 2s;
+}
+
+#clock {
+ font-weight: bold;
+}
+
+#cpu {
+ /* No styles */
+}
+
+#cpu.warning {
+ color: orange;
+}
+
+#cpu.critical {
+ color: red;
+}
+
+#memory {
+ animation-timing-function: linear;
+ animation-iteration-count: infinite;
+ animation-direction: alternate;
+}
+
+#memory.warning {
+ color: orange;
+}
+
+#memory.critical {
+ color: red;
+ animation-name: blink-critical;
+ animation-duration: 2s;
+}
+
+#mode {
+ background: #64727D;
+ border-top: 2px solid white;
+ /* To compensate for the top border and still have vertical centering */
+ padding-bottom: 2px;
+}
+
+#network {
+ /* No styles */
+}
+
+#network.disconnected {
+ color: orange;
+}
+
+#pulseaudio {
+ /* No styles */
+}
+
+#pulseaudio.muted {
+ /* No styles */
+}
+
+#custom-spotify {
+ color: rgb(102, 220, 105);
+}
+
+#temperature {
+ /* No styles */
+}
+
+#temperature.critical {
+ color: red;
+}
+
+#tray {
+ /* No styles */
+}
+
+#window {
+ font-weight: bold;
+}
+
+#workspaces button {
+ border-top: 2px solid transparent;
+ /* To compensate for the top border and still have vertical centering */
+ padding-bottom: 2px;
+ padding-left: 10px;
+ padding-right: 10px;
+ color: #888888;
+}
+
+#workspaces button.focused {
+ border-color: #4c7899;
+ color: white;
+ background-color: #285577;
+}
+
+#workspaces button.urgent {
+ border-color: #c9545d;
+ color: #c9545d;
+}