Add eww bar

2023-11-11 11:26:23 +01:00
parent 48e4b9db44
commit 704871969f
3 changed files with 181 additions and 0 deletions
--- a/tree/.config/eww/eww.scss
+++ b/tree/.config/eww/eww.scss
@ -0,0 +1,105 @@
+$black: #1D2021;
+$black1: #282828;
+$white: #FBF1C7;
+$grey: #A89984;
+$blue: #458588;
+$cyan: #8EC07C;
+$pink: #D3869B;
+$yellow: #FABD2F;
+$purple: #B12686;
+$teal: #8EC07C;
+$darkteal: #689D6A;
+$green: #B8BB26;
+$orange: #FE8019;
+$red: #FB4934;
+$bluealt: $black1;
+$blackdark: $black;
+
+*{
+	all: unset;
+	font-family: "Sauce Code Pro Nerd Font Mono";
+}
+
+window {
+	background: $blackdark;
+	border-radius: 15px;
+}
+
+.workspace {
+	font-size: 18px;
+	font-weight: 300;
+	border: solid wheat 1px;
+	background: black;
+	color: wheat;
+	border-radius: 30px;
+	padding-top: 3px;
+	padding-bottom: 5px;
+	margin: 8px;
+	margin-top: 3px;
+	margin-bottom: 3px;
+    box-shadow: 0 0px 5px 1px #06060b;
+	transition: all 1s;
+}
+
+.workspace.active {
+	background: wheat;
+	color: black;
+}
+
+.workspaces {
+	margin-top: 10px;
+	margin-bottom: 10px;
+}
+
+scale trough {
+  all: unset;
+  background-color: #22242b;
+  box-shadow: 0 0px 5px 1px #06060b;
+  border-radius: 16px;
+  min-width: 16px;
+  min-height: 70px;
+  margin: 0px 0px 0px 0px;
+}
+
+.volume {
+	min-height: 150px;
+}
+
+.volume trough highlight {
+    background-image: linear-gradient(to right, #6b4f73 30%, #5b3f63 50%, #5b3f63 100% *50);
+    border-radius: 10px;
+}
+
+.vpn {
+	font-size: 40px;
+	color: wheat;
+	border-bottom: dotted green 6px;
+	margin: 2px;
+	margin-top: 20px;
+	transition: border-color 1s;
+}
+
+.vpn label {
+	margin-top: -5px;
+	margin-bottom: -5px;
+}
+
+.vpn.connecting {
+	border-color: orange;
+}
+
+.vpn.disconnected {
+	border-color: red;
+}
+
+.clock {
+	font-size: 30px;
+	font-weight: 400;
+	color: wheat;
+	margin-top: 20px;
+	margin-bottom: 20px;
+}
+.clock label {
+	padding: 0;
+	margin-top: -11px;
+}
--- a/tree/.config/eww/eww.yuck
+++ b/tree/.config/eww/eww.yuck
@ -0,0 +1,67 @@
+(defwindow bar
+           :monitor 0
+           :geometry (geometry :y "0%"
+                               :x "10px"
+                               :height "90%"
+                               :width "50px"
+                               :anchor "center left")
+           :stacking "fg"
+		   :exclusive true
+		   (box :orientation "v" 
+		     (workspaces)
+			 (bottom)
+		    ))
+
+(defwidget bottom []
+    (box :orientation "v"
+         :space-evenly false
+		 :valign "end"
+			 (speaker)
+			 (vpn)
+			 (clock)
+))
+
+(defwidget workspaces []
+  (box :orientation "v"
+       :valign "start"
+	   :class "workspaces"
+    (for workspace in workspaces_json
+	  (label :class 'workspace ${workspace.class}' :text '${workspace.id}')
+	  )
+	))
+
+(defwidget speaker []
+  (box
+		 :class "volume"
+		 :orientation "v"
+		 :valign "end"
+    (scale
+		 :orientation "v"
+		 :flipped true
+	     :min 0
+	     :max 100
+	     :value volume_out
+		 :onchange "pamixer --set-volume {} && volshow")
+	))
+
+(defwidget vpn []
+  (button
+       :valign "end"
+	   :class "vpn ${vpn_status.class}"
+	   :onclick "${vpn_status.on_click}"
+    (label :text '${vpn_status.icon}')
+	))
+
+(defwidget clock []
+  (box :orientation "v"
+       :valign "end"
+	   :class "clock"
+    (label :text current_hour)
+    (label :text current_minute)
+	))
+
+(defpoll workspaces_json :interval "1s" "eww-workspaces")
+(defpoll volume_out :interval "1s" "pamixer --get-volume")
+(defpoll vpn_status :interval "1s" "mullvad-status")
+(defpoll current_minute :interval "1s" "date +%M")
+(defpoll current_hour   :interval "1s" "date +%H")