Added bluetooth menu.

modules/bar/bluetooth/index.js

@@ -17,6 +17,16 @@ const Bluetooth = () => {
       children: [btIcon, btText],
     }),
     isVisible: true,
+    props: {
+      on_primary_click: (_, event) => {
+        const clickPos = event.get_root_coords();
+        const coords = [clickPos[1], clickPos[2]];
+
+        globalMousePos.value = coords;
+
+        App.toggleWindow("bluetoothmenu");
+      },
+    },
   };
 
 }

modules/bar/network/index.js

@@ -1,5 +1,7 @@
 const network = await Service.import("network");
 
+import { globalMousePos } from "../../../globals.js";
+
 const Network = () => {
   const wifiIndicator = [
     Widget.Icon({
@@ -26,6 +28,17 @@ const Network = () => {
         .as((w) => (w === "wired" ? wiredIndicator : wifiIndicator)),
     }),
     isVisible: true,
+    props: {
+      on_primary_click: (_, event) => {
+        console.log(JSON.stringify(network, null, 2));
+        const clickPos = event.get_root_coords();
+        const coords = [clickPos[1], clickPos[2]];
+
+        globalMousePos.value = coords;
+
+        App.toggleWindow("networkmenu");
+      },
+    },
   };
 };
 

modules/bar/volume/index.js

@@ -1,4 +1,3 @@
-const hyprland = await Service.import("hyprland");
 const audio = await Service.import("audio");
 
 import { globalMousePos } from "../../../globals.js";
@@ -39,14 +38,12 @@ const Volume = () => {
     }),
     isVisible: true,
     props: {
-    on_primary_click: (a, b, c, d) => {
+      on_primary_click: (_, event) => {
-      const monX = hyprland.monitors[hyprland.active.monitor.id].x;
+        const clickPos = event.get_root_coords();
-      const monY = hyprland.monitors[hyprland.active.monitor.id].y;
+        const coords = [clickPos[1], clickPos[2]];
+
+        globalMousePos.value = coords;
 
-      const cursorPos = Utils.exec("hyprctl cursorpos").split(", ").map(Number);
-      cursorPos[0] = cursorPos[0] - monX;
-      cursorPos[1] = cursorPos[1] - monY;
-      globalMousePos.value = cursorPos;
         App.toggleWindow("audiomenu");
       },
     },

modules/menus/DropdownMenu.js

@@ -10,14 +10,9 @@ export const Padding = (name) =>
   });
 
 const moveBoxToCursor = (self, minWidth, minHeight, child) => {
-  function getAllMethods(object) {
-    return Object.getOwnPropertyNames(object).filter(function (property) {
-      return typeof object[property] == "function";
-    });
-  }
   globalMousePos.connect("changed", ({ value }) => {
-    console.log(child.get_allocated_height());
+    // console.log(child.get_allocated_height());
-    console.log(child.get_allocated_width());
+    // console.log(child.get_allocated_width());
     let monWidth = hyprland.monitors[hyprland.active.monitor.id].width;
     let monHeight = hyprland.monitors[hyprland.active.monitor.id].height;
 
@@ -50,7 +45,7 @@ export default ({
   child,
   layout = "center",
   transition,
-  minWidth = 400,
+  minWidth = 375,
   minHeight = 200,
   exclusivity = "ignore",
   ...props
@@ -66,10 +61,14 @@ export default ({
     anchor: ["top", "bottom", "right", "left"],
     child: Widget.EventBox({
       on_primary_click: () => App.closeWindow(name),
+      on_secondary_click: () => App.closeWindow(name),
       child: Widget.EventBox({
         on_primary_click: () => {
           return true;
         },
+        on_secondary_click: () => {
+          return true;
+        },
         setup: (self) => {
           moveBoxToCursor(self, minWidth, minHeight, child);
         },

modules/menus/audio/index.js

@@ -2,23 +2,15 @@ const audio = await Service.import("audio");
 import DropdownMenu from "../DropdownMenu.js";
 
 export default () => {
-  const playbackDevices = Variable(audio.speakers);
-  const inputDevices = Variable(audio.microphones);
-
-  audio.connect("changed", (aVal) => {
-    playbackDevices.value = aVal.speakers;
-    inputDevices.value = aVal.microphones;
-  });
-
   const renderPlaybacks = (playbackDevices) => {
     return playbackDevices.map((device) => {
       if (device.description === "Dummy Output") {
         return Widget.Box({
-          class_name: `audiomenu-playback-button not-found`,
+          class_name: "menu-unfound-button playback",
           child: Widget.Box({
             children: [
               Widget.Label({
-                class_name: "audiomenu-playback-button-icon",
+                class_name: "menu-button-name playback",
                 label: "No playback devices found...",
               }),
             ],
@@ -26,25 +18,51 @@ export default () => {
         });
       }
       return Widget.Button({
-        class_name: `audiomenu-button playback ${device}`,
+        class_name: `menu-button audio playback ${device}`,
+        cursor: "pointer",
+        on_primary_click: () => (audio.speaker = device),
         child: Widget.Box({
+          children: [
+            Widget.Box({
+              hpack: "start",
               children: [
                 Widget.Label({
-              class_name: "audiomenu-button-icon playback",
+                  truncate: "end",
-              label: "o",
+                  wrap: true,
+                  class_name: audio.speaker
+                    .bind("description")
+                    .as((v) =>
+                      device.description === v
+                        ? "menu-button-icon active playback"
+                        : "menu-button-icon playback",
+                    ),
+                  label: "",
                 }),
                 Widget.Label({
-              class_name: "audiomenu-button-name playback",
+                  class_name: audio.speaker
+                    .bind("description")
+                    .as((v) =>
+                      device.description === v
+                        ? "menu-button-name active playback"
+                        : "menu-button-name playback",
+                    ),
                   truncate: "end",
-              expand: true,
                   wrap: true,
                   label: device.description,
                 }),
+              ],
+            }),
+            Widget.Box({
+              hpack: "end",
+              expand: true,
+              children: [
                 Widget.Label({
-              class_name: "audiomenu-button-isactive playback",
+                  class_name: "menu-button-isactive audio playback",
                   label: audio.speaker
                     .bind("description")
-                .as((v) => (device.description === v ? " y" : "")),
+                    .as((v) => (device.description === v ? " " : "")),
+                }),
+              ],
             }),
           ],
         }),
@@ -56,11 +74,11 @@ export default () => {
     if (!inputDevices.length) {
       return [
         Widget.Box({
-          class_name: `audiomenu-inputs-button not-found`,
+          class_name: `menu-unfound-button input`,
           child: Widget.Box({
             children: [
               Widget.Label({
-                class_name: "audiomenu-inputs-button-icon",
+                class_name: "menu-button-name input",
                 label: "No input devices found...",
               }),
             ],
@@ -70,25 +88,51 @@ export default () => {
     }
     return inputDevices.map((device) => {
       return Widget.Button({
-        class_name: `audiomenu-button input ${device}`,
+        cursor: "pointer",
+        on_primary_click: () => (audio.microphone = device),
+        class_name: `menu-button audio input ${device}`,
         child: Widget.Box({
+          children: [
+            Widget.Box({
+              hpack: "start",
               children: [
                 Widget.Label({
-              class_name: "audiomenu-button-icon input",
+                  class_name: audio.microphone
-              label: "/",
+                    .bind("description")
+                    .as((v) =>
+                      device.description === v
+                        ? "menu-button-icon active input"
+                        : "menu-button-icon input",
+                    ),
+                  label: "",
                 }),
                 Widget.Label({
-              class_name: "audiomenu-button-name input",
+                  truncate: "end",
+                  wrap: true,
+                  class_name: audio.microphone
+                    .bind("description")
+                    .as((v) =>
+                      device.description === v
+                        ? "menu-button-name active input"
+                        : "menu-button-name input",
+                    ),
                   label: device.description,
                 }),
-            Widget.Label({
+              ],
-              class_name: "audiomenu-button-isactive input",
+            }),
-              truncate: "end",
+            Widget.Box({
+              hpack: "end",
               expand: true,
+              children: [
+                Widget.Label({
+                  class_name: "menu-button-isactive audio input",
+                  truncate: "end",
                   wrap: true,
                   label: audio.microphone
                     .bind("description")
-                .as((v) => (device.description === v ? " y" : "")),
+                    .as((v) => (device.description === v ? " " : "")),
+                }),
+              ],
             }),
           ],
         }),
@@ -99,32 +143,32 @@ export default () => {
   const renderActivePlayback = () => {
     return [
       Widget.Label({
-        class_name: "audiomenu-active playback",
+        class_name: "menu-active playback",
         truncate: "end",
         expand: true,
         wrap: true,
         label: audio.bind("speaker").as((v) => v.description || ""),
       }),
       Widget.Box({
-        class_name: "audiomenu-slider-container playback",
+        class_name: "menu-slider-container playback",
         children: [
           Widget.Label({
-            class_name: "audiomenu-active-icon playback",
+            class_name: "menu-active-icon playback",
             label: audio.speaker
               .bind("volume")
-              .as((v) => `${v === 0 ? "m" : "a"}`),
+              .as((v) => `${v === 0 ? "󰖁" : "󰕾"}`),
           }),
           Widget.Slider({
-            value: audio.speaker.bind("volume").as((v) => v * 100),
+            value: audio["speaker"].bind("volume"),
-            class_name: "audiomenu-active-slider playback",
+            class_name: "menu-active-slider menu-slider playback",
             draw_value: false,
             hexpand: true,
             min: 0,
-            max: 100,
+            max: 1,
-            onChange: ({ value }) => (audio.speaker.volume = value / 100),
+            onChange: ({ value }) => (audio.speaker.volume = value),
           }),
           Widget.Label({
-            class_name: "audiomenu-active-percentage playback",
+            class_name: "menu-active-percentage playback",
             label: audio.speaker
               .bind("volume")
               .as((v) => `${Math.floor(v * 100)}%`),
@@ -137,31 +181,31 @@ export default () => {
   const renderActiveInput = () => {
     return [
       Widget.Label({
-        class_name: "audiomenu-active input",
+        class_name: "menu-active input",
         truncate: "end",
         wrap: true,
         label: audio.bind("microphone").as((v) => v.description || ""),
       }),
       Widget.Box({
-        class_name: "audiomenu-slider-container input",
+        class_name: "menu-slider-container input",
         children: [
           Widget.Label({
-            class_name: "audiomenu-active-icon input",
+            class_name: "menu-active-icon input",
             label: audio.microphone
               .bind("volume")
-              .as((v) => `${v === 0 ? "m" : "a"}`),
+              .as((v) => `${v === 0 ? "󰍭" : "󰍬"}`),
           }),
           Widget.Slider({
-            value: audio.microphone.bind("volume").as((v) => v * 100),
+            value: audio.microphone.bind("volume").as((v) => v),
-            class_name: "audiomenu-active-slider inputs",
+            class_name: "menu-active-slider menu-slider inputs",
             draw_value: false,
             hexpand: true,
             min: 0,
-            max: 100,
+            max: 1,
-            onChange: ({ value }) => (audio.microphone.volume = value / 100),
+            onChange: ({ value }) => (audio.microphone.volume = value),
           }),
           Widget.Label({
-            class_name: "audiomenu-active-percentage input",
+            class_name: "menu-active-percentage input",
             label: audio.microphone
               .bind("volume")
               .as((v) => `${Math.floor(v * 100)}%`),
@@ -175,62 +219,70 @@ export default () => {
     name: "audiomenu",
     transition: "crossfade",
     child: Widget.Box({
-      class_name: "audiomenu-items",
+      class_name: "menu-items",
       child: Widget.Box({
         vertical: true,
-        class_name: "audiomenu-items-container",
+        class_name: "menu-items-container",
         children: [
           Widget.Box({
-            class_name: "audiomenu-dropdown-label-container",
+            class_name: "menu-dropdown-label-container",
             hpack: "start",
             children: [
               Widget.Label({
-                class_name: "audiomenu-dropdown-label",
+                class_name: "menu-dropdown-label audio",
-                label: "Audio Devices",
+                label: "Audio",
               }),
             ],
           }),
           Widget.Separator({
-            class_name: "audiomenu-separator",
+            class_name: "menu-separator",
           }),
           Widget.Box({
-            class_name: "audiomenu-active-container playback",
+            class_name: "menu-active-container playback",
             vertical: true,
             children: renderActivePlayback(),
           }),
           Widget.Box({
-            class_name: "audiomenu-active-container input",
+            class_name: "menu-active-container input",
             vertical: true,
             children: renderActiveInput(),
           }),
+          Widget.Separator({
+            class_name: "menu-separator",
+          }),
           Widget.Box({
-            class_name: "audiomenu-label-container playback",
+            class_name: "menu-container playback",
             vertical: true,
-            hpack: "start",
             children: [
-              Widget.Label({
+              Widget.Box({
-                class_name: "audiomenu-label playback",
+                class_name: "menu-label-container",
+                child: Widget.Label({
+                  class_name: "menu-label audio playback",
                   label: "Playback Devices",
                   hpack: "start",
                 }),
+              }),
               Widget.Box({
                 vertical: true,
-                children: audio
+                children: audio.bind("speakers").as((v) => renderPlaybacks(v)),
-                  .bind("speakers")
-                  .as((v) => renderPlaybacks(v)),
               }),
             ],
           }),
+          Widget.Separator({
+            class_name: "menu-separator",
+          }),
           Widget.Box({
-            class_name: "audiomenu-label-container input",
+            class_name: "menu-container input",
-            hpack: "start",
             vertical: true,
             children: [
-              Widget.Label({
+              Widget.Box({
-                class_name: "audiomenu-label input",
+                class_name: "menu-label-container",
+                child: Widget.Label({
+                  class_name: "menu-label audio input",
                   hpack: "start",
                   label: "Input Devices",
                 }),
+              }),
               Widget.Box({
                 vertical: true,
                 children: audio

modules/menus/bluetooth/index.js

@@ -0,0 +1,384 @@
+const bluetooth = await Service.import("bluetooth");
+import DropdownMenu from "../DropdownMenu.js";
+
+export default () => {
+  bluetooth.connect("changed", (value) => {
+    // console.log(JSON.stringify(value, null, 2));
+  });
+
+  const connectedDevices = (btDevices) => {
+    const noDevices = () => {
+      return Widget.Box({
+        hpack: "start",
+        hexpand: true,
+        child: Widget.Label({
+          class_name: "dim",
+          label: "No devices connected",
+        }),
+      });
+    };
+
+    const deviceList = () => {
+      return Widget.Box({
+        vertical: true,
+        children: btDevices.map((dev) =>
+          Widget.Box({
+            child: Widget.Box({
+              children: [
+                Widget.Box({
+                  hpack: "start",
+                  vertical: true,
+                  children: [
+                    Widget.Box({
+                      children: [
+                        Widget.Button({
+                          child: Widget.Icon(`${dev["icon-name"]}-symbolic`),
+                        }),
+                        Widget.Label({
+                          class_name: "menu-button-name bluetooth",
+                          truncate: "end",
+                          wrap: true,
+                          label: dev.alias,
+                        }),
+                      ],
+                    }),
+                    Widget.Box({
+                      class_name: "menu-button-name-container status dim",
+                      children: [
+                        Widget.Label({
+                          class_name: "menu-button-name status dim",
+                          label: dev.connected
+                            ? "Connected"
+                            : dev.paired
+                              ? "Paired"
+                              : "",
+                        }),
+                      ],
+                    }),
+                  ],
+                }),
+                Widget.Box({
+                  hpack: "end",
+                  expand: true,
+                  children: [
+                    Widget.Button({
+                      class_name: "menu-icon-button unpair bluetooth",
+                      child: Widget.Label({
+                        tooltip_text: dev.paired ? "unpair" : "pair",
+                        class_name: "menu-icon-button-label unpair bluetooth",
+                        label: dev.paired ? "" : "",
+                      }),
+                      on_primary_click: () =>
+                        Utils.execAsync(
+                          `bluetoothctl ${dev.paired ? "unpair" : "pair"} ${dev.address}`,
+                        ).catch((err) =>
+                          console.error(
+                            `bluetoothctl ${dev.paired ? "unpair" : "pair"} ${dev.address}`,
+                            err,
+                          ),
+                        ),
+                    }),
+                    Widget.Button({
+                      class_name: "menu-icon-button disconnect bluetooth",
+                      child: Widget.Label({
+                        tooltip_text: dev.connected ? "disconnect" : "connect",
+                        class_name:
+                          "menu-icon-button-label disconnect bluetooth",
+                        label: dev.connected ? "󱘖" : "",
+                      }),
+                      on_primary_click: () =>
+                        Utils.execAsync(
+                          `bluetoothctl ${dev.connected ? "disconnect" : "connect"} ${dev.address}`,
+                        ).catch((err) =>
+                          console.error(
+                            `bluetoothctl ${dev.connected ? "disconnect" : "connect"} ${dev.address}`,
+                            err,
+                          ),
+                        ),
+                    }),
+                    Widget.Button({
+                      class_name: "menu-icon-button untrust bluetooth",
+                      child: Widget.Label({
+                        tooltip_text: dev.trusted ? "untrust" : "trust",
+                        class_name: "menu-icon-button-label untrust bluetooth",
+                        label: dev.trusted ? "" : "󱖡",
+                      }),
+                      on_primary_click: () =>
+                        Utils.execAsync(
+                          `bluetoothctl ${dev.trusted ? "untrust" : "trust"} ${dev.address}`,
+                        ).catch((err) =>
+                          console.error(
+                            `bluetoothctl ${dev.trusted ? "untrust" : "trust"} ${dev.address}`,
+                            err,
+                          ),
+                        ),
+                    }),
+                    Widget.Button({
+                      class_name: "menu-icon-button delete bluetooth",
+                      child: Widget.Label({
+                        tooltip_text: "delete",
+                        class_name: "menu-icon-button-label delete bluetooth",
+                        label: "󰆴",
+                      }),
+                      on_primary_click: () =>
+                        Utils.execAsync(
+                          `bluetoothctl remove ${dev.address}`,
+                        ).catch((err) =>
+                          console.error("Bluetooth Remove", err),
+                        ),
+                    }),
+                  ],
+                }),
+              ],
+            }),
+          }),
+        ),
+      });
+    };
+
+    return btDevices.length === 0 ? noDevices() : deviceList();
+  };
+
+  const renderDevices = (btDevices) => {
+    return btDevices
+      .filter(
+        (device) =>
+          device.name !== null &&
+          !bluetooth.connected_devices.find(
+            (dev) => dev.address === device.address,
+          ),
+      )
+      .map((device) => {
+        return Widget.Button({
+          class_name: `menu-button bluetooth ${device}`,
+          on_primary_click: () => {
+            Utils.execAsync(`bluetoothctl connect ${device.address}`).catch(
+              (err) =>
+                console.error(`bluetoothctl connect ${device.address}`, err),
+            );
+            Utils.execAsync(`bluetoothctl pair ${device.address}`).catch(
+              (err) =>
+                console.error(`bluetoothctl pair ${device.address}`, err),
+            );
+          },
+          child: Widget.Box({
+            children: [
+              Widget.Box({
+                hpack: "start",
+                children: [
+                  Widget.Icon({
+                    class_name: bluetooth
+                      .bind("connected_devices")
+                      .as((btDevices) =>
+                        btDevices.find((cd) => cd.alias === device.alias)
+                          ? "menu-button-icon active bluetooth"
+                          : "menu-button-icon bluetooth",
+                      ),
+                    icon: `${device["icon-name"]}-symbolic`,
+                  }),
+                  Widget.Label({
+                    class_name: bluetooth
+                      .bind("connected_devices")
+                      .as((btDevices) =>
+                        btDevices.find((cd) => cd.alias === device.alias)
+                          ? "menu-button-name active bluetooth"
+                          : "menu-button-name bluetooth",
+                      ),
+                    truncate: "end",
+                    wrap: true,
+                    label: device.alias,
+                  }),
+                ],
+              }),
+              Widget.Box({
+                hpack: "end",
+                expand: true,
+                children: [
+                  Widget.Label({
+                    class_name: "menu-button-isactive bluetooth",
+                    label: bluetooth
+                      .bind("connected_devices")
+                      .as((btDevices) =>
+                        btDevices.find((cd) => cd.alias === device.alias)
+                          ? " "
+                          : "",
+                      ),
+                  }),
+                ],
+              }),
+            ],
+          }),
+        });
+      });
+  };
+
+  const bluetoothOnModule = () => {
+    return Widget.Box({
+      vertical: true,
+      children: [
+        Widget.Box({
+          class_name: "menu-active-container bluetooth",
+          vertical: true,
+          // children: renderActivePlayback(),
+        }),
+        Widget.Box({
+          class_name: "menu-active-container bluetooth",
+          vertical: true,
+          // children: renderActiveInput(),
+        }),
+        Widget.Separator({
+          class_name: "menu-separator",
+        }),
+        Widget.Box({
+          class_name: "menu-container bluetooth",
+          children: [
+            Widget.Box({
+              vertical: true,
+              children: [
+                Widget.Box({
+                  class_name: "menu-label-container bluetooth",
+                  children: [
+                    Widget.Box({
+                      hpack: "start",
+                      child: Widget.Label({
+                        class_name: "menu-label bluetooth",
+                        label: "Devices",
+                      }),
+                    }),
+                    Widget.Box({
+                      hexpand: true,
+                      hpack: "end",
+                      child: Widget.Button({
+                        class_name: "menu-icon-button",
+                        on_primary_click: () =>
+                          Utils.execAsync(
+                            "bluetoothctl --timeout 120 scan on",
+                          ).catch((err) =>
+                            console.error(
+                              "bluetoothctl --timeout 120 scan on",
+                              err,
+                            ),
+                          ),
+                        child: Widget.Icon("view-refresh-symbolic"),
+                      }),
+                    }),
+                  ],
+                }),
+                Widget.Box({
+                  vertical: true,
+                  children: bluetooth
+                    .bind("devices")
+                    .as((v) => renderDevices(v)),
+                }),
+              ],
+            }),
+          ],
+        }),
+      ],
+    });
+  };
+
+  const bluetoothOffModule = () => {
+    return Widget.Box({
+      class_name: "bluetooth-disabled-menu",
+      vertical: true,
+      children: [
+        Widget.Label({
+          hexpand: true,
+          vexpand: true,
+          label: bluetooth
+            .bind("state")
+            .as((state) =>
+              state === "turning-off"
+                ? "Bluetooth is turning off..."
+                : "Bluetooth is disabled",
+            ),
+        }),
+      ],
+    });
+  };
+  return DropdownMenu({
+    name: "bluetoothmenu",
+    transition: "crossfade",
+    minWidth: 325,
+    child: Widget.Box({
+      class_name: "menu-items",
+      child: Widget.Box({
+        vertical: true,
+        class_name: "menu-items-container",
+        children: [
+          Widget.Box({
+            class_name: "menu-dropdown-label-container",
+            children: [
+              Widget.Box({
+                hexpand: true,
+                hpack: "start",
+                child: Widget.Label({
+                  class_name: "menu-dropdown-label bluetooth",
+                  label: "Bluetooth",
+                }),
+              }),
+              Widget.Box({
+                hexpand: true,
+                hpack: "end",
+                child: Widget.Switch({
+                  class_name: "menu-switch bluetooth",
+                  active: bluetooth.enabled,
+                  setup: (self) => {
+                    bluetooth.connect("changed", ({ enabled }) => {
+                      self.set_property("active", enabled);
+                    });
+                  },
+                  on_activate: ({ active }) =>
+                    Utils.execAsync(
+                      `bluetoothctl power ${active ? "on" : "off"}`,
+                    ).catch((err) =>
+                      console.error(
+                        `bluetoothctl power ${active ? "on" : "off"}`,
+                        err,
+                      ),
+                    ),
+                }),
+              }),
+            ],
+          }),
+          Widget.Separator({
+            class_name: "menu-separator",
+          }),
+          Widget.Box({
+            vertical: true,
+            children: bluetooth.bind("enabled").as((isOn) =>
+              isOn
+                ? [
+                    Widget.Box({
+                      class_name: "menu-label-container",
+                      child: Widget.Label({
+                        class_name: "menu-label bluetooth",
+                        hpack: "start",
+                        label: "My Devices",
+                      }),
+                    }),
+                    Widget.Box({
+                      vertical: true,
+                      class_name: "menu-item-box",
+                      child: bluetooth
+                        .bind("connected_devices")
+                        .as((btConDevs) => connectedDevices(btConDevs)),
+                    }),
+                  ]
+                : [],
+            ),
+          }),
+          Widget.Box({
+            vertical: true,
+            child: bluetooth
+              .bind("enabled")
+              .as((btEnabled) =>
+                btEnabled ? bluetoothOnModule() : bluetoothOffModule(),
+              ),
+          }),
+        ],
+      }),
+    }),
+  });
+};

modules/menus/main.js

@@ -1,5 +1,7 @@
 import PowerMenu from "./power/index.js";
 import Verification from "./power/verification.js";
 import AudioMenu from "./audio/index.js";
+import NetworkMenu from "./network/index.js";
+import BluetoothMenu from "./bluetooth/index.js";
 
-export default [PowerMenu(), Verification(), AudioMenu()];
+export default [PowerMenu(), Verification(), AudioMenu(), NetworkMenu(), BluetoothMenu()];

modules/menus/network/index.js

@@ -0,0 +1,295 @@
+const network = await Service.import("network");
+import DropdownMenu from "../DropdownMenu.js";
+
+export default () => {
+  network.connect("changed", (value) => {
+    console.log(JSON.stringify(value, null, 2));
+  })
+  const renderPlaybacks = (playbackDevices) => {
+    // return playbackDevices.map((device) => {
+    //   if (device.description === "Dummy Output") {
+    //     return Widget.Box({
+    //       class_name: "networkmenu-unfound-button playback",
+    //       child: Widget.Box({
+    //         children: [
+    //           Widget.Label({
+    //             class_name: "networkmenu-button-name playback",
+    //             label: "No playback devices found...",
+    //           }),
+    //         ],
+    //       }),
+    //     });
+    //   }
+    //   return Widget.Button({
+    //     class_name: `networkmenu-button playback ${device}`,
+    //     cursor: "pointer",
+    //     on_primary_click: () => (audio.speaker = device),
+    //     child: Widget.Box({
+    //       children: [
+    //         Widget.Box({
+    //           hpack: "start",
+    //           children: [
+    //             Widget.Label({
+    //               truncate: "end",
+    //               wrap: true,
+    //               class_name: audio.speaker
+    //                 .bind("description")
+    //                 .as((v) =>
+    //                   device.description === v
+    //                     ? "networkmenu-button-icon active playback"
+    //                     : "networkmenu-button-icon playback",
+    //                 ),
+    //               label: "",
+    //             }),
+    //             Widget.Label({
+    //               class_name: audio.speaker
+    //                 .bind("description")
+    //                 .as((v) =>
+    //                   device.description === v
+    //                     ? "networkmenu-button-name active playback"
+    //                     : "networkmenu-button-name playback",
+    //                 ),
+    //               truncate: "end",
+    //               wrap: true,
+    //               label: device.description,
+    //             }),
+    //           ],
+    //         }),
+    //         Widget.Box({
+    //           hpack: "end",
+    //           expand: true,
+    //           children: [
+    //             Widget.Label({
+    //               class_name: "networkmenu-button-isactive playback",
+    //               label: audio.speaker
+    //                 .bind("description")
+    //                 .as((v) => (device.description === v ? " " : "")),
+    //             }),
+    //           ],
+    //         }),
+    //       ],
+    //     }),
+    //   });
+    // });
+  };
+
+  const renderInputDevices = (inputDevices) => {
+    // if (!inputDevices.length) {
+    //   return [
+    //     Widget.Box({
+    //       class_name: `networkmenu-unfound-button input`,
+    //       child: Widget.Box({
+    //         children: [
+    //           Widget.Label({
+    //             class_name: "networkmenu-button-name input",
+    //             label: "No input devices found...",
+    //           }),
+    //         ],
+    //       }),
+    //     }),
+    //   ];
+    // }
+    // return inputDevices.map((device) => {
+    //   return Widget.Button({
+    //     cursor: "pointer",
+    //     on_primary_click: () => (audio.microphone = device),
+    //     class_name: `networkmenu-button input ${device}`,
+    //     child: Widget.Box({
+    //       children: [
+    //         Widget.Box({
+    //           hpack: "start",
+    //           children: [
+    //             Widget.Label({
+    //               class_name: audio.microphone
+    //                 .bind("description")
+    //                 .as((v) =>
+    //                   device.description === v
+    //                     ? "networkmenu-button-icon active input"
+    //                     : "networkmenu-button-icon input",
+    //                 ),
+    //               label: "",
+    //             }),
+    //             Widget.Label({
+    //               truncate: "end",
+    //               wrap: true,
+    //               class_name: audio.microphone
+    //                 .bind("description")
+    //                 .as((v) =>
+    //                   device.description === v
+    //                     ? "networkmenu-button-name active input"
+    //                     : "networkmenu-button-name input",
+    //                 ),
+    //               label: device.description,
+    //             }),
+    //           ],
+    //         }),
+    //         Widget.Box({
+    //           hpack: "end",
+    //           expand: true,
+    //           children: [
+    //             Widget.Label({
+    //               class_name: "networkmenu-button-isactive input",
+    //               truncate: "end",
+    //               wrap: true,
+    //               label: audio.microphone
+    //                 .bind("description")
+    //                 .as((v) => (device.description === v ? " " : "")),
+    //             }),
+    //           ],
+    //         }),
+    //       ],
+    //     }),
+    //   });
+    // });
+  };
+
+  const renderActivePlayback = () => {
+    // return [
+    //   Widget.Label({
+    //     class_name: "networkmenu-active playback",
+    //     truncate: "end",
+    //     expand: true,
+    //     wrap: true,
+    //     label: audio.bind("speaker").as((v) => v.description || ""),
+    //   }),
+    //   Widget.Box({
+    //     class_name: "networkmenu-slider-container playback",
+    //     children: [
+    //       Widget.Label({
+    //         class_name: "networkmenu-active-icon playback",
+    //         label: audio.speaker
+    //           .bind("volume")
+    //           .as((v) => `${v === 0 ? "󰖁" : "󰕾"}`),
+    //       }),
+    //       Widget.Slider({
+    //         value: audio["speaker"].bind("volume"),
+    //         class_name: "networkmenu-active-slider menu-slider playback",
+    //         draw_value: false,
+    //         hexpand: true,
+    //         min: 0,
+    //         max: 1,
+    //         onChange: ({ value }) => (audio.speaker.volume = value),
+    //       }),
+    //       Widget.Label({
+    //         class_name: "networkmenu-active-percentage playback",
+    //         label: audio.speaker
+    //           .bind("volume")
+    //           .as((v) => `${Math.floor(v * 100)}%`),
+    //       }),
+    //     ],
+    //   }),
+    // ];
+  };
+
+  const renderActiveInput = () => {
+    // return [
+    //   Widget.Label({
+    //     class_name: "networkmenu-active input",
+    //     truncate: "end",
+    //     wrap: true,
+    //     label: audio.bind("microphone").as((v) => v.description || ""),
+    //   }),
+    //   Widget.Box({
+    //     class_name: "networkmenu-slider-container input",
+    //     children: [
+    //       Widget.Label({
+    //         class_name: "networkmenu-active-icon input",
+    //         label: audio.microphone
+    //           .bind("volume")
+    //           .as((v) => `${v === 0 ? "󰍭" : "󰍬"}`),
+    //       }),
+    //       Widget.Slider({
+    //         value: audio.microphone.bind("volume").as((v) => v),
+    //         class_name: "networkmenu-active-slider menu-slider inputs",
+    //         draw_value: false,
+    //         hexpand: true,
+    //         min: 0,
+    //         max: 1,
+    //         onChange: ({ value }) => (audio.microphone.volume = value),
+    //       }),
+    //       Widget.Label({
+    //         class_name: "networkmenu-active-percentage input",
+    //         label: audio.microphone
+    //           .bind("volume")
+    //           .as((v) => `${Math.floor(v * 100)}%`),
+    //       }),
+    //     ],
+    //   }),
+    // ];
+  };
+
+  return DropdownMenu({
+    name: "networkmenu",
+    transition: "crossfade",
+    child: Widget.Box({
+      class_name: "menu-items",
+      child: Widget.Box({
+        vertical: true,
+        class_name: "menu-items-container",
+        children: [
+          Widget.Box({
+            class_name: "menu-dropdown-label-container",
+            hpack: "start",
+            children: [
+              Widget.Label({
+                class_name: "menu-dropdown-label audio",
+                label: "Network",
+              }),
+            ],
+          }),
+          Widget.Separator({
+            class_name: "menu-separator",
+          }),
+          Widget.Box({
+            class_name: "networkmenu-active-container playback",
+            vertical: true,
+            // children: renderActivePlayback(),
+          }),
+          Widget.Box({
+            class_name: "networkmenu-active-container input",
+            vertical: true,
+            // children: renderActiveInput(),
+          }),
+          Widget.Separator({
+            class_name: "menu-separator",
+          }),
+          Widget.Box({
+            class_name: "networkmenu-label-container playback",
+            vertical: true,
+            children: [
+              Widget.Label({
+                class_name: "networkmenu-label playback",
+                label: "Playback Devices",
+                hpack: "start",
+              }),
+              // Widget.Box({
+              //   vertical: true,
+              //   children: audio.bind("speakers").as((v) => renderPlaybacks(v)),
+              // }),
+            ],
+          }),
+          Widget.Separator({
+            class_name: "menu-separator",
+          }),
+          Widget.Box({
+            class_name: "networkmenu-label-container input",
+            vertical: true,
+            children: [
+              Widget.Label({
+                class_name: "networkmenu-label input",
+                hpack: "start",
+                label: "Input Devices",
+              }),
+              // Widget.Box({
+              //   vertical: true,
+              //   children: audio
+              //     .bind("microphones")
+              //     .as((v) => renderInputDevices(v)),
+              // }),
+            ],
+          }),
+        ],
+      }),
+    }),
+  });
+};

scss/bar/bar.scss

@@ -11,6 +11,10 @@
   border-radius: 8px;
   padding: 2px 12px;
   margin: 6px 3px;
+
+  &:hover {
+    background: $surface1;
+  }
 }
 
 .bar_item_box_hidden {

scss/bar/bluetooth.scss

@@ -8,3 +8,14 @@
 .bar-bt_label {
   color: $sky;
 }
+
+.bluetooth-disabled-menu {
+  font-weight: bold;
+  font-size: 1.1rem;
+  color: $surface2;
+  margin: 6rem 0rem;
+}
+
+.menu-button-isactive {
+  color: $sky;
+}

scss/main.scss

@@ -1,6 +1,8 @@
 * {
   all: unset;
   font-family: "JetBrains Mono Nerd Font";
+  font-size: 1.15rem;
+  font-weight: bold;
 }
 
 //general
@@ -23,5 +25,8 @@
 @import "bar/bar";
 
 //modules - menus
-@import "menus/powermenu";
+@import "menus/menu";
+@import "menus/power";
 @import "menus/audiomenu";
+@import "menus/network";
+@import "menus/bluetooth";

scss/menus/audiomenu.scss

@@ -1,51 +1,32 @@
 @import "../colors";
 
-.audiomenu-items {
+.menu-dropdown-label.audio {
-    background: $mantle;
+    color: $peach;
-    border: .15rem solid $peach;
-    border-radius: .7rem;
-    min-width: 30rem;
-    min-height: 200px;
 }
 
-.audiomenu-items-container {
+.menu-label.audio {
-    margin: .5rem 1rem;
+    color: $peach;
 }
 
-.click-me {
+.menu-button-isactive.audio {
-    background: $lavender;
+    color: $peach;
-    margin: 140px 0px;
 }
 
-.audiomenu-dropdown-label {
+.menu-active-slider {
-    font-size: 1.5rem;
+    trough {
-    font-weight: bold;
+        highlight,
-}
+        progress {
-
-.audiomenu-separator {
-    min-height: .1rem;
-    margin: .6rem 0rem;
-    background: $surface1;
-}
-
-.audiomenu-active {
-    font-size: 1.15rem;
-    font-weight: bold;
-    margin: 0rem .5rem;
-    margin-bottom: 1rem;
-}
-
-.audiomenu-active-slider {
-    margin-left: 1rem;
-    margin-right: 1.5rem;
-}
-
-.audiomenu-active-slider * {
             background: $peach;
-    background-color: $peach;
+        }
-    min-height: 1.3rem;
+    }
-    border-radius: .6rem;
 }
-.audiomenu-slider-container {
+
-    margin-bottom: 1.5rem;
+.menu-button.audio {
+     &:hover {
+        color: $peach;
+    }
+}
+
+.menu-items {
+    min-width: 25rem;
 }

scss/menus/bluetooth.scss

@@ -0,0 +1,43 @@
+@import "../colors";
+
+.menu-dropdown-label.bluetooth {
+    color: $sky;
+}
+
+.menu-label.bluetooth {
+    color: $sky;
+}
+
+.menu-button-isactive.bluetooth {
+    color: $sky;
+}
+
+.menu-button.bluetooth {
+     &:hover {
+        color: $sky;
+    }
+}
+
+.menu-items {
+    min-width: 300px;
+}
+
+.menu-icon-button {
+    font-size: 1.2rem;
+    min-width: 2rem;
+    &:hover {
+        color: $sky;
+    }
+}
+
+.menu-icon-button.delete {
+    margin-left: 0.5rem;
+}
+
+.menu-icon-button-label {
+    font-size: 1.3rem;
+}
+
+.menu-button-name.status {
+    margin-left: 2.1rem;
+}

scss/menus/menu.scss

@@ -0,0 +1,209 @@
+.menu-slider {
+    // @include unset($rec: true);
+
+    trough {
+        background: $base;
+
+        highlight,
+        progress {
+            background: $peach;
+            border-radius: 0.7rem;
+        }
+    }
+
+    slider {
+        box-shadow: none;
+        background-color: transparent;
+        min-height: 1.6rem;
+        min-width: 1.6rem;
+        border: 0rem solid transparent;
+        border-radius: 0.7rem;
+    }
+
+    &:hover {
+        trough {
+            background: $surface0;
+        }
+
+        slider {
+            background: $overlay0;
+            box-shadow: none;
+        }
+    }
+
+    &:disabled {
+
+        highlight,
+        progress {
+        }
+    }
+
+    trough:focus {
+
+        slider {
+        }
+    }
+}
+
+.menu-switch {
+    background-color: $surface0;
+
+    &:checked {
+        background: $sky;
+    }
+
+    trough {
+        highlight,
+        progress {
+            background-color: $peach;
+            border-radius: 0.7rem;
+        }
+    }
+
+    slider {
+        box-shadow: none;
+        background-color: $overlay0;
+        min-height: 1.2rem;
+        min-width: 1.2rem;
+        border: 0rem solid transparent;
+        border-radius: 0.7rem;
+        margin: 0.1rem 0.2rem;
+    }
+
+    &:hover {
+        trough {
+            background: $surface0;
+        }
+
+        slider {
+            background: $overlay0;
+            box-shadow: none;
+        }
+    }
+
+    &:active {
+        background-color: $sky;
+        highlight,
+        progress {
+        }
+    }
+
+    &:disabled {
+
+        highlight,
+        progress {
+        }
+    }
+
+    trough:focus {
+
+        slider {
+        }
+    }
+}
+
+.menu-separator {
+    min-height: .1rem;
+    margin: .6rem 0rem;
+    background: $surface1;
+}
+
+.menu-items {
+    background: $mantle;
+    border: .25rem solid $surface0;
+    border-radius: .7rem;
+    min-width: 375px;
+    color: $text;
+}
+
+.menu-items-container {
+    margin: 1rem 1.5rem;
+}
+
+.menu-dropdown-label {
+    font-size: 1.5rem;
+    font-weight: bold;
+    color: $text;
+}
+
+.menu-active {
+    font-size: 1.15rem;
+    font-weight: bold;
+    margin: 0rem .5rem;
+    margin-bottom: 0.5rem;
+    margin-top: 0.5rem;
+}
+
+.menu-active-icon {
+    color: $overlay1;
+    font-size: 1.7rem;
+    font-weight: bold;
+    margin-right: 0.7rem;
+}
+
+.menu-active-percentage {
+    font-size: 1.1rem;
+    margin-left: 0.5rem;
+    font-weight: bold;
+}
+
+.menu-active-slider {
+    margin-left: 1rem;
+    margin-right: 1.5rem;
+}
+
+.menu-active-slider * {
+    min-height: 1.3rem;
+    border-radius: .7rem;
+}
+.menu-slider-container {
+    margin-bottom: .7rem;
+}
+
+.menu-label {
+    color: $text;
+    font-size: 1.3rem;
+    font-weight: bold;
+}
+
+.menu-label-dim {
+    color: $overlay0;
+    margin-right: 1rem;
+    font-size: 1rem;
+    font-weight: bold;
+}
+
+.dim {
+    color: $overlay0;
+}
+.menu-icon-button {
+    &:hover {
+        color: $surface2;
+    }
+}
+
+.menu-label-container {
+    margin-bottom: 1.3rem;
+}
+
+.menu-button {
+    margin-bottom: .4rem;
+}
+
+.menu-button-name {
+    font-size: 1.1rem;
+    font-weight: bold;
+    margin-left: 1rem;
+    margin-right: 1.2rem;
+}
+
+.menu-button-icon {
+    font-size: 1.3rem;
+    font-weight: bold;
+    color: $overlay0;
+    margin-right: .5rem;
+}
+
+.menu-item-box {
+    margin-bottom: 0.5rem;
+}

style.css

@@ -1,6 +1,8 @@
 * {
   all: unset;
   font-family: "JetBrains Mono Nerd Font";
+  font-size: 1.15rem;
+  font-weight: bold;
 }
 
 menu {
@@ -330,6 +332,17 @@ spinner:checked {
   color: #89dceb;
 }
 
+.bluetooth-disabled-menu {
+  font-weight: bold;
+  font-size: 1.1rem;
+  color: #585b70;
+  margin: 6rem 0rem;
+}
+
+.menu-button-isactive {
+  color: #89dceb;
+}
+
 .clock {
   color: #f5c2e7;
 }
@@ -405,6 +418,9 @@ spinner:checked {
   padding: 2px 12px;
   margin: 6px 3px;
 }
+.bar_item_box_visible:hover {
+  background: #45475a;
+}
 
 .bar_item_box_hidden {
   background: none;
@@ -421,6 +437,165 @@ spinner:checked {
   margin-right: 25px;
 }
 
+.menu-slider trough {
+  background: #1e1e2e;
+}
+.menu-slider trough highlight,
+.menu-slider trough progress {
+  background: #fab387;
+  border-radius: 0.7rem;
+}
+.menu-slider slider {
+  box-shadow: none;
+  background-color: transparent;
+  min-height: 1.6rem;
+  min-width: 1.6rem;
+  border: 0rem solid transparent;
+  border-radius: 0.7rem;
+}
+.menu-slider:hover trough {
+  background: #313244;
+}
+.menu-slider:hover slider {
+  background: #6c7086;
+  box-shadow: none;
+}
+.menu-switch {
+  background-color: #313244;
+}
+.menu-switch:checked {
+  background: #89dceb;
+}
+.menu-switch trough highlight,
+.menu-switch trough progress {
+  background-color: #fab387;
+  border-radius: 0.7rem;
+}
+.menu-switch slider {
+  box-shadow: none;
+  background-color: #6c7086;
+  min-height: 1.2rem;
+  min-width: 1.2rem;
+  border: 0rem solid transparent;
+  border-radius: 0.7rem;
+  margin: 0.1rem 0.2rem;
+}
+.menu-switch:hover trough {
+  background: #313244;
+}
+.menu-switch:hover slider {
+  background: #6c7086;
+  box-shadow: none;
+}
+.menu-switch:active {
+  background-color: #89dceb;
+}
+.menu-separator {
+  min-height: 0.1rem;
+  margin: 0.6rem 0rem;
+  background: #45475a;
+}
+
+.menu-items {
+  background: #181825;
+  border: 0.25rem solid #313244;
+  border-radius: 0.7rem;
+  min-width: 375px;
+  color: #cdd6f4;
+}
+
+.menu-items-container {
+  margin: 1rem 1.5rem;
+}
+
+.menu-dropdown-label {
+  font-size: 1.5rem;
+  font-weight: bold;
+  color: #cdd6f4;
+}
+
+.menu-active {
+  font-size: 1.15rem;
+  font-weight: bold;
+  margin: 0rem 0.5rem;
+  margin-bottom: 0.5rem;
+  margin-top: 0.5rem;
+}
+
+.menu-active-icon {
+  color: #7f849c;
+  font-size: 1.7rem;
+  font-weight: bold;
+  margin-right: 0.7rem;
+}
+
+.menu-active-percentage {
+  font-size: 1.1rem;
+  margin-left: 0.5rem;
+  font-weight: bold;
+}
+
+.menu-active-slider {
+  margin-left: 1rem;
+  margin-right: 1.5rem;
+}
+
+.menu-active-slider * {
+  min-height: 1.3rem;
+  border-radius: 0.7rem;
+}
+
+.menu-slider-container {
+  margin-bottom: 0.7rem;
+}
+
+.menu-label {
+  color: #cdd6f4;
+  font-size: 1.3rem;
+  font-weight: bold;
+}
+
+.menu-label-dim {
+  color: #6c7086;
+  margin-right: 1rem;
+  font-size: 1rem;
+  font-weight: bold;
+}
+
+.dim {
+  color: #6c7086;
+}
+
+.menu-icon-button:hover {
+  color: #585b70;
+}
+
+.menu-label-container {
+  margin-bottom: 1.3rem;
+}
+
+.menu-button {
+  margin-bottom: 0.4rem;
+}
+
+.menu-button-name {
+  font-size: 1.1rem;
+  font-weight: bold;
+  margin-left: 1rem;
+  margin-right: 1.2rem;
+}
+
+.menu-button-icon {
+  font-size: 1.3rem;
+  font-weight: bold;
+  color: #6c7086;
+  margin-right: 0.5rem;
+}
+
+.menu-item-box {
+  margin-bottom: 0.5rem;
+}
+
 window#powermenu,
 window#verification {
   background-color: rgba(0, 0, 0, 0.4);
@@ -586,55 +761,69 @@ window#powermenu .powermenu.box {
   color: #89dceb;
 }
 
-.audiomenu-items {
+.menu-dropdown-label.audio {
-  background: #181825;
+  color: #fab387;
-  border: 0.15rem solid #fab387;
-  border-radius: 0.7rem;
-  min-width: 30rem;
-  min-height: 200px;
 }
 
-.audiomenu-items-container {
+.menu-label.audio {
-  margin: 0.5rem 1rem;
+  color: #fab387;
 }
 
-.click-me {
+.menu-button-isactive.audio {
-  background: #b4befe;
+  color: #fab387;
-  margin: 140px 0px;
 }
 
-.audiomenu-dropdown-label {
+.menu-active-slider trough highlight,
-  font-size: 1.5rem;
+.menu-active-slider trough progress {
-  font-weight: bold;
-}
-
-.audiomenu-separator {
-  min-height: 0.1rem;
-  margin: 0.6rem 0rem;
-  background: #45475a;
-}
-
-.audiomenu-active {
-  font-size: 1.15rem;
-  font-weight: bold;
-  margin: 0rem 0.5rem;
-  margin-bottom: 1rem;
-}
-
-.audiomenu-active-slider {
-  margin-left: 1rem;
-  margin-right: 1.5rem;
-}
-
-.audiomenu-active-slider * {
   background: #fab387;
-  background-color: #fab387;
-  min-height: 1.3rem;
-  border-radius: 0.6rem;
 }
 
-.audiomenu-slider-container {
+.menu-button.audio:hover {
-  margin-bottom: 1.5rem;
+  color: #fab387;
+}
+
+.menu-items {
+  min-width: 25rem;
+}
+
+.menu-dropdown-label.bluetooth {
+  color: #89dceb;
+}
+
+.menu-label.bluetooth {
+  color: #89dceb;
+}
+
+.menu-button-isactive.bluetooth {
+  color: #89dceb;
+}
+
+.menu-button.bluetooth:hover {
+  color: #89dceb;
+}
+
+.menu-items {
+  min-width: 300px;
+}
+
+.menu-icon-button {
+  font-size: 1.2rem;
+  min-width: 2rem;
+}
+.menu-icon-button:hover {
+  color: #89dceb;
+}
+
+.menu-icon-button.delete {
+  margin-left: 0.5rem;
+}
+
+.menu-icon-button-label {
+  font-size: 1.3rem;
+}
+
+.menu-button-name.status {
+  margin-left: 2.1rem;
 }
 
 /*# sourceMappingURL=style.css.map */

style.css.map

@@ -1 +1 @@
-{"version":3,"sourceRoot":"","sources":["scss/main.scss","scss/common/common.scss","scss/colors.scss","scss/common/widget-button.scss","scss/bar/menu.scss","scss/bar/audio.scss","scss/bar/media.scss","scss/bar/network.scss","scss/bar/bluetooth.scss","scss/bar/clock.scss","scss/bar/workspace.scss","scss/bar/window_title.scss","scss/bar/systray.scss","scss/bar/power.scss","scss/bar/bar.scss","scss/menus/powermenu.scss","scss/common/floating-widget.scss","scss/menus/audiomenu.scss"],"names":[],"mappings":"AAAA;EACE;EACA;;;ACFF;EACE;EACA;EACA,kBCFgB;EDGhB;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI,kBChBW;;ADkBf;EACE,OCnBa;;ADqBf;EACE;EACA;EACA;EACA;;AAGJ;EACE;EACA;EACA,kBC/Be;;;ADmCnB;EACE;EACA;EACA;EACA,OCvCiB;;;AD0CnB;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA,kBC9DiB;ED+DjB;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA,kBC9EgB;;;ADiFlB;AAAA;EAEE;EACA,kBCpFgB;;;ADuFlB;AAAA;AAAA;EAGE,OC1FgB;ED2FhB,kBC7CW;;;ADgDb;AAAA;AAAA;EAGE;EACA,kBCpDW;;;ADuDb;AAAA;AAAA;EAGE;EACA,kBC3DW;;;AD8Db;EACE;EACA;EACA;EACA;EACA,kBChHiB;EDiHjB;EACA;EACA;;;AAGF;EACE,kBC1EW;;;AD6Eb;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBCvIc;EDwId;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA,kBChKiB;;;ADmKnB;EACE;EACA,kBCxHW;;;AD2Hb;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA,OC1IW;ED2IX,kBCzLgB;ED0LhB;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE,kBC1MgB;ED2MhB,OC5Mc;ED6Md;;;AAGF;EACE;EACA;EACA,kBCjNiB;;;ADoNnB;EACE;IACE;;;AAIJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AE/NF;EACE,YDmCM;EClCN;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cD2BM;EC1BN;EACA;;AAEA;EACE;EACA,cDSO;ECRP;;AAGF;EAEE;EACA,cDEO;;ACCT;EACE;EACA;EACA;EACA;;AAGF;EACE,YApCM;;AAwCN;EACE;EACA;;AAEF;EACE;EACA;;;AC9CN;EACE,OFsBK;EErBL;EACA;;;ACFA;EACE;;;AAIJ;EACE;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAGF;EACE;;;AAIJ;EACE;EACA,OHRM;;;AGWR;EACE,OHZM;;;AIpBR;EACE;EACA,OJoBM;;;AIjBR;EACE;EACA,OJeM;;;AKtBR;EACE,OLgBM;;;AMjBR;EACE;EACA,ONsBI;;;AMnBN;EACE,ONkBI;;;AOxBN;EACE,OPeK;;;AQfL;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBRmBO;;AQjBP;EACE,kBRQG;EQPH;EACA;;AAGF;EACE,kBROA;EQNA;EACA;;;AAMN;EACE;;;AC1BF;EACE,OTeK;;;AUhBP;EACE;;;AAGF;EACE,YViCO;;;AU/BT;EACE;EACA,OVkBS;;;AUfX;EACE,kBVsBS;;;AUnBX;EACE,kBVmBS;EUlBT;;;AAGF;EACE,kBVKS;;;AW3BX;EACE,OXiBI;EWhBJ;;;ACFF;EACE,YZqCO;EYpCP;EACA;;;AAGF;EACE,YZ6BS;EY5BT;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;EACE;;;AAGF;EACE;;;ACzBF;AAAA;EAGI;;;AAQJ;ECTI;EACA;EACA,kBdiCG;EchCH,OdwCS;EcvCT;EACA;EDMA;EACA;EACA;EACA;;AAEA;EACI,eAXE;;AAaF;EACI;EACA,ObJH;EaKG;;AAGJ;EACI,ObDD;EaEC;EACA;EACA;;AAIR;EACI,YbGA;EaFA;EACA;EACA;EACA,cbDA;EaEA,eAhCC;EAiCD;EACA;EACA;;AAGI;EACI,cb1BR;Ea2BQ;;AAEJ;EACI,cblCV;EamCU;;AAIJ;EACI,cbpCR;EaqCQ;;AAEJ;EACI,cb5CV;Ea6CU;;AAKJ;EACI;EACA;;AAEJ;EACI;EACA;;AAGJ;EACI;EACA;;AAEJ;EACI;EACA;;AAIZ;EACI,ObtEF;;AawEF;EACI,ObrEA;;;AayER;EC7FI;EACA;EACA,kBdiCG;EchCH,OdwCS;EcvCT;EACA;;AD0FA;EACI;;AAGJ;EACI;;;AAIR;EACI,cbpEI;EaqEJ;EACA;EACA;;AAGI;EACI,cbhGN;;AakGE;EACI,cb/FJ;;AaiGA;EACI,cbhGN;;AakGE;EACI,cbvGJ;;Aa2GA;EACI,cb9GN;;AagHE;EACI,cb7GJ;;Aa+GA;EACI,cb9GN;;AagHE;EACI,cbrHJ;;AawHA;EACI;;AAEJ;EACI;;AAEJ;EACI;;AAEJ;EACI;;;AAKR;EACI,Ob1IF;;Aa4IF;EACI,ObzIA;;Aa2IJ;EACI,Ob9IA;;AagJJ;EACI,Ob7IF;;;AakJF;EACI,ObzJF;;Aa2JF;EACI,ObxJA;;Aa0JJ;EACI,Ob7JA;;Aa+JJ;EACI,Ob5JF;;;AexBN;EACI,YfqCK;EepCL;EACA;EACA;EACA;;;AAGJ;EACI;;;AAGJ;EACI,YfcO;EebP;;;AAGJ;EACI;EACA;;;AAGJ;EACI;EACA;EACA,YfUO;;;AePX;EACI;EACA;EACA;EACA;;;AAGJ;EACI;EACA;;;AAGJ;EACI,YfrBI;EesBJ,kBftBI;EeuBJ;EACA;;;AAEJ;EACI","file":"style.css"}
+{"version":3,"sourceRoot":"","sources":["scss/main.scss","scss/common/common.scss","scss/colors.scss","scss/common/widget-button.scss","scss/bar/menu.scss","scss/bar/audio.scss","scss/bar/media.scss","scss/bar/network.scss","scss/bar/bluetooth.scss","scss/bar/clock.scss","scss/bar/workspace.scss","scss/bar/window_title.scss","scss/bar/systray.scss","scss/bar/power.scss","scss/bar/bar.scss","scss/menus/menu.scss","scss/menus/power.scss","scss/common/floating-widget.scss","scss/menus/audiomenu.scss","scss/menus/bluetooth.scss"],"names":[],"mappings":"AAAA;EACE;EACA;EACA;EACA;;;ACJF;EACE;EACA;EACA,kBCFgB;EDGhB;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACI,kBChBW;;ADkBf;EACE,OCnBa;;ADqBf;EACE;EACA;EACA;EACA;;AAGJ;EACE;EACA;EACA,kBC/Be;;;ADmCnB;EACE;EACA;EACA;EACA,OCvCiB;;;AD0CnB;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA;EACA;;;AAGF;AAAA;EAEE;EACA;EACA;EACA;EACA;EACA,kBC9DiB;ED+DjB;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;AAAA;EAEE;EACA,kBC9EgB;;;ADiFlB;AAAA;EAEE;EACA,kBCpFgB;;;ADuFlB;AAAA;AAAA;EAGE,OC1FgB;ED2FhB,kBC7CW;;;ADgDb;AAAA;AAAA;EAGE;EACA,kBCpDW;;;ADuDb;AAAA;AAAA;EAGE;EACA,kBC3DW;;;AD8Db;EACE;EACA;EACA;EACA;EACA,kBChHiB;EDiHjB;EACA;EACA;;;AAGF;EACE,kBC1EW;;;AD6Eb;EACE;;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA,kBCvIc;EDwId;EACA;;;AAGF;EACE;EACA;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA;;;AAGF;EACE;EACA;EACA,kBChKiB;;;ADmKnB;EACE;EACA,kBCxHW;;;AD2Hb;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;EACA;EACA,OC1IW;ED2IX,kBCzLgB;ED0LhB;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE;;;AAGF;EACE,kBC1MgB;ED2MhB,OC5Mc;ED6Md;;;AAGF;EACE;EACA;EACA,kBCjNiB;;;ADoNnB;EACE;IACE;;;AAIJ;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AE/NF;EACE,YDmCM;EClCN;EACA;EACA;EACA;EACA;EACA;EACA;EACA,cD2BM;EC1BN;EACA;;AAEA;EACE;EACA,cDSO;ECRP;;AAGF;EAEE;EACA,cDEO;;ACCT;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","file":"style.css"}