included vikingowl's stuff

eww/eww.scss

@@ -1,11 +1,49 @@
+@import 'widgets';
+
 * {
   all: unset;
 }
 
-/* Widgets */
-.lorem-text {
-  background: darkgrey;
-  color: black;
+tooltip {
+  background: #2E3440;
+  color: #E5E6E7;
+  border-radius: 1.5rem 1rem;
+  border: 1px solid #6F7175;
+}
+
+.popup {
+  background: #2E3440;
+  color: #E5E6E7;
+  border: 1px solid #6F7175;
+}
+
+.popup menuitem:hover {
+  background: grey;
+}
+
+window {
+  background: transparent;
+  color: transparent;
+
+  * {
+    font-family: 'Inconsolata Go Nerd Font';
+    font-size: 0.85rem;
+    border-radius: 1.5rem 1rem;
+    padding: 2px 6px;
+  }
+
+  /* Modules */
+  .left {
+    //background: orange;
+  }
+
+  .center {
+    //background: blue;
+  }
+
+  .right {
+    //background: yellow;
+  }
 }
 
 .workspace{
@@ -32,39 +70,3 @@
     color: white;
   }
 }
-
-.music {
-  background: transparent;
-  color: transparent;
-
-  &--off {
-    background: transparent;
-    color: transparent;
-  }
-
-  &--on {
-    background: #8ce513;
-    color: #010101;
-  }
-
-  &--spotify {
-    background: #17d860;
-    color: #282828;
-  }
-
-  &--firefox {
-    background: #fd8728;
-    color: #010101;
-  }
-
-  &--mpv {
-    background: #420042;
-    color: white;
-  }
-
-  &--chromium {
-    background: #1a73e8;
-    color: white;
-  }
-}
-

eww/eww.yuck

@@ -1,10 +1,7 @@
-(include "./widgets/media.yuck")
-(include "./widgets/lorem.yuck")
-(include "./widgets/hypr_activewindow.yuck")
-(include "./widgets/hypr_workspaces.yuck")
+(include "./widgets.yuck")
 
-(defwindow topbar_0
-  :monitor 1
+(defwindow topbar_DP-3
+  :monitor "DP-3"
   :geometry (geometry :x "0%"
              :y "0%"
              :width "90%"
@@ -38,11 +35,13 @@
        :spacing 5
    (media)))
 
-  
 (defwidget right []
-  (box :orientation 'h'
-       :class 'right'
-       :space-evenly false
-       :spacing 5
-       :halign 'end'
-    (loremText :text "Bar stuff")))
+  (box
+    :orientation 'h'
+    :class 'right'
+    :space-evenly false
+    :spacing 5
+    :halign 'end'
+    (hyprsunset)
+    (datetime)
+    (stray)))

eww/widgets.scss

@@ -0,0 +1,5 @@
+@import 'widgets/media';
+@import 'widgets/datetime.scss';
+@import 'widgets/systray';
+@import 'widgets/hyprsunset';
+@import 'widgets/lorem-text';

eww/widgets.yuck

@@ -0,0 +1,7 @@
+(include "widgets/media.yuck")
+(include "widgets/datetime.yuck")
+(include "widgets/systray.yuck")
+(include "widgets/hyprsunset.yuck")
+(include "widgets/lorem-text.yuck")
+(include "widgets/hypr_workspaces.yuck")
+(include "widgets/hypr_activewindow.yuck")

eww/widgets/datetime.scss

@@ -0,0 +1,4 @@
+.datetime {
+  background: #2E3440;
+  color: #E5E6E7;
+}

eww/widgets/datetime.yuck

@@ -0,0 +1,19 @@
+(defwidget datetime []
+  (box
+    :class "datetime"
+    :halign "center"
+    :valign "center"
+    { time == ''
+      ? ''
+      : time
+    }
+  )
+)
+
+(defvar time-visible false)
+(defpoll time
+  :interval "1s"
+  :initial "initial-value"  ; optional, defaults to poll at startup
+  :run-while time-visible   ; optional, defaults to 'true'
+  `date +"%H:%M - %a, %d %b"`        ; https://www.man7.org/linux/man-pages/man1/date.1.html
+)

