inteligr8/alfresco-content-app
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-content-app.git synced 2025-07-24 17:31:52 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ACS-7558] - Toolbar and buttons (#3833)

Browse Source
This commit is contained in:
dominikiwanekhyland
2024-05-09 14:23:43 +02:00
committed by GitHub
parent da561499bf
commit 9c5a24053b
3 changed files with 28 additions and 20 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
projects/aca-content/src/lib/ui/theme.scss
View File

@@ -28,6 +28,10 @@ mat-icon {
} }
.mdc-button { .mdc-button {
.mdc-button__label {
-webkit-font-smoothing: subpixel-antialiased;
}
&.mat-primary { &.mat-primary {
.mdc-button__label { .mdc-button__label {
-webkit-font-smoothing: initial; -webkit-font-smoothing: initial;
@@ -51,6 +55,10 @@ mat-icon {
} }
.mat-mdc-checkbox { .mat-mdc-checkbox {
.mdc-checkbox:has(div) {
padding-right: 2px;
}
.mdc-form-field { .mdc-form-field {
height: 24px; height: 24px;
@@ -100,14 +108,6 @@ mat-slide-toggle {
} }
} }
.mat-mdc-tab-list {
.mat-mdc-tab-labels {
.mdc-tab--active {
color: #212121;
}
}
}
.mdc-list-item__primary-text { .mdc-list-item__primary-text {
color: var(--adf-theme-foreground-text-color-087); color: var(--adf-theme-foreground-text-color-087);
} }
@@ -172,10 +172,6 @@ mat-slide-toggle {
} }
} }
.mat-mdc-checkbox .mdc-checkbox:has(div) {
padding-right: 2px;
}
.mdc-floating-label, .mdc-floating-label,
.mat-mdc-tab-list .mat-mdc-tab-labels .mdc-tab, .mat-mdc-tab-list .mat-mdc-tab-labels .mdc-tab,
.mat-mdc-checkbox label, .mat-mdc-checkbox label,
@@ -271,6 +267,14 @@ mat-snack-bar-container {
border-bottom: 1px solid var(--adf-theme-foreground-text-color-014); border-bottom: 1px solid var(--adf-theme-foreground-text-color-014);
} }
.mat-mdc-tab-list {
.mat-mdc-tab-labels {
.mdc-tab--active {
color: var($selected-text-color);
}
}
}
.mat-mdc-tab:not(.mat-mdc-tab-disabled).mdc-tab--active .mdc-tab__text-label { .mat-mdc-tab:not(.mat-mdc-tab-disabled).mdc-tab--active .mdc-tab__text-label {
color: var(--theme-sidenav-active-text-color); color: var(--theme-sidenav-active-text-color);
} }
@@ -288,7 +292,7 @@ adf-dynamic-component {
.mdc-notched-outline__trailing, .mdc-notched-outline__trailing,
.mdc-notched-outline__notch, .mdc-notched-outline__notch,
.mdc-notched-outline__leading { .mdc-notched-outline__leading {
border-color: var(--adf-theme-foreground-text-color-014); border-color: var(--adf-theme-foreground-text-color-014);
} }
@@ -306,7 +310,7 @@ adf-dynamic-component {
} }
} }
.mat-mdc-tab-group.mat-mdc-tab-group-stretch-tabs>.mat-mdc-tab-header { .mat-mdc-tab-group.mat-mdc-tab-group-stretch-tabs > .mat-mdc-tab-header {
.mat-mdc-tab:is(div) { .mat-mdc-tab:is(div) {
flex-grow: unset; flex-grow: unset;
min-width: 160px; min-width: 160px;

12
projects/aca-shared/src/lib/components/toolbar/toolbar-action/toolbar-action.component.html
View File

@@ -1,11 +1,11 @@
<ng-container [ngSwitch]="actionRef.type"> <ng-container [ngSwitch]="actionRef.type">
<ng-container *ngSwitchCase="'default'"> <div *ngSwitchCase="'default'" class="aca-toolbar-action-container">
<app-toolbar-button [type]="type" [actionRef]="actionRef" [color]="color"> </app-toolbar-button> <app-toolbar-button [type]="type" [actionRef]="actionRef" [color]="color"> </app-toolbar-button>
</ng-container> </div>
<ng-container *ngSwitchCase="'button'"> <div *ngSwitchCase="'button'" class="aca-toolbar-action-container">
<app-toolbar-button [type]="data?.buttonType || type" [actionRef]="actionRef" [color]="color" [data]="actionRef.data"> </app-toolbar-button> <app-toolbar-button [type]="data?.buttonType || type" [actionRef]="actionRef" [color]="color" [data]="actionRef.data"> </app-toolbar-button>
</ng-container> </div>
<div *ngSwitchCase="'separator'" [id]="actionRef.id" class="aca-toolbar-divider"></div> <div *ngSwitchCase="'separator'" [id]="actionRef.id" class="aca-toolbar-divider"></div>
@@ -13,7 +13,7 @@
<app-toolbar-menu [actionRef]="actionRef" [color]="color" [data]="actionRef.data"></app-toolbar-menu> <app-toolbar-menu [actionRef]="actionRef" [color]="color" [data]="actionRef.data"></app-toolbar-menu>
</ng-container> </ng-container>
<ng-container *ngSwitchCase="'custom'"> <div *ngSwitchCase="'custom'" class="aca-toolbar-action-container">
<adf-dynamic-component [data]="actionRef.data" [id]="actionRef.component"></adf-dynamic-component> <adf-dynamic-component [data]="actionRef.data" [id]="actionRef.component"></adf-dynamic-component>
</ng-container> </div>
</ng-container> </ng-container>

4
projects/aca-shared/src/lib/components/toolbar/toolbar-action/toolbar-action.component.scss
View File

@@ -1,3 +1,7 @@
.aca-toolbar-action { .aca-toolbar-action {
margin: 0 5px; margin: 0 5px;
} }
.aca-toolbar-action-container {
margin-top: 1px;
}