Regenerated

Droidnix/README.org

@@ -2854,6 +2854,9 @@ This file contains all css for waybar
 @define-color overlay1 rgba(255, 255, 255, 0.35);
 @define-color yellow   rgba(255, 215, 0, 0.95);
 
+/* =========================================================
+ * GLOBAL FONT
+ * ========================================================= */
 * {
     font-family:
         Aporetic Sans Mono,
@@ -2865,6 +2868,9 @@ This file contains all css for waybar
     font-size: 13px;
 }
 
+/* =========================================================
+ * WINDOW / BAR
+ * ========================================================= */
 window#waybar {
     background-color: transparent;
     color: @text;
@@ -2873,8 +2879,16 @@ window#waybar {
     transition-duration: 0.5s;
 }
 
+/* =========================================================
+ * WORKSPACES BUTTONS
+ * ========================================================= */
 #workspaces button {
-    @apply .workspace-like;
+    padding: 0px 1px;
+    min-width: 80px;
+    background-color: transparent;
+    color: @text;
+    border: 2px solid @inactive;
+    border-radius: 10px;
 }
 
 #workspaces button:hover {
@@ -2895,50 +2909,47 @@ window#waybar {
         linear-gradient(45deg, @blue, @green) border-box;
 }
 
-/* Custom Hyprland Workspaces as Label (visible!) */
+/* =========================================================
-#custom-hypr-workspaces.module {
+ * CUSTOM HYPR-WORKSPACES
-    padding: 0 6px;
+ * ========================================================= */
+#custom-hypr-workspaces.module.ok {
+    padding: 0px 1px;
     min-width: 80px;
-    text-align: center;
+    color: @subtext1;
-    font-weight: normal;
     border-radius: 10px;
-    border: 2px solid @inactive;
+    border: 1px solid rgba(255, 255, 255, 0.12);
-    background-color: rgba(30, 30, 46, 0.5); /* semi-transparent base */
+    background: rgba(255, 255, 255, 0.03);
-    color: @text;
 }
 
-/* Hover: approximate workspace hover */
+#custom-hypr-workspaces.module.ok:hover {
-#custom-hypr-workspaces.module:hover {
+    color: @text;
     background-color: @surface1;
-    border-color: @text;
+    border: 1px solid rgba(255, 255, 255, 0.18);
-    color: @text;
 }
 
-/* Active: simplified workspace active */
-#custom-hypr-workspaces.module.active {
-    font-weight: bold;
-    border: 2px solid @blue;
-    background-color: @blue;
-    color: @text;
-}
-
-/* Overflow: show a subtle highlight */
 #custom-hypr-workspaces.module.overflow {
-    font-weight: bold;
+    padding: 0px 1px;
-    border: 2px dashed @green;
+    min-width: 80px;
-    background-color: rgba(0, 255, 153, 0.15);
     color: @text;
+    border-radius: 10px;
+    font-weight: bold;
+    border: 1px dashed transparent;
+    background:
+        linear-gradient(rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05))
+            padding-box,
+        linear-gradient(45deg, @blue, @green) border-box;
 }
 
-/* Error: clear, visible */
 #custom-hypr-workspaces.module.error {
-    font-weight: bold;
+    padding: 0px 1px;
-    border: 2px solid @red;
+    min-width: 80px;
-    background-color: rgba(255, 0, 0, 0.15);
     color: @text;
+    border-radius: 10px;
+    border: 1px solid rgba(255, 0, 0, 0.55);
+    background: rgba(255, 0, 0, 0.15);
+    font-weight: bold;
 }
 
-/* Hidden state */
 #custom-hypr-workspaces.module.hidden {
     padding: 0;
     margin: 0;
@@ -2948,36 +2959,26 @@ window#waybar {
     opacity: 0;
 }
 
-#custom-hardware-wrap {
+/* =========================================================
-     box-shadow: none;
+ * NOTIFICATIONS
-     background: transparent;
+ * ========================================================= */
-         text-shadow: none;
+#custom-notifications {
-     padding: 0px;
+    margin: 0 4px;
-     border-radius: 5px;
+    padding: 0 4px;
-     margin-top: 3px;
+    min-width: 0;
-     margin-bottom: 3px;
-     margin-right: 6px;
-     margin-left: 6px;
-     padding-right: 4px;
-     padding-left: 4px;
-     color: #98C379;
 }
 
-#custom-connections-wrap {
+#custom-notifications.empty {
-     box-shadow: none;
+    color: @overlay1;
-     background: transparent;
-         text-shadow: none;
-     padding: 0px;
-     border-radius: 5px;
-     margin-top: 3px;
-     margin-bottom: 3px;
-     margin-right: 6px;
-     margin-left: 6px;
-     padding-right: 4px;
-     padding-left: 4px;
-     color: #98C379;
 }
 
+#custom-notifications.unread {
+    color: @yellow;
+}
+
+/* =========================================================
+ * OTHER MODULES
+ * ========================================================= */
 #clock,
 #idle_inhibitor,
 #battery,
@@ -3035,6 +3036,46 @@ window#waybar {
 #temperature.critical {
     background-color: @red;
 }
+
+/* =========================================================
+ * GROUP STYLING (shared for all groups)
+ * ========================================================= */
+#group-workspaces,
+#group-hardware,
+#group-connections {
+    padding: 2px 4px;
+    border-radius: 12px;
+    color: @text;
+
+    /* subtle gradient / colored border */
+    border: 1px solid rgba(51, 204, 255, 0.6);
+    background-color: rgba(255, 255, 255, 0.08);
+
+    font-weight: bold;
+}
+
+/* Hover effect for all groups */
+#group-workspaces:hover,
+#group-hardware:hover,
+#group-connections:hover {
+    background-color: rgba(255, 255, 255, 0.12);
+}
+
+/* Remove spacing between children */
+#group-workspaces > *,
+#group-hardware > *,
+#group-connections > * {
+    margin: 0;
+}
+
+/* Make children visually part of the group */
+#group-workspaces #workspaces button,
+#group-workspaces #custom-hypr-workspaces,
+#group-hardware *,
+#group-connections * {
+    border: none;
+    background: transparent;
+}
 #+END_SRC
 
 ** =.config/waybar/scripts/bluetooth-status.sh=