eww/widgets/hyprsunset.scss

@@ -0,0 +1,4 @@
+.hypr-sunset {
+  background: #003366;
+  color: #e5e6e7;
+}

eww/widgets/hyprsunset.yuck

@@ -0,0 +1,16 @@
+(defvar temperature "4500k")
+(defvar display-fix "off")
+(defwidget hyprsunset []
+  (box
+    :class "hypr-sunset"
+    :halign "center"
+    :valign "center"
+    (eventbox
+      :cursor "pointer"
+      :onclick `${display-fix == "off" 
+        ? "eww update display-fix=on && nohup hyprsunset -t ${temperature} > /dev/null 2>&1 &"
+        : "eww update display-fix=off && pkill hyprsunset"}`
+      `${display-fix == "off" ? "󰛨  Off" : "󱩌  On"}`
+    )
+  )
+)

eww/widgets/lorem-text.scss

@@ -0,0 +1,4 @@
+.lorem-text {
+  background: darkgrey;
+  color: black;
+}

eww/widgets/lorem-text.yuck

@@ -0,0 +1,6 @@
+(defwidget loremText [text]
+  (label
+    :text text
+    :class 'lorem-text'
+  )
+)

eww/widgets/media.scss

@@ -0,0 +1,34 @@
+.music {
+  background: transparent;
+  color: transparent;
+
+  &--off {
+    background: transparent;
+    color: transparent;
+  }
+
+  &--on {
+    background: #8ce513;
+    color: #010101;
+  }
+
+  &--spotify {
+    background: #17d860;
+    color: #282828;
+  }
+
+  &--firefox {
+    background: #fd8728;
+    color: #010101;
+  }
+
+  &--mpv {
+    background: #420042;
+    color: white;
+  }
+
+  &--chromium {
+    background: #1a73e8;
+    color: white;
+  }
+}

eww/widgets/media.yuck

@@ -11,14 +11,15 @@
 (defvar ellipsisArtist 20) ; set length for ellipsis on artist
 (defvar ellipsisTitle 25) ; set length for ellipsis on title
 (defwidget media []
-  (box :class "media"
-       :halign "center"
-       :valign "center"
-       :class { playerctl == '' || objectlength(playerctl) == 0
-          ? 'music--off'
-          : matches(playerctl.player, playerRegex)
-            ? 'music--' + playerctl.player
-            : 'music--on' }
+  (box
+    :class "media"
+    :halign "center"
+    :valign "center"
+    :class { playerctl == '' || objectlength(playerctl) == 0
+      ? 'music--off'
+      : matches(playerctl.player, playerRegex)
+        ? 'music--' + playerctl.player
+        : 'music--on' }
     { playerctl == '' || objectlength(playerctl) == 0
       ? ''
       : matches(playerctl.player, playerRegex)
@@ -28,6 +29,7 @@
   )
 )
 
-(deflisten playerctl :initial ""
+(deflisten playerctl
+  :initial ""
   `playerctl --follow metadata --format '{"player": "{{ playerName }}", "trackid": "{{ mpris:trackid }}", "length": "{{ duration(mpris:length) }}", "artUrl": "{{ mrpis:artUrl }}", "album": "{{ album }}", "albumArtist": "{{ xesam:albumArtist }}", "artist": "{{ artist }}", "autoRating": "{{ xesam:autoRating }}", "discNumber": "{{ xesam:discNumber }}", "title": "{{ title }}", "trackNumber": "{{ xesam:trackNumber }}", "url": "{{ xesam:url }}", "position": "{{ position }}"}'`
 )

eww/widgets/systray.scss

@@ -0,0 +1,5 @@
+.systray {
+  background: #2E3440;
+  color: #E5E6E7;
+}
+

eww/widgets/systray.yuck

@@ -0,0 +1,10 @@
+(defwidget stray []
+  (systray
+    :class "systray"
+    :halign "center"
+    :valign "center"
+    :active true
+    :icon-size 16
+    :spacing -5
+  )
+)