fix: Add sidebar disabled styling (#153)

denali-design · Mar 22, 2021 · 32ca75e · 32ca75e
1 parent 0ce5b60
commit 32ca75e
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 0 deletions.
diff --git a/scss/components/tabs.scss b/scss/components/tabs.scss
@@ -89,6 +89,12 @@
                 color: $tabs-primary-vertical-tab-item-active-text-color;
               }
             }
+            &.is-disabled {
+              box-shadow: $tabs-primary-vertical-tab-item-disabled-border;
+              > * {
+                color: $tabs-primary-vertical-tab-item-disabled-text-color;
+              }
+            }
             // Section Header
             &.tabs__section-header {
               font-size: $tabs-section-header-text-size;

diff --git a/scss/utilities/root-variables.scss b/scss/utilities/root-variables.scss
@@ -350,6 +350,8 @@ $tabs-primary-vertical-tab-item-hover-border: inset 0px 0px 0px 1px rgba($color-
 $tabs-primary-vertical-tab-item-hover-bg-color: null;
 $tabs-primary-vertical-tab-item-hover-text-color: $color-brand-400;
 $tabs-primary-vertical-tab-item-hover-text-weight: null;
+$tabs-primary-vertical-tab-item-disabled-border: none;
+$tabs-primary-vertical-tab-item-disabled-text-color: rgba($color-grey-800, 0.2);
 
 $tabs-secondary-border: inset 0px -2px rgba($color-grey-700, .05);
 $tabs-secondary-tab-item-height: 40px;