desktop: added the system information section and some basic styles

2 files changed, 28 insertions, 6 deletions

diff --git a/modules/desktop/eww/eww.mustache.scss b/modules/desktop/eww/eww.mustache.scss
index dc2d181..52049af 100644
--- a/modules/desktop/eww/eww.mustache.scss
+++ b/modules/desktop/eww/eww.mustache.scss
@@ -12,24 +12,39 @@ window#eww-bar {
   background: transparent;
 }
 
-.workspaces, .windows {
-  padding: 5px;
+.workspaces, .windows, .system {
   border: 1px solid #{{base07}};
   margin: 5px;
 }
 
-.workspace-button, .window-button {
-  padding: 8px;
+.workspaces, .windows {
+  padding: 5px;
+}
+
+.workspace-button, .window-button, .system-item {
   color: #{{base07}};
   font-size: 24px;
   background-color: #{{base00}};
-  border: 1px solid #{{base03}};
   background-image: none;
   box-shadow: none;
   text-shadow: none;
   outline: none;
 }
 
+.workspace-button, .window-button {
+  padding: 8px;
+  border: 1px solid #{{base03}};
+}
+
+.system-item {
+  font-size: 12px;
+  border-bottom: 1px solid #{{base07}};
+}
+
+.system-item:last-child {
+  border: none;
+}
+
 .workspace-button.active, .window-button.focused {
   border-color: #{{base07}};
 }
diff --git a/modules/desktop/eww/yuck.nix b/modules/desktop/eww/yuck.nix
index f4040d5..d522d9b 100644
--- a/modules/desktop/eww/yuck.nix
+++ b/modules/desktop/eww/yuck.nix
@@ -94,7 +94,9 @@
                :vexpand true
             (workspaces-widget)
             (box :vexpand true)
-            (windows-widget)))
+            (windows-widget)
+            (box :vexpand true)
+            (system-widget)))
 
         (defwidget workspaces-widget []
           (box :orientation "v" :space-evenly false :spacing 4 :halign "fill" :class "workspaces"
@@ -118,6 +120,11 @@
                         :tooltip "''${w.app_id}: ''${w.title != ''' ? ' ' : '''}''${w.title}"
                 (box :halign "fill" :class "window-button ''${w.is_focused ? 'focused' : '''}"
                   (image :class "window-icon" :path "''${w.icon != ''' ? w.icon : '${../../../assets/icons/unknown.svg}'}" :image-width 20 :image-height 20))))))
+
+        (defwidget system-widget []
+          (box :orientation "v" :space-evenly false :spacing 6 :halign "fill" :class "system"
+            (label :class "system-item" :text time)
+            (label :class "system-item" :text date)))
       '';
   };
 }