diff --git a/projects/aca-content/src/lib/components/details/details.component.scss b/projects/aca-content/src/lib/components/details/details.component.scss index 398816a44a..df40d21e80 100644 --- a/projects/aca-content/src/lib/components/details/details.component.scss +++ b/projects/aca-content/src/lib/components/details/details.component.scss @@ -35,7 +35,7 @@ app-details-manager { display: flex; align-items: center; justify-content: space-between; - color: var(--adf-metadata-property-panel-title-color); + color: var(--theme-metadata-property-panel-title-color); } .acs-details-breadcrumb { diff --git a/projects/aca-content/src/lib/ui/overrides/adf-style-fixes.theme.scss b/projects/aca-content/src/lib/ui/overrides/adf-style-fixes.theme.scss index 5a3514d2dd..12c35e58f5 100644 --- a/projects/aca-content/src/lib/ui/overrides/adf-style-fixes.theme.scss +++ b/projects/aca-content/src/lib/ui/overrides/adf-style-fixes.theme.scss @@ -12,3 +12,22 @@ } } } + +.adf-info-drawer-layout-content .app-metadata-tab .adf-metadata-properties .mat-expansion-panel { + border: 1px solid var(--theme-metadata-property-panel-border-color); + border-radius: 12px; + margin: 24px; +} + +.acs-details-container { + .mat-tab-body-content { + .adf-metadata-properties { + .mat-expansion-panel { + width: 755px; + border: 1px solid var(--theme-metadata-property-panel-border-color); + margin: 24px; + border-radius: 12px; + } + } + } +} diff --git a/projects/aca-content/src/lib/ui/variables/variables.scss b/projects/aca-content/src/lib/ui/variables/variables.scss index aabe4c658f..0ecb555151 100644 --- a/projects/aca-content/src/lib/ui/variables/variables.scss +++ b/projects/aca-content/src/lib/ui/variables/variables.scss @@ -35,10 +35,10 @@ $action-button-text-color: rgba(33, 35, 40, 0.7); $page-layout-header-background-color: #fff; $search-chip-icon-color: #757575; $disabled-chip-background-color: #f5f5f5; -$adf-metadata-property-panel-border-color: rgba(0, 0, 0, 0.12); -$adf-metadata-buttons-background-color: rgba(33, 33, 33, 0.05); -$adf-metadata-property-panel-text-color: rgba(33, 35, 40, 0.7); -$adf-metadata-property-panel-label-color: rgba(33, 33, 33, 0.24); +$metadata-property-panel-border-color: rgba(0, 0, 0, 0.12); +$metadata-buttons-background-color: rgba(33, 33, 33, 0.05); +$metadata-property-panel-text-color: rgba(33, 35, 40, 0.7); +$metadata-property-panel-label-color: rgba(33, 33, 33, 0.24); // CSS Variables $defaults: ( @@ -79,11 +79,11 @@ $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, - --adf-metadata-property-panel-border-color: $adf-metadata-property-panel-border-color, - --adf-metadata-buttons-background-color: $adf-metadata-buttons-background-color, - --adf-metadata-property-panel-title-color: $selected-text-color, - --adf-metadata-property-panel-text-color: $adf-metadata-property-panel-text-color, - --adf-metadata-property-panel-label-color: $adf-metadata-property-panel-label-color + --theme-metadata-property-panel-border-color: $metadata-property-panel-border-color, + --theme-metadata-buttons-background-color: $metadata-buttons-background-color, + --theme-metadata-property-panel-title-color: $selected-text-color, + --theme-metadata-property-panel-text-color: $metadata-property-panel-text-color, + --theme-metadata-property-panel-label-color: $metadata-property-panel-label-color ); // propagates SCSS variables into the CSS variables scope