[ACS-9670] Add white background to login screen (#4589)

* [ACS-9670] Add white background to login screen

* [ACS-9670] Move white color to separate variable

* [ACS-9670] Add missing change
This commit is contained in:
MichalKinas
2025-05-30 16:21:30 +02:00
committed by GitHub
parent 5ed6ab10a1
commit 5b388270c5
7 changed files with 22 additions and 15 deletions

View File

@@ -31,6 +31,13 @@ import { AppSettingsService } from '@alfresco/aca-shared';
standalone: true,
imports: [LoginComponent, TranslateModule],
templateUrl: './app-login.component.html',
styles: [
`
.adf-login {
background-color: var(--theme-white-background);
}
`
],
encapsulation: ViewEncapsulation.None
})
export class AppLoginComponent {

View File

@@ -8,7 +8,7 @@
align-items: center;
height: 100%;
width: 100%;
background-color: white;
background-color: var(--theme-white-background);
border-top: 1px solid var(--theme-grey-background-color);
padding-top: 28px;

View File

@@ -93,7 +93,7 @@ app-view-profile {
height: 30px;
margin: 1rem;
margin-left: 0.5rem;
color: white;
color: var(--theme-white-background);
background-color: var(--theme-blue-button-color);
font-weight: 600;
}

View File

@@ -63,7 +63,7 @@
}
&:focus-visible {
background-color: white;
background-color: var(--theme-white-background);
.mdc-list-item__content {
@include mixins.rounded-border;
@@ -95,11 +95,11 @@
&:focus-visible {
@include mixins.rounded-border;
background-color: white;
background-color: var(--theme-white-background);
}
&.cdk-keyboard-focused:not([disabled]) {
background-color: white;
background-color: var(--theme-white-background);
}
}
}
@@ -199,12 +199,12 @@
&:focus-visible {
@include mixins.rounded-border;
background-color: white;
background-color: var(--theme-white-background);
}
}
&.cdk-keyboard-focused:not([aria-disabled='true']) {
background-color: white;
background-color: var(--theme-white-background);
@include mixins.rounded-border;
}
@@ -215,7 +215,7 @@
.mat-mdc-simple-snack-bar,
.mat-mdc-snack-bar-action {
color: white;
color: var(--theme-white-background);
}
}

View File

@@ -239,16 +239,16 @@ mat-toolbar#{ms.$mat-toolbar}#{ms.$mat-toolbar-single-row} {
mat-snack-bar-container {
#{ms.$mat-button}#{ms.$mat-unthemed} {
--mdc-text-button-label-text-color: #fff;
--mdc-text-button-label-text-color: var(--theme-white-background);
}
}
.adf-warning-snackbar,
.adf-info-snackbar,
.adf-error-snackbar {
--mat-mdc-snack-bar-button-color: #fff;
--mdc-snackbar-supporting-text-color: #fff;
--mdc-text-button-label-text-color: #fff;
--mat-mdc-snack-bar-button-color: var(--theme-white-background);
--mdc-snackbar-supporting-text-color: var(--theme-white-background);
--mdc-text-button-label-text-color: var(--theme-white-background);
}
.adf-warning-snackbar {

View File

@@ -34,7 +34,7 @@ $theme-dropdown-background-hover: darken($background-color, 10%);
$grey-divider: rgba(0, 0, 0, 0.22);
$datetimepicker-font-color: rgba(black, 0.87);
$datetimepicker-selected-date-background: #2254b2;
$datetimepicker-cell-background-color: #fff;
$white-background: #fff;
$datetimepicker-cell-focus-border-color: #1f74db;
$sidenav-background-color: $background-color;
$selected-text-color: #212121;
@@ -92,7 +92,7 @@ $defaults: (
--theme-about-panel-title-color: mat.m2-get-color-from-palette($foreground, text),
--theme-datetimepicker-font-color: $datetimepicker-font-color,
--theme-datetimepicker-selected-date-background: $datetimepicker-selected-date-background,
--theme-datetimepicker-cell-background: $datetimepicker-cell-background-color,
--theme-white-background: $white-background,
--theme-datetimepicker-cell-focus-border: $datetimepicker-cell-focus-border-color,
--theme-sidenav-background-color: $sidenav-background-color,
--theme-selected-text-color: $selected-text-color,

View File

@@ -11,7 +11,7 @@ aca-open-in-app {
height: 48px;
overflow-x: hidden;
font-size: 16px;
color: white;
color: var(--theme-white-background);
font-weight: 600;
&:focus-visible {