Make bar pretty :D

4 files changed, 263 insertions, 56 deletions

diff --git a/context.json b/context.json
index 30a2bed..cb3d953 100644
--- a/context.json
+++ b/context.json
@@ -265,8 +265,28 @@
       }
     },
     "theme": {
+      "colors": {
+        "background": "#282828",
+        "foreground": "#ebdbb2",
+        "regular0": "#282828",
+        "regular1": "#cc241d",
+        "regular2": "#98971a",
+        "regular3": "#d79921",
+        "regular4": "#458588",
+        "regular5": "#b16286",
+        "regular6": "#689d6a",
+        "regular7": "#a89984",
+        "bright0": "#928374",
+        "bright1": "#fb4934",
+        "bright2": "#b8bb26",
+        "bright3": "#fabd2f",
+        "bright4": "#83a598",
+        "bright5": "#d3869b",
+        "bright6": "#8ec07c",
+        "bright7": "#ebdbb2"
+      },
       "waybar": {
-        "font": "Lekton Nerd Font Mono"
+        "font": "Lilex Nerd Font"
       },
       "sketchybar": {
         "font": "Lekton Nerd Font Mono"
diff --git a/dots/sway/.config/sway/config.d/bindings.j2 b/dots/sway/.config/sway/config.d/bindings.j2
index abcdfa4..c4992f4 100644
--- a/dots/sway/.config/sway/config.d/bindings.j2
+++ b/dots/sway/.config/sway/config.d/bindings.j2
@@ -13,7 +13,7 @@ set $term alacritty
 set $launcher wofi
 
 bindsym --to-code {
-    $sup+q kill
+    $sup+w kill
 }
 
 bindsym --to-code {
@@ -21,8 +21,8 @@ bindsym --to-code {
     $sup+f fullscreen
 
     $sup+Space exec $launcher
-    $mod+Return exec $term
-    $mod+b exec $browser
+    $sup+b exec $browser
+    $sup+Return exec $term
 
     $mod+v layout tabbed
 }
diff --git a/dots/waybar/.config/waybar/config.j2 b/dots/waybar/.config/waybar/config.j2
index c1ea6f9..e36e003 100644
--- a/dots/waybar/.config/waybar/config.j2
+++ b/dots/waybar/.config/waybar/config.j2
@@ -1,51 +1,103 @@
 {
-  "layer": "top",
-  "position": "top",
-  "margin-top": 10,
-  "margin-right": 30,
-  "margin-left": 30,
-  "height": 50,
-
-  "modules-left": [],
-  "modules-center": ["sway/workspaces"],
-  "modules-right": [
-    "battery",
-    "pulseaudio",
-  ],
-
-  "sway/workspaces": {
-    "format": "{icon}: {name}",
-    "format-icons": {
+        "layer": "top",
+        "position": "top",
+        "modules-left": ["clock","tray"],
+        "modules-center": ["sway/workspaces"],
+        "modules-right": ["group/expand","bluetooth","network","battery"],
+        "sway/workspaces": {
+            "format": "{icon} {name}",
+            "format-icons": {
 {% for name, ws in window_manager.workspaces.items() %}
-      "{{ name }}": "{{ ws.icon }}",
+                "{{ name }}": "{{ ws.icon }}",
 {% endfor %}
-    },
-    "on-click": "activate"
-  },
-
-  "battery": {
-    "format": "{capacity}% {icon}",
-    "format-charging": " {capacity}%",
-    "format-icons": ["", "", "", "", ""],
-    "tooltip": true,
-    "interval": 5
-  },
+            },
+            "on-click": "activate"
+        },
+        "clock": {
+            "format": "{:%H:%M:%S | %a %b %e} ",
+            "interval": 1,   
+            "tooltip-format": "<tt>{calendar}</tt>",
+            "calendar": {
+                "format": {
+                    "today": "<span color='#fAfBfC'><b>{}</b></span>"
+                }
+            },
+            "actions": {
+                "on-click-right": "shift_down",
+                "on-click": "shift_up"
+            }
+        },
+        "network": {
+            "format-wifi": " ",
+            "format-ethernet":" ",
+            "format-disconnected": " ",
+            "tooltip-format-disconnected": "Error",
+            "tooltip-format-wifi": "{essid} ({signalStrength}%) ",
+            "tooltip-format-ethernet": "{ifname} 🖧 ",
+        },
+        "bluetooth": {
+            "format-on": "󰂯",
+            "format-off": "BT-off",
+            "format-disabled": "󰂲",
+            "format-connected-battery": "{device_battery_percentage}% 󰂯",
+            "format-alt": "{device_alias} 󰂯",
+            "tooltip-format": "{controller_alias}\t{controller_address}\n\n{num_connections} connected",
+            "tooltip-format-connected": "{controller_alias}\t{controller_address}\n\n{num_connections} connected\n\n{device_enumerate}",
+            "tooltip-format-enumerate-connected": "{device_alias}\n{device_address}",
+            "tooltip-format-enumerate-connected-battery": "{device_alias}\n{device_address}\n{device_battery_percentage}%",
+            "on-click-right": "blueman-manager",
+        }, 
+        "battery": {
+            "interval":30,
+            "states": {
+                "good": 95,
+                "warning": 30,
+                "critical": 20
+            },
+            "format": "{capacity}% {icon}",
+            "format-charging": "{capacity}% 󰂄",
+            "format-plugged": "{capacity}% 󰂄 ",
+            "format-alt": "{time} {icon}",
+            "format-icons": [
+                "󰁻",
+                "󰁼",
+                "󰁾",
+                "󰂀",
+                "󰂂",
+                "󰁹"
+            ],
+        },
+        "custom/expand": {
+            "format": "",
+            "tooltip": false
+        },
+        "custom/endpoint":{
+            "format": "|",
+            "tooltip": false
+        },
+        "group/expand": {
+            "orientation": "horizontal",
+            "drawer": {
+                "transition-duration": 600,
+                "transition-to-left": true,
+                "click-to-reveal": true
+            },
+            "modules": ["custom/expand","cpu","memory","temperature","custom/endpoint"],
+        },
+        "cpu": {
+            "format": "󰻠",
+            "tooltip": true
+        },
+        "memory": {
+            "format": ""
+        },
+        "temperature": {
+            "critical-threshold": 80,
+            "format": "",
+        },
+        "tray": {
+            "icon-size": 14,
+            "spacing": 10
+        },
+} 
 
-  "pulseaudio": {
-    "format": "{icon} {volume}%",
-    "format-muted": " Muted",
-    "format-bluetooth": "{icon} {volume}%",
-    "scroll-step": 2,
-    "on-click": "pavucontrol",
-    "ignored-sinks": ["Easy Effects Sink"],
-    "format-icons": {
-      "headphone": "",
-      "headset": "",
-      "hands-free": "",
-      "phone": "",
-      "portable": "",
-      "car": "",
-      "default": ["", ""]
-    }
-  },
-}
diff --git a/dots/waybar/.config/waybar/style.css.j2 b/dots/waybar/.config/waybar/style.css.j2
index 715937b..1b7a649 100644
--- a/dots/waybar/.config/waybar/style.css.j2
+++ b/dots/waybar/.config/waybar/style.css.j2
@@ -1,11 +1,146 @@
 * {
-  font-family: "{{ theme.waybar.font }}", "monospace";
+  font-family: "{{ theme.waybar.font }}";
   font-size: 16px;
 }
 
-#waybar {
-  background-color: rgba(40, 40, 40, 0.6);
-  color: #ffffff;
-  border-radius: 18px;
+window#waybar {
+  all: unset;
+}
+.modules-left {
+  padding: 7px;
+  margin: 10 0 5 10;
+  border-radius: 10px;
+  background: alpha({{ theme.colors.background }}, 0.6);
+  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.6);
+}
+.modules-center {
+  padding: 7px;
+  margin: 10 0 5 0;
+  border-radius: 10px;
+  background: alpha({{ theme.colors.background }}, 0.6);
+  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.6);
+}
+.modules-right {
+  padding: 7px;
+  margin: 10 10 5 0;
+  border-radius: 10px;
+  background: alpha({{ theme.colors.background }}, 0.6);
+  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.6);
+}
+tooltip {
+  background: {{ theme.colors.background }};
+  color: {{ theme.colors.regular7 }};
+}
+#clock:hover,
+#custom-notification:hover,
+#bluetooth:hover,
+#network:hover,
+#battery:hover,
+#cpu:hover,
+#memory:hover,
+#temperature:hover {
+  transition: all 0.3s ease;
+  color: {{ theme.colors.foreground }};
+}
+#custom-notification {
+  padding: 0px 5px;
+  transition: all 0.3s ease;
+  color: {{ theme.colors.regular7 }};
+}
+#clock {
+  padding: 0px 5px;
+  color: {{ theme.colors.regular7 }};
+  transition: all 0.3s ease;
+}
+#workspaces {
+  padding: 0px 5px;
+}
+#workspaces button {
+  all: unset;
+  padding: 0px 5px;
+  color: alpha({{ theme.colors.foreground }}, 0.4);
+  transition: all 0.2s ease;
+}
+#workspaces button:hover {
+  color: {{ theme.colors.foreground }};
+  border: none;
+  text-shadow: 0px 0px 1.5px rgba(0, 0, 0, 0.5);
+  transition: all 1s ease;
+}
+#workspaces button.active {
+  color: {{ theme.colors.foreground }};
+  border: none;
+  text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.5);
+}
+#bluetooth {
+  padding: 0px 5px;
+  transition: all 0.3s ease;
+  color: {{ theme.colors.regular7 }};
+}
+#network {
+  padding: 0px 5px;
+  transition: all 0.3s ease;
+  color: {{ theme.colors.regular7 }};
+}
+#battery {
+  padding: 0px 5px;
+  transition: all 0.3s ease;
+  color: {{ theme.colors.regular7 }};
+}
+#battery.charging {
+  color: #26a65b;
+}
+
+#battery.warning:not(.charging) {
+  color: #ffbe61;
+}
+
+#battery.critical:not(.charging) {
+  color: #f53c3c;
+  animation-name: blink;
+  animation-duration: 0.5s;
+  animation-timing-function: linear;
+  animation-iteration-count: infinite;
+  animation-direction: alternate;
+}
+#group-expand {
+  padding: 0px 5px;
+  transition: all 0.3s ease;
+}
+#custom-expand {
+  padding: 0px 5px;
+  color: alpha({{ theme.colors.foreground }}, 0.2);
+  text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.7);
+  transition: all 0.3s ease;
+}
+#custom-expand:hover {
+  color: rgba(255, 255, 255, 0.2);
+  text-shadow: 0px 0px 2px rgba(255, 255, 255, 0.5);
+}
+#custom-colorpicker {
+  padding: 0px 5px;
+}
+#cpu,
+#memory,
+#temperature {
+  padding: 0px 5px;
+  transition: all 0.3s ease;
+  color: {{ theme.colors.regular7 }};
+}
+#custom-endpoint {
+  color: transparent;
+  text-shadow: 0px 0px 1.5px rgba(0, 0, 0, 1);
+}
+#tray {
+  padding: 0px 5px;
+  transition: all 0.3s ease;
+}
+#tray menu * {
+  padding: 0px 5px;
+  transition: all 0.3s ease;
 }
 
+#tray menu separator {
+  padding: 0px 5px;
+  transition: all 0.3s ease;
+}