From 565a48e8e1804c7e2c8f7b70321ed0f4d0c3fe35 Mon Sep 17 00:00:00 2001
From: Jordan Vidrine <30537603+jordanvidrine@users.noreply.github.com>
Date: Mon, 16 Dec 2024 16:02:44 -0600
Subject: [PATCH] UX: fix active and muted channels (#30308)

---
 .../common/base/sidebar-section-link.scss     | 23 ++++++++++++++++++-
 1 file changed, 22 insertions(+), 1 deletion(-)

diff --git a/app/assets/stylesheets/common/base/sidebar-section-link.scss b/app/assets/stylesheets/common/base/sidebar-section-link.scss
index 4dbf83babd0..e4c34f13b3e 100644
--- a/app/assets/stylesheets/common/base/sidebar-section-link.scss
+++ b/app/assets/stylesheets/common/base/sidebar-section-link.scss
@@ -15,6 +15,15 @@
     font-size: var(--font-down-1-rem);
   }
 
+  .sidebar-section-link-prefix {
+    .prefix-image {
+      border: 1px solid transparent;
+    }
+    &.active .prefix-image {
+      box-shadow: 0px 0px 0px 1px var(--success);
+    }
+  }
+
   .sidebar-section-link {
     display: inline-flex;
     width: 100%;
@@ -31,7 +40,7 @@
       }
     }
 
-    &.active {
+    &--active {
       background: var(--d-selected);
       font-weight: bold;
 
@@ -45,6 +54,18 @@
       }
     }
 
+    &--muted {
+      opacity: 0.5;
+      .sidebar-section-link-prefix.icon .d-icon {
+        color: var(--primary-medium);
+      }
+      &.active {
+        .sidebar-section-link-prefix.icon .d-icon {
+          color: var(--primary-high);
+        }
+      }
+    }
+
     .sidebar-section-link-content-badge {
       @include ellipsis;
       padding-left: 0.5em;