updating how the configs config

.config/ags/config.js

@@ -6,16 +6,42 @@ const audio = await Service.import('audio')
 
 import { NotificationPopups } from "./notifications.js"
 
+function map_workspaces(id) {
+    switch (id) {
+    case 1:
+        return Widget.Label("");
+        break;
+    case 2:
+        return Widget.Label("");
+        break;
+    case 3:
+        return Widget.Label("󰈙");
+        break;
+    case 4:
+        return Widget.Label("󰍨");
+        break;
+    case 5:
+        return Widget.Label("");
+        break;
+    case 9:
+        return Widget.Label("");
+        break;
+    default: 
+        return Widget.Label(`${id}`);
+    }
+}
+
 function workspaces() {
     const active = hyprland.active.workspace.bind("id");
     const workspaces = hyprland.bind("workspaces")
           .as(ws => ws.map(({ id }) => id === -99 ? "" : Widget.Button({
               onClicked: () => hyprland.messageAsync(`dispatch workspace ${id}`),
-              child: Widget.Label(`${id}`),
+              child: map_workspaces(id),
               class_name: active.as(i => `${i === id ? "focused" : ""}`),
           })))
     return Widget.Box({
         class_name: "workspaces",
+        spacing: 6,
         children: workspaces,
     })
 }

.config/ags/notifications.js

@@ -14,6 +14,8 @@ function NotificationIcon({ app_entry, app_icon, image }) {
     let icon = "dialog-information-symbolic"
     if (Utils.lookUpIcon(app_icon))
         icon = app_icon
+    else
+        icon = "auth-fingerprint-symbolic"
 
     if (app_entry && Utils.lookUpIcon(app_entry))
         icon = app_entry
@@ -75,6 +77,7 @@ function Notification(n) {
             {
                 class_name: `notification ${n.urgency}`,
                 vertical: true,
+                spacing: 0,
             },
             Widget.Box([
                 icon,
@@ -92,6 +95,7 @@ function Notification(n) {
 export function NotificationPopups(monitor = 0) {
     const list = Widget.Box({
         vertical: true,
+        spacing: 4,
         children: notifications.popups.map(Notification),
     })
 
@@ -114,7 +118,7 @@ export function NotificationPopups(monitor = 0) {
         class_name: "notification-popups",
         anchor: ["bottom", "right"],
         child: Widget.Box({
-            css: "min-width: 2px; min-height: 2px;",
+            // css: "min-width: 2px; min-height: 2px;",
             class_name: "notifications",
             vertical: true,
             child: list,

.config/ags/style.css

@@ -124,7 +124,7 @@ window.notification-popups box.notifications {
     min-width: 100px;
     border-radius: 20px;
     padding: 1em;
-    margin: 1em;
+    /* margin: 1em; */
     background-color: @backtransparent;
 }
 
@@ -135,16 +135,15 @@ window.notification-popups box.notifications {
 }
 
 .notif-icon image {
-    font-size: 28px;
+    font-size: 22px;
     /* to center the icon */
-    margin: 5px;
+    /* margin: 5px; */
     color: @base0C;
 }
 
 .notif-icon box {
     min-width: 38px;
     min-height: 38px;
-    border-radius: 7px;
 }
 
 .notif-title {
@@ -158,8 +157,8 @@ window.notification-popups box.notifications {
 }
 
 .notif-actions .notif-action-button {
-    margin: 0 .4em;
-    margin-top: .8em;
+    /* margin: 0 .4em; */
+    /* margin-top: .8em; */
 }
 
 .notif-actions .notif-action-button:first-child {