Resize calendar clock, update dashboard width and add dolphin links to directories.

modules/menus/dashboard/directories/index.js

@@ -8,27 +8,14 @@ const Directories = () => {
       Widget.Box({
         vertical: true,
         expand: true,
-        class_name: "section left",
+        class_name: "section right",
         children: [
-          Widget.Button({
-            hpack: "start",
-            expand: true,
-            class_name: "directory-link documents",
-            on_primary_click: () => {
-              Utils.execAsync("dolphin Documents").catch(
-                (err) => `Failed to open Dolphin: ${err}`,
-              );
-            },
-            child: Widget.Label({
-              hpack: "start",
-              label: "󱧶 Documents",
-            }),
-          }),
           Widget.Button({
             hpack: "start",
             expand: true,
             class_name: "directory-link downloads",
             on_primary_click: () => {
+              App.closeWindow("dashboardmenu");
               Utils.execAsync("dolphin Downloads").catch(
                 (err) => `Failed to open Dolphin: ${err}`,
               );
@@ -38,46 +25,12 @@ const Directories = () => {
               label: "󰉍 Downloads",
             }),
           }),
-          Widget.Button({
-            expand: true,
-            hpack: "start",
-            class_name: "directory-link home",
-            on_primary_click: () => {
-              Utils.execAsync("dolphin ").catch(
-                (err) => `Failed to open Dolphin: ${err}`,
-              );
-            },
-            child: Widget.Label({
-              hpack: "start",
-              label: "󱂵 Home",
-            }),
-          }),
-        ],
-      }),
-      Widget.Box({
-        vertical: true,
-        expand: true,
-        class_name: "section right",
-        children: [
-          Widget.Button({
-            expand: true,
-            hpack: "start",
-            class_name: "directory-link pictures",
-            on_primary_click: () => {
-              Utils.execAsync("dolphin Pictures").catch(
-                (err) => `Failed to open Dolphin: ${err}`,
-              );
-            },
-            child: Widget.Label({
-              hpack: "start",
-              label: "󰉏 Pictures",
-            }),
-          }),
           Widget.Button({
             expand: true,
             hpack: "start",
             class_name: "directory-link videos",
             on_primary_click: () => {
+              App.closeWindow("dashboardmenu");
               Utils.execAsync("dolphin Videos").catch(
                 (err) => `Failed to open Dolphin: ${err}`,
               );
@@ -92,6 +45,7 @@ const Directories = () => {
             hpack: "start",
             class_name: "directory-link projects",
             on_primary_click: () => {
+              App.closeWindow("dashboardmenu");
               Utils.execAsync("dolphin Projects").catch(
                 (err) => `Failed to open Dolphin: ${err}`,
               );
@@ -103,6 +57,58 @@ const Directories = () => {
           }),
         ],
       }),
+      Widget.Box({
+        vertical: true,
+        expand: true,
+        class_name: "section left",
+        children: [
+          Widget.Button({
+            hpack: "start",
+            expand: true,
+            class_name: "directory-link documents",
+            on_primary_click: () => {
+              App.closeWindow("dashboardmenu");
+              Utils.execAsync("dolphin Documents").catch(
+                (err) => `Failed to open Dolphin: ${err}`,
+              );
+            },
+            child: Widget.Label({
+              hpack: "start",
+              label: "󱧶 Documents",
+            }),
+          }),
+          Widget.Button({
+            expand: true,
+            hpack: "start",
+            class_name: "directory-link pictures",
+            on_primary_click: () => {
+              App.closeWindow("dashboardmenu");
+              Utils.execAsync("dolphin Pictures").catch(
+                (err) => `Failed to open Dolphin: ${err}`,
+              );
+            },
+            child: Widget.Label({
+              hpack: "start",
+              label: "󰉏 Pictures",
+            }),
+          }),
+          Widget.Button({
+            expand: true,
+            hpack: "start",
+            class_name: "directory-link home",
+            on_primary_click: () => {
+              App.closeWindow("dashboardmenu");
+              Utils.execAsync("dolphin ").catch(
+                (err) => `Failed to open Dolphin: ${err}`,
+              );
+            },
+            child: Widget.Label({
+              hpack: "start",
+              label: "󱂵 Home",
+            }),
+          }),
+        ],
+      }),
     ],
   });
 };

modules/menus/dashboard/stats/index.js

@@ -130,10 +130,23 @@ const Stats = () => {
             hexpand: true,
             vpack: "center",
             children: [
-              Widget.Label({
+              Widget.Button({
+                on_primary_click: () => {
+                  App.closeWindow("dashboardmenu");
+                  Utils.execAsync('bash -c "kitty -e btop"').catch(
+                    (err) => `Failed to open btop: ${err}`,
+                  );
+                },
                 label: "",
               }),
-              Widget.LevelBar({
+              Widget.Button({
+                on_primary_click: () => {
+                  App.closeWindow("dashboardmenu");
+                  Utils.execAsync('bash -c "kitty -e btop"').catch(
+                    (err) => `Failed to open btop: ${err}`,
+                  );
+                },
+                child: Widget.LevelBar({
                   class_name: "stats-bar",
                   hexpand: true,
                   vpack: "center",
@@ -141,6 +154,7 @@ const Stats = () => {
                   max_value: 1,
                   value: cpu.bind("value"),
                 }),
+              }),
             ],
           }),
           Widget.Label({
@@ -158,15 +172,29 @@ const Stats = () => {
             vpack: "center",
             hexpand: true,
             children: [
-              Widget.Label({
+              Widget.Button({
+                on_primary_click: () => {
+                  App.closeWindow("dashboardmenu");
+                  Utils.execAsync('bash -c "kitty -e btop"').catch(
+                    (err) => `Failed to open btop: ${err}`,
+                  );
+                },
                 label: "",
               }),
-              Widget.LevelBar({
+              Widget.Button({
+                on_primary_click: () => {
+                  App.closeWindow("dashboardmenu");
+                  Utils.execAsync('bash -c "kitty -e btop"').catch(
+                    (err) => `Failed to open btop: ${err}`,
+                  );
+                },
+                child: Widget.LevelBar({
                   class_name: "stats-bar",
                   hexpand: true,
                   vpack: "center",
                   value: ram.bind("value").as((v) => v.percentage),
                 }),
+              }),
             ],
           }),
           Widget.Label({
@@ -184,15 +212,29 @@ const Stats = () => {
             hexpand: true,
             vpack: "center",
             children: [
-              Widget.Label({
+              Widget.Button({
+                on_primary_click: () => {
+                  App.closeWindow("dashboardmenu");
+                  Utils.execAsync('bash -c "kitty -e btop"').catch(
+                    (err) => `Failed to open btop: ${err}`,
+                  );
+                },
                 label: "󰢮",
               }),
-              Widget.LevelBar({
+              Widget.Button({
+                on_primary_click: () => {
+                  App.closeWindow("dashboardmenu");
+                  Utils.execAsync('bash -c "kitty -e btop"').catch(
+                    (err) => `Failed to open btop: ${err}`,
+                  );
+                },
+                child: Widget.LevelBar({
                   class_name: "stats-bar",
                   hexpand: true,
                   vpack: "center",
                   value: gpu.bind("value"),
                 }),
+              }),
             ],
           }),
           Widget.Label({
@@ -210,15 +252,29 @@ const Stats = () => {
             hexpand: true,
             vpack: "center",
             children: [
-              Widget.Label({
+              Widget.Button({
+                on_primary_click: () => {
+                  App.closeWindow("dashboardmenu");
+                  Utils.execAsync('bash -c "kitty -e btop"').catch(
+                    (err) => `Failed to open btop: ${err}`,
+                  );
+                },
                 label: "󰋊",
               }),
-              Widget.LevelBar({
+              Widget.Button({
+                on_primary_click: () => {
+                  App.closeWindow("dashboardmenu");
+                  Utils.execAsync('bash -c "kitty -e btop"').catch(
+                    (err) => `Failed to open btop: ${err}`,
+                  );
+                },
+                child: Widget.LevelBar({
                   class_name: "stats-bar",
                   hexpand: true,
                   vpack: "center",
                   value: storage.bind("value").as((v) => v.percentage),
                 }),
+              }),
             ],
           }),
           Widget.Label({

scss/menus/calendar.scss

@@ -66,7 +66,7 @@
 }
 
 .clock-content-items {
-  min-height: 6em;
+  min-height: 8em;
 
   .clock-content-time {
     font-size: 4em;
@@ -74,7 +74,7 @@
   }
   .clock-content-period {
     font-size: 1.75em;
-    margin-bottom: 0.7em;
+    margin-bottom: 1.3em;
     margin-right: -0.875em;
     color: $teal;
   }

scss/menus/dashboard.scss

@@ -1,7 +1,11 @@
 @import "../colors";
 
+.window-content.dashboardmenu-window {
+    margin-left: 0.50em;
+}
+
 .dashboard-content-items {
-    min-width: 26.5em;
+    min-width: 28.5em;
     background: $crust;
     border: 0.13em solid $surface0;
     border-radius: 0.7em;
@@ -234,7 +238,7 @@
             }
 
             &:hover {
-                color: $green;
+                opacity: 0.5;
             }
         }
     }

style.css

@@ -1242,7 +1242,7 @@ window#powermenu .powermenu.box {
 }
 
 .clock-content-items {
-  min-height: 6em;
+  min-height: 8em;
 }
 .clock-content-items .clock-content-time {
   font-size: 4em;
@@ -1250,7 +1250,7 @@ window#powermenu .powermenu.box {
 }
 .clock-content-items .clock-content-period {
   font-size: 1.75em;
-  margin-bottom: 0.7em;
+  margin-bottom: 1.3em;
   margin-right: -0.875em;
   color: #94e2d5;
 }
@@ -1373,8 +1373,12 @@ window#powermenu .powermenu.box {
   margin-bottom: 0.2em;
 }
 
+.window-content.dashboardmenu-window {
+  margin-left: 0.5em;
+}
+
 .dashboard-content-items {
-  min-width: 26.5em;
+  min-width: 28.5em;
   background: #11111b;
   border: 0.13em solid #313244;
   border-radius: 0.7em;
@@ -1574,7 +1578,7 @@ window#powermenu .powermenu.box {
   color: #eba0ac;
 }
 .dashboard-content-items .directories-container .directory-link:hover {
-  color: #a6e3a1;
+  opacity: 0.5;
 }
 .dashboard-content-items .stats-container {
   margin-top: 0em;