mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-07-24 17:32:15 +00:00
[ACS-6140] - Remove references to internal Angular Material CSS classes (#9271)
This commit is contained in:
DominikIwanek
GitHub
@@ -128,15 +128,6 @@ adf-cloud-app-details {
|
||||
&-icon {
|
||||
color: #e9f1f3;
|
||||
}
|
||||
|
||||
&.mat-card-actions {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
|
||||
&:last-child {
|
||||
margin-bottom: 0 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -43,7 +43,7 @@
|
||||
<ng-template #loading>
|
||||
<ng-container>
|
||||
<div class="adf-app-list-spinner">
|
||||
<mat-spinner></mat-spinner>
|
||||
<mat-spinner class="adf-app-list-cloud--spinner"></mat-spinner>
|
||||
</div>
|
||||
</ng-container>
|
||||
</ng-template>
|
||||
|
||||
@@ -16,7 +16,7 @@ adf-cloud-app-list {
|
||||
flex-direction: column;
|
||||
height: 85vh;
|
||||
|
||||
.mat-spinner {
|
||||
.adf-app-list-cloud-spinner {
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
</div>
|
||||
|
||||
<div *ngIf="hasForm()" class="adf-form-container">
|
||||
<mat-card>
|
||||
<mat-card class="adf-form-container-card">
|
||||
<mat-card-header *ngIf="showTitle || showRefreshButton || showValidationIcon">
|
||||
<mat-card-title>
|
||||
<h4>
|
||||
|
||||
@@ -9,13 +9,14 @@
|
||||
<button
|
||||
(click)="openSelectDialog()"
|
||||
mat-raised-button
|
||||
class="adf-attach-widget__menu-upload__button"
|
||||
color="primary"
|
||||
[id]="field.id"
|
||||
[matTooltip]="field.tooltip"
|
||||
matTooltipPosition="above"
|
||||
matTooltipShowDelay="1000">
|
||||
{{ 'FORM.FIELD.ATTACH' | translate }}
|
||||
<mat-icon class="adf-attach-widget__icon">{{getWidgetIcon()}}</mat-icon>
|
||||
<mat-icon class="adf-attach-widget__menu-upload__button__icon">{{getWidgetIcon()}}</mat-icon>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -20,7 +20,7 @@
|
||||
align-items: center;
|
||||
margin-right: 8px;
|
||||
|
||||
.mat-raised-button {
|
||||
.adf-attach-widget__menu-upload__button {
|
||||
line-height: 28px;
|
||||
font-size: var(--theme-caption-font-size);
|
||||
}
|
||||
@@ -43,18 +43,6 @@
|
||||
padding-left: 5px;
|
||||
}
|
||||
|
||||
&-attach-widget-repo-button {
|
||||
padding-left: 10px;
|
||||
|
||||
.mat-button-wrapper {
|
||||
display: inline;
|
||||
}
|
||||
|
||||
.mat-mini-fab.mat-accent {
|
||||
background-color: inherit;
|
||||
}
|
||||
}
|
||||
|
||||
&-attach-widget {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
@@ -87,17 +75,17 @@
|
||||
}
|
||||
|
||||
&-attach-files-row {
|
||||
div.mat-list-item-content {
|
||||
> div:first-child {
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.mat-line {
|
||||
.adf-file {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
&-attach-selected-file-row {
|
||||
div.mat-list-item-content {
|
||||
> div:first-child {
|
||||
.adf-datatable-selected {
|
||||
color: var(--theme-primary-color);
|
||||
padding-right: 6px;
|
||||
|
||||
@@ -2,7 +2,7 @@
|
||||
<table mat-table [dataSource]="uploadedFiles" class="mat-elevation-z0" *ngIf="hasFile">
|
||||
<ng-container matColumnDef="icon">
|
||||
<th mat-header-cell *matHeaderCellDef></th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
<td mat-cell class="adf-file-properties-table-cell" *matCellDef="let element">
|
||||
<mat-icon mat-list-icon class="adf-datatable-selected"
|
||||
*ngIf="selectedNode && element.id === selectedNode.id" (click)="onRowClicked(element)">
|
||||
check_circle
|
||||
@@ -17,7 +17,7 @@
|
||||
|
||||
<ng-container matColumnDef="fileName">
|
||||
<th mat-header-cell *matHeaderCellDef>{{ 'FORM.FIELD.FILE_NAME' | translate }}</th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
<td mat-cell class="adf-file-properties-table-cell" *matCellDef="let element">
|
||||
<span matLine id="{{'file-'+element?.id}}"
|
||||
role="button"
|
||||
tabindex="0"
|
||||
@@ -30,7 +30,7 @@
|
||||
<ng-container *ngFor="let columnName of field?.params?.displayableCMProperties" [matColumnDef]="columnName.name">
|
||||
<th mat-header-cell *matHeaderCellDef>{{ columnName.title ? columnName.title : columnName.name | titlecase
|
||||
}}</th>
|
||||
<td mat-cell *matCellDef="let row">
|
||||
<td mat-cell class="adf-file-properties-table-cell" *matCellDef="let row">
|
||||
<span matLine id="{{'fileProperty-'+row?.id+'-'+columnName?.name}}" role="button" tabindex="0"
|
||||
(click)="onRowClicked(row)">{{ getColumnValue(row, columnName) }}</span>
|
||||
</td>
|
||||
@@ -38,7 +38,7 @@
|
||||
|
||||
<ng-container matColumnDef="action">
|
||||
<th mat-header-cell *matHeaderCellDef></th>
|
||||
<td mat-cell *matCellDef="let element">
|
||||
<td mat-cell class="adf-file-properties-table-cell" *matCellDef="let element">
|
||||
<button id="{{'file-'+element?.id+'-option-menu'}}" mat-icon-button [matMenuTriggerFor]="fileActionMenu"
|
||||
*ngIf="!!element.content?.mimeType" [attr.aria-label]="'ADF_PROCESS_LIST.DETAILS.BUTTON.FILE_OPTION_MENU' | translate">
|
||||
<mat-icon>more_vert</mat-icon>
|
||||
@@ -77,7 +77,7 @@
|
||||
</mat-menu>
|
||||
</td>
|
||||
</ng-container>
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
<tr mat-header-row class="adf-file-properties-table-header-row" *matHeaderRowDef="displayedColumns"></tr>
|
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
|
||||
|
||||
</table>
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
padding: 6px;
|
||||
}
|
||||
|
||||
tr.mat-header-row {
|
||||
tr.adf-file-properties-table-header-row {
|
||||
height: 32px;
|
||||
}
|
||||
|
||||
@@ -33,10 +33,8 @@
|
||||
padding-right: 0 !important;
|
||||
}
|
||||
|
||||
td.mat-cell:first-of-type,
|
||||
td.mat-footer-cell:first-of-type,
|
||||
td.mat-cell:last-of-type,
|
||||
td.mat-footer-cell:last-of-type {
|
||||
td.adf-file-properties-table-cell:first-of-type,
|
||||
td.adf-file-properties-table-cell:last-of-type {
|
||||
width: 18% !important;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -9,7 +9,7 @@
|
||||
<img mat-list-icon class="adf-upload-widget__icon" [id]="'file-'+file.id+'-icon'"
|
||||
[src]="getIcon(file.content.mimeType)" [alt]="mimeTypeIcon" (click)="fileClicked(file)"
|
||||
(keyup.enter)="fileClicked(file)" role="button" tabindex="0" />
|
||||
<span matLine id="{{'file-'+file.id}}" (click)="fileClicked(file)" (keyup.enter)="fileClicked(file)"
|
||||
<span class="adf-upload-widget__button" matLine id="{{'file-'+file.id}}" (click)="fileClicked(file)" (keyup.enter)="fileClicked(file)"
|
||||
role="button" tabindex="0" class="adf-file">{{file.name}}</span>
|
||||
<button *ngIf="!field.readOnly" mat-icon-button [id]="'file-'+file.id+'-remove'"
|
||||
(click)="removeFile(file);" (keyup.enter)="removeFile(file);">
|
||||
|
||||
@@ -25,7 +25,7 @@
|
||||
}
|
||||
|
||||
&-upload-files-row {
|
||||
.mat-line {
|
||||
.adf-upload-widget__button {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,19 +1,23 @@
|
||||
.adf {
|
||||
&-date-widget {
|
||||
/* stylelint-disable-next-line */
|
||||
.mat-form-field-suffix {
|
||||
top: 26px;
|
||||
}
|
||||
|
||||
.mat-form-field-label-wrapper {
|
||||
.adf-label {
|
||||
top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
&-left-label-input-datepicker {
|
||||
|
||||
/* stylelint-disable-next-line */
|
||||
.mat-form-field-suffix {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
/* stylelint-disable-next-line */
|
||||
.mat-form-field-infix {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@@ -8,7 +8,7 @@
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.mat-select-value-text {
|
||||
.adf-select-filter {
|
||||
font-size: var(--theme-body-1-font-size);
|
||||
}
|
||||
|
||||
|
||||
@@ -4,10 +4,6 @@
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
box-shadow: none !important;
|
||||
|
||||
.mat-button-wrapper {
|
||||
display: inline !important;
|
||||
}
|
||||
}
|
||||
|
||||
&-cloud-group-list {
|
||||
|
||||
@@ -2,15 +2,15 @@
|
||||
<span mat-dialog-title id="adf-process-filter-dialog-title">
|
||||
{{ 'ADF_CLOUD_EDIT_PROCESS_FILTER.DIALOG.TITLE' | translate}}
|
||||
</span>
|
||||
<mat-card>
|
||||
<mat-card-content>
|
||||
<mat-card class="adf-process-filter-dialog-card">
|
||||
<mat-card-content class="adf-process-filter-dialog-card-content">
|
||||
<form [formGroup]="filterForm">
|
||||
<mat-form-field class="adf-process-filter-name" [floatLabel]="'auto'">
|
||||
<input matInput placeholder="{{ 'ADF_CLOUD_EDIT_PROCESS_FILTER.FILTER_NAME' | translate }}" formControlName="name" id="adf-filter-name-id">
|
||||
</mat-form-field>
|
||||
</form>
|
||||
</mat-card-content>
|
||||
<mat-card-actions>
|
||||
<mat-card-actions class='adf-process-filter-dialog-actions'>
|
||||
<button mat-button (click)="onSaveClick()" id="adf-save-button-id" [disabled]="!isValid()">
|
||||
{{ 'ADF_CLOUD_EDIT_PROCESS_FILTER.DIALOG.SAVE' | translate}}
|
||||
</button>
|
||||
|
||||
@@ -1,22 +1,17 @@
|
||||
adf-cloud-process-filter-dialog-cloud {
|
||||
.adf-process-filter-dialog .mat-card {
|
||||
padding: 0;
|
||||
box-shadow: none;
|
||||
|
||||
mat-card-actions {
|
||||
display: flex;
|
||||
max-height: 100%;
|
||||
place-content: flex-end;
|
||||
align-items: flex-end;
|
||||
}
|
||||
}
|
||||
|
||||
.adf-process-filter-dialog .mat-card-content {
|
||||
.adf-process-filter-dialog .adf-process-filter-dialog-card {
|
||||
padding: 0;
|
||||
box-shadow: none;
|
||||
|
||||
.adf-process-filter-name {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.adf-process-filter-dialog-actions {
|
||||
display: flex;
|
||||
max-height: 100%;
|
||||
place-content: flex-end;
|
||||
align-items: flex-end;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -19,7 +19,7 @@
|
||||
floatLabel="always"
|
||||
*ngIf="showSelectProcessDropdown"
|
||||
data-automation-id="adf-select-cloud-process-dropdown">
|
||||
<mat-label>{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.TYPE' | translate }}</mat-label>
|
||||
<mat-label class="adf-start-process-input-label">{{ 'ADF_CLOUD_PROCESS_LIST.ADF_CLOUD_START_PROCESS.FORM.LABEL.TYPE' | translate }}</mat-label>
|
||||
<input
|
||||
matInput
|
||||
formControlName="processDefinition"
|
||||
|
||||
@@ -1,10 +1,9 @@
|
||||
.adf {
|
||||
&-start-process {
|
||||
.mat-form-field-label {
|
||||
.adf-start-process-input-label {
|
||||
color: var(--adf-theme-mat-grey-color-a200-dark);
|
||||
}
|
||||
|
||||
mat-card-actions,
|
||||
&-cloud-actions {
|
||||
display: flex;
|
||||
justify-content: flex-end;
|
||||
@@ -35,7 +34,7 @@
|
||||
}
|
||||
|
||||
&-form-container {
|
||||
.mat-card {
|
||||
.adf-form-container-card {
|
||||
box-shadow: none !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
<mat-card>
|
||||
<mat-card-header class="adf-cloud-start-task-heading">
|
||||
<mat-card-title>{{'ADF_CLOUD_TASK_LIST.START_TASK.FORM.TITLE' | translate}}</mat-card-title>
|
||||
<mat-card-title class="adf-cloud-start-task-heading-title">{{'ADF_CLOUD_TASK_LIST.START_TASK.FORM.TITLE' | translate}}</mat-card-title>
|
||||
</mat-card-header>
|
||||
<form [formGroup]="taskForm" (ngSubmit)="saveTask()">
|
||||
|
||||
<mat-card-content>
|
||||
<div class="adf-task-name">
|
||||
<mat-form-field>
|
||||
<mat-form-field class="adf-task-name-form-field">
|
||||
<mat-label>{{'ADF_CLOUD_TASK_LIST.START_TASK.FORM.LABEL.NAME' | translate }}</mat-label>
|
||||
<input
|
||||
matInput
|
||||
@@ -22,7 +22,7 @@
|
||||
</mat-form-field>
|
||||
</div>
|
||||
<div class="adf-cloud-start-task-form-row">
|
||||
<mat-form-field>
|
||||
<mat-form-field class="adf-cloud-start-task-form-row-form-field">
|
||||
<mat-label>{{'ADF_CLOUD_TASK_LIST.START_TASK.FORM.LABEL.DESCRIPTION' | translate}}</mat-label>
|
||||
<textarea
|
||||
matInput
|
||||
@@ -90,6 +90,7 @@
|
||||
<div class="adf-cloud-start-task-footer">
|
||||
<button
|
||||
mat-button
|
||||
class="adf-cloud-start-task-footer-button"
|
||||
type="button"
|
||||
(click)="onCancel()"
|
||||
id="button-cancel">
|
||||
@@ -100,6 +101,7 @@
|
||||
type="submit"
|
||||
[disabled]="!canStartTask()"
|
||||
mat-button
|
||||
class="adf-cloud-start-task-footer-button"
|
||||
id="button-start">
|
||||
{{'ADF_CLOUD_TASK_LIST.START_TASK.FORM.ACTION.START'|translate}}
|
||||
</button>
|
||||
|
||||
@@ -4,7 +4,7 @@
|
||||
border-bottom: 1px solid var(--adf-theme-foreground-divider-color);
|
||||
margin-bottom: 10px;
|
||||
|
||||
.mat-card-title {
|
||||
.adf-cloud-start-task-heading-title {
|
||||
font-weight: bold;
|
||||
font-size: var(--theme-adf-task-title-font-size);
|
||||
}
|
||||
@@ -53,7 +53,7 @@
|
||||
adf-cloud-start-task {
|
||||
.adf {
|
||||
&-cloud-start-task-footer {
|
||||
.mat-button {
|
||||
.adf-cloud-start-task-footer-button {
|
||||
text-transform: uppercase !important;
|
||||
}
|
||||
}
|
||||
@@ -61,7 +61,7 @@ adf-cloud-start-task {
|
||||
&-task-name {
|
||||
display: flex;
|
||||
|
||||
mat-form-field {
|
||||
.adf-task-name-form-field {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
@@ -69,14 +69,14 @@ adf-cloud-start-task {
|
||||
&-cloud-start-task-form-row {
|
||||
display: flex;
|
||||
|
||||
mat-form-field,
|
||||
.adf-cloud-start-task-form-row-form-field,
|
||||
adf-cloud-people,
|
||||
adf-cloud-group,
|
||||
adf-cloud-form-definition-selector {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
mat-form-field,
|
||||
.adf-cloud-start-task-form-row-form-field,
|
||||
adf-cloud-group {
|
||||
margin-right: 20px;
|
||||
|
||||
@@ -88,7 +88,7 @@ adf-cloud-start-task {
|
||||
@include layout-bp(lt-md) {
|
||||
flex-direction: column;
|
||||
|
||||
mat-form-field,
|
||||
.adf-cloud-start-task-form-row-form-field,
|
||||
adf-cloud-group {
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
@@ -2,15 +2,15 @@
|
||||
<span mat-dialog-title id="adf-task-filter-dialog-title">
|
||||
{{ 'ADF_CLOUD_EDIT_TASK_FILTER.DIALOG.TITLE' | translate}}
|
||||
</span>
|
||||
<mat-card>
|
||||
<mat-card-content>
|
||||
<mat-card class="adf-task-filter-dialog-card">
|
||||
<mat-card-content class="adf-task-filter-dialog-card-content">
|
||||
<form [formGroup]="filterForm">
|
||||
<mat-form-field class="adf-task-filter-name" [floatLabel]="'auto'">
|
||||
<input matInput placeholder="{{ 'ADF_CLOUD_EDIT_TASK_FILTER.FILTER_NAME' | translate }}" formControlName="name" id="adf-filter-name-id">
|
||||
</mat-form-field>
|
||||
</form>
|
||||
</mat-card-content>
|
||||
<mat-card-actions>
|
||||
<mat-card-actions class="adf-task-filter-dialog-card-actions">
|
||||
<button mat-button (click)="onSaveClick()" id="adf-save-button-id" [disabled]="!isValid()">
|
||||
{{ 'ADF_CLOUD_EDIT_TASK_FILTER.DIALOG.SAVE' | translate}}
|
||||
</button>
|
||||
|
||||
@@ -1,22 +1,24 @@
|
||||
adf-cloud-task-filter-dialog {
|
||||
.adf-task-filter-dialog .mat-card {
|
||||
padding: 0;
|
||||
box-shadow: none;
|
||||
.adf-task-filter-dialog {
|
||||
.adf-task-filter-dialog-card {
|
||||
padding: 0;
|
||||
box-shadow: none;
|
||||
|
||||
mat-card-actions {
|
||||
display: flex;
|
||||
max-height: 100%;
|
||||
place-content: flex-end;
|
||||
align-items: flex-end;
|
||||
.adf-task-filter-dialog-card-actions {
|
||||
display: flex;
|
||||
max-height: 100%;
|
||||
place-content: flex-end;
|
||||
align-items: flex-end;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.adf-task-filter-dialog .mat-card-content {
|
||||
padding: 0;
|
||||
box-shadow: none;
|
||||
.adf-task-filter-dialog-card-content {
|
||||
padding: 0;
|
||||
box-shadow: none;
|
||||
|
||||
.adf-task-filter-name {
|
||||
flex: 1;
|
||||
.adf-task-filter-name {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -8,23 +8,23 @@
|
||||
padding-bottom: 25px !important;
|
||||
padding-right: 25px !important;
|
||||
|
||||
& .mat-button {
|
||||
& .adf-task-form-actions-button {
|
||||
height: 36px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
& .mat-button-wrapper {
|
||||
width: 58px;
|
||||
height: 20px;
|
||||
opacity: 0.54;
|
||||
font-size: var(--theme-body-2-font-size);
|
||||
font-weight: bold;
|
||||
span {
|
||||
width: 58px;
|
||||
height: 20px;
|
||||
opacity: 0.54;
|
||||
font-size: var(--theme-body-2-font-size);
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
adf-cloud-task-form {
|
||||
mat-spinner {
|
||||
.adf-task-form-spinner {
|
||||
display: flex !important;
|
||||
justify-content: center !important;
|
||||
align-items: center !important;
|
||||
|
||||
Reference in New Issue
Block a user