diff --git a/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss b/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss index 6e7d9e8bb..54a5f96a5 100644 --- a/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss +++ b/projects/aca-content/src/lib/components/sidenav/sidenav.component.scss @@ -82,11 +82,20 @@ user-select: none; .aca-action-button__label { - color: var(--theme-action-button-text-color); + color: var(--theme-text-light-color); } &:hover .aca-action-button__label { - color: var(--theme-sidenav-active-text-color); + color: var(--theme-sidenav-hovered-text-color); + } + + .aca-action-button--active { + color: var(--adf-sidenav-active-text-color); + background: var(--theme-selected-background-color); + + .aca-action-button__label { + color: var(--adf-sidenav-active-text-color); + } } } @@ -114,11 +123,6 @@ overflow: hidden; text-overflow: ellipsis; } - - &--active { - color: var(--theme-sidenav-active-text-color); - background: var(--theme-selected-background-color); - } } .aca-full-width { diff --git a/projects/aca-content/src/lib/ui/theme.scss b/projects/aca-content/src/lib/ui/theme.scss index 974325f3c..f8027b35b 100644 --- a/projects/aca-content/src/lib/ui/theme.scss +++ b/projects/aca-content/src/lib/ui/theme.scss @@ -301,7 +301,7 @@ mat-snack-bar-container { } #{$mat-tab-label}:not(#{$mat-tab-disabled})#{$mat-tab-label-active} #{$mat-tab-label-text} { - color: var(--theme-sidenav-active-text-color); + color: var(--theme-tab-active-text-color); } adf-dynamic-component { diff --git a/projects/aca-content/src/lib/ui/variables/variables.scss b/projects/aca-content/src/lib/ui/variables/variables.scss index ad1fbe316..c1220b12b 100644 --- a/projects/aca-content/src/lib/ui/variables/variables.scss +++ b/projects/aca-content/src/lib/ui/variables/variables.scss @@ -59,8 +59,9 @@ $defaults: ( --theme-search-background-color: darken($background-color, 1), --theme-text-color: mat.get-color-from-palette($foreground, text, 0.54), --theme-sidenav-text-color: mat.get-color-from-palette($foreground, text), - --theme-sidenav-active-text-color: mat.get-color-from-palette($foreground, text), + --theme-sidenav-hovered-text-color: mat.get-color-from-palette($foreground, text), --theme-sidenav-user-menu-color: mat.get-color-from-palette($foreground, text), + --theme-tab-active-text-color: mat.get-color-from-palette($foreground, text), --theme-text-bold-color: mat.get-color-from-palette($foreground, text, 0.87), --theme-title-color: mat.get-color-from-palette($foreground, text, 0.87), --theme-text-disabled-color: mat.get-color-from-palette($foreground, text, 0.38),