diff --git a/projects/aca-content/src/lib/components/dl-custom-components/name-column/name-column.component.scss b/projects/aca-content/src/lib/components/dl-custom-components/name-column/name-column.component.scss index 985605f27e..395de95fac 100644 --- a/projects/aca-content/src/lib/components/dl-custom-components/name-column/name-column.component.scss +++ b/projects/aca-content/src/lib/components/dl-custom-components/name-column/name-column.component.scss @@ -8,7 +8,7 @@ display: flex; .adf-datatable-cell-badge { - color: var(--theme-contrast-gray); + color: var(--theme-secondary-text); } } diff --git a/projects/aca-content/src/lib/components/sidenav/user-menu/user-menu.component.scss b/projects/aca-content/src/lib/components/sidenav/user-menu/user-menu.component.scss index 36cc0442b0..cfee62257a 100644 --- a/projects/aca-content/src/lib/components/sidenav/user-menu/user-menu.component.scss +++ b/projects/aca-content/src/lib/components/sidenav/user-menu/user-menu.component.scss @@ -9,6 +9,6 @@ text-align: center; vertical-align: middle; background: var(--theme-about-panel-border-color); - color: var(--theme-selected-text-color); + color: var(--theme-sidenav-user-menu-color); border: none; } diff --git a/projects/aca-content/src/lib/ui/theme.scss b/projects/aca-content/src/lib/ui/theme.scss index b492548154..ec6d2e8b96 100644 --- a/projects/aca-content/src/lib/ui/theme.scss +++ b/projects/aca-content/src/lib/ui/theme.scss @@ -9,7 +9,7 @@ mat-toolbar { } .adf-name-location-cell-location.adf-datatable-cell-value { - color: var(--theme-contrast-gray); + color: var(--theme-secondary-text); } .mat-tab-list { @@ -27,14 +27,14 @@ mat-toolbar { .mat-checkbox-label, mat-toolbar.mat-toolbar.mat-toolbar-multiple-row, mat-toolbar.mat-toolbar.mat-toolbar-single-row { - color: var(--theme-contrast-gray); + color: var(--theme-secondary-text); opacity: 1; } .adf-upload-dialog { &__header, &__content { - color: var(--theme-contrast-gray); + color: var(--theme-secondary-text); } } @@ -42,7 +42,7 @@ mat-toolbar.mat-toolbar.mat-toolbar-single-row { .adf-version-list-item { &-comment, &-date { - color: var(--theme-contrast-gray); + color: var(--theme-secondary-text); opacity: 1; } } @@ -50,14 +50,14 @@ mat-toolbar.mat-toolbar.mat-toolbar-single-row { .adf-property-field { .adf-textitem-edit-icon.mat-icon { - color: var(--theme-contrast-gray); + color: var(--theme-secondary-text); } } .adf-property-field.adf-card-textitem-field:hover .adf-property-clear-value { - color: var(--theme-contrast-gray); + color: var(--theme-secondary-text); } .adf-empty-content__icon { - color: var(--theme-contrast-gray); + color: var(--theme-secondary-text); } diff --git a/projects/aca-content/src/lib/ui/variables/variables.scss b/projects/aca-content/src/lib/ui/variables/variables.scss index 824273cdfb..f675236fa3 100644 --- a/projects/aca-content/src/lib/ui/variables/variables.scss +++ b/projects/aca-content/src/lib/ui/variables/variables.scss @@ -7,6 +7,7 @@ $background: map-get($custom-theme, background); $background-color: mat.get-color-from-palette($background, background); $background-card-color: mat.get-color-from-palette($background, card); $text-color: mat.get-color-from-palette($foreground, text); +$secondary-text: mat.get-color-from-palette($foreground, secondary-text); // Custom variables - ACA specific styling: $data-table-thumbnail-width: 35px; @@ -39,7 +40,7 @@ $action-button-text-color: lighten($text-color, 35%); $page-layout-header-background-color: $background-card-color; $search-chip-icon-color: #757575; $disabled-chip-background-color: #f5f5f5; -$contrast-gray: #646569; +$contrast-gray: mat.get-color-from-palette($foreground, 'secondary-tex'); // CSS Variables $defaults: ( @@ -47,6 +48,7 @@ $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-user-menu-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), @@ -83,7 +85,7 @@ $defaults: ( --theme-page-layout-header-background-color: $page-layout-header-background-color, --theme-search-chip-icon-color: $search-chip-icon-color, --theme-disabled-chip-background-color: $disabled-chip-background-color, - --theme-contrast-gray: $contrast-gray + --theme-secondary-text: $secondary-text ); // propagates SCSS variables into the CSS variables scope