[ACS-7452] - Small screen notification banner [ACS-7418] About page (#3760)

* [ACS-7452] - Small screen notification banner

* [ACS-7452] - Small screen notification banner [ACS-7418] About page
This commit is contained in:
jacekpluta
2024-04-05 13:17:52 +02:00
committed by MichalKinas
parent 573a3099fc
commit 4dfd87d3fc
5 changed files with 76 additions and 64 deletions

View File

@@ -3,6 +3,12 @@
adf-about { adf-about {
/* custom ADF About Component Theme */ /* custom ADF About Component Theme */
.mdc-data-table__header-cell {
color: var(--adf-theme-foreground-text-color-054);
font-size: 12px;
font-weight: 500;
}
background-color: var(--theme-about-panel-background-color); background-color: var(--theme-about-panel-background-color);
overflow: auto; overflow: auto;

View File

@@ -18,6 +18,14 @@ mat-icon {
color: var(--theme-secondary-text); color: var(--theme-secondary-text);
} }
.mat-mdc-button > .mat-icon {
padding: 0;
}
.mdc-button:active {
outline: none;
}
mat-slide-toggle { mat-slide-toggle {
.mdc-switch__icons { .mdc-switch__icons {
display: none; display: none;
@@ -31,10 +39,6 @@ mat-slide-toggle {
} }
} }
.adf-name-location-cell-location.adf-datatable-cell-value {
color: var(--theme-secondary-text);
}
.mdc-text-field--filled:not(.mdc-text-field--disabled) { .mdc-text-field--filled:not(.mdc-text-field--disabled) {
background-color: transparent; background-color: transparent;
padding: 0; padding: 0;

View File

@@ -1,12 +1,15 @@
<div class="aca-open-in-app">
<div class="aca-mobile-application-container"> <div class="aca-mobile-application-container">
<span>{{ 'APP.DIALOGS.MOBILE_APP.OPEN_ALFRESCO_MOBILE_APP' | translate }}</span> <span>{{ 'APP.DIALOGS.MOBILE_APP.OPEN_ALFRESCO_MOBILE_APP' | translate }}</span>
<button mat-button class="aca-cross-button" (click)="onCloseDialog()"> <button mat-icon-button mat-dialog-close class="aca-cross-button">
<mat-icon class="aca-cross-button-icon">close</mat-icon> <mat-icon (click)="onCloseDialog()" class="aca-cross-button-icon">close</mat-icon>
</button> </button>
</div> </div>
<div class="aca-open-in-app-container"> <div class="aca-open-in-app-button-container">
<button mat-button (click)="openInApp()" data-automation-id="open-in-app-button" class="aca-open-in-app-container-button" cdkFocusInitial> <button mat-button (click)="openInApp()"
data-automation-id="open-in-app-button"
class="aca-open-in-app-button-container" cdkFocusInitial>
<span>{{ 'APP.DIALOGS.MOBILE_APP.MOBILE_APP_BUTTON_LABEL' | translate }}</span> <span>{{ 'APP.DIALOGS.MOBILE_APP.MOBILE_APP_BUTTON_LABEL' | translate }}</span>
</button> </button>
</div> </div>
@@ -16,3 +19,4 @@
<span>{{ 'APP.DIALOGS.MOBILE_APP.DOWNLOAD_APP_BUTTON_LABEL' | translate }}</span> <span>{{ 'APP.DIALOGS.MOBILE_APP.DOWNLOAD_APP_BUTTON_LABEL' | translate }}</span>
</button> </button>
</div> </div>
</div>

View File

@@ -1,31 +1,28 @@
aca-open-in-app { aca-open-in-app {
.aca-open-in-app-container { .aca-open-in-app {
.aca-open-in-app-button-container {
display: flex; display: flex;
place-content: center; place-content: center;
padding: 0; padding: 0;
border-radius: 8px; border-radius: 8px;
background-color: var(--theme-primary-color); background-color: var(--theme-primary-color);
color: var(--theme-about-panel-background-color); height: 48px;
margin-top: 12px;
&-button {
overflow-x: hidden; overflow-x: hidden;
font-size: 16px; font-size: 16px;
width: 100%; color: white;
padding: 0; font-weight: 600;
height: 48px;
&:focus-visible { &:focus-visible {
outline: none; outline: none;
border-radius: unset; border-radius: unset;
} }
} }
}
.aca-download-app-container { .aca-download-app-container {
display: flex; display: flex;
place-content: center; place-content: center;
margin-top: 12px; margin-top: 12px;
margin-bottom: 16px;
&-button { &-button {
background: var(--theme-dialog-background-color); background: var(--theme-dialog-background-color);
@@ -41,6 +38,7 @@ aca-open-in-app {
align-items: center; align-items: center;
font-size: 14px; font-size: 14px;
padding: 6px 0; padding: 6px 0;
margin-bottom: 12px;
} }
.aca-cross-button { .aca-cross-button {
@@ -53,8 +51,8 @@ aca-open-in-app {
&-icon { &-icon {
font-weight: bold; font-weight: bold;
font-size: 21px; font-size: 20px;
height: 21px; }
} }
} }
} }

View File

@@ -23,7 +23,7 @@
*/ */
import { Component, Inject, ViewEncapsulation } from '@angular/core'; import { Component, Inject, ViewEncapsulation } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog'; import { MatDialogRef, MAT_DIALOG_DATA, MatDialogModule } from '@angular/material/dialog';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';
import { MatButtonModule } from '@angular/material/button'; import { MatButtonModule } from '@angular/material/button';
@@ -36,7 +36,7 @@ export interface OpenInAppDialogOptions {
} }
@Component({ @Component({
standalone: true, standalone: true,
imports: [CommonModule, TranslateModule, MatButtonModule, MatIconModule, A11yModule], imports: [CommonModule, TranslateModule, MatButtonModule, MatIconModule, A11yModule, MatDialogModule],
selector: 'aca-open-in-app', selector: 'aca-open-in-app',
templateUrl: './open-in-app.component.html', templateUrl: './open-in-app.component.html',
styleUrls: ['./open-in-app.component.scss'], styleUrls: ['./open-in-app.component.scss'],