From 4a1a3a6d8915474c2e25f2f1f5e3ec8c84543081 Mon Sep 17 00:00:00 2001
From: 2 * r + 2 * t <61896496+soramanew@users.noreply.github.com>
Date: Mon, 7 Apr 2025 13:38:23 +1000
Subject: bar: add optional labels for workspaces

Also can customise labels
---
 scss/bar.scss | 75 ++++++++++++++++++++++++++++++++++++++++++++++++-----------
 1 file changed, 61 insertions(+), 14 deletions(-)

(limited to 'scss')

diff --git a/scss/bar.scss b/scss/bar.scss
index 9003ce6..a01e8ee 100644
--- a/scss/bar.scss
+++ b/scss/bar.scss
@@ -40,20 +40,43 @@
         }
     }
 
-    .workspaces > * {
-        @include lib.rounded(100);
-        @include lib.element-decel;
+    .workspaces {
+        & > button {
+            @include lib.rounded(100);
+            @include lib.element-decel;
+
+            font-size: lib.s(13);
+            font-weight: bold;
+
+            &.focused {
+                background-color: scheme.$mauve;
+            }
+        }
+
+        &:not(.labels-shown) > button {
+            min-width: lib.s(8);
+            min-height: lib.s(8);
+            background-color: scheme.$surface1;
 
-        min-width: lib.s(8);
-        min-height: lib.s(8);
-        background-color: scheme.$surface1;
+            &.occupied {
+                background-color: scheme.$overlay1;
+            }
 
-        &.occupied {
-            background-color: scheme.$overlay1;
+            &.focused {
+                background-color: scheme.$mauve;
+            }
         }
 
-        &.focused {
-            background-color: scheme.$mauve;
+        &.labels-shown > button {
+            color: color.change(scheme.$overlay1, $alpha: 1);
+
+            &.occupied {
+                color: color.mix(scheme.$text, scheme.$mauve, 50%);
+            }
+
+            &.focused {
+                color: color.change(scheme.$base, $alpha: 1);
+            }
         }
     }
 
@@ -126,13 +149,21 @@
         }
 
         .workspaces {
-            padding: lib.s(3) lib.s(18);
-
             @include lib.spacing(10);
 
             & > .focused {
                 min-width: lib.s(30);
             }
+
+            &.labels-shown > button {
+                padding: lib.s(3) lib.s(8);
+
+                &.focused {
+                    min-width: 0;
+                    padding-left: lib.s(20);
+                    padding-right: lib.s(20);
+                }
+            }
         }
 
         .tray {
@@ -167,13 +198,21 @@
         }
 
         .workspaces {
-            padding: lib.s(18) lib.s(3);
-
             @include lib.spacing(10, true);
 
             & > .focused {
                 min-height: lib.s(30);
             }
+
+            &.labels-shown > button {
+                padding: lib.s(3) lib.s(8);
+
+                &.focused {
+                    min-height: 0;
+                    padding-top: lib.s(15);
+                    padding-bottom: lib.s(15);
+                }
+            }
         }
 
         .tray {
@@ -222,10 +261,18 @@
 
         &.horizontal {
             @include bar-spacing;
+
+            .workspaces {
+                padding: lib.s(6) lib.s(15);
+            }
         }
 
         &.vertical {
             @include bar-spacing(true);
+
+            .workspaces {
+                padding: lib.s(15) lib.s(6);
+            }
         }
     }
 
-- 
cgit v1.2.3-freya