[ACS-6140] - Remove references to internal Angular Material CSS classes (#3620)

This commit is contained in:
DominikIwanek
2024-02-13 13:22:57 +01:00
committed by GitHub
parent 8e567cd483
commit 184ad17baf
25 changed files with 88 additions and 90 deletions

View File

@@ -12,7 +12,7 @@
<img class="aca-details-breadcrumb-icon" alt="{{ 'APP.INFO_DRAWER.ICON' | translate }}" src="{{ nodeIcon }}">
{{ node.name }} </span>
</div>
<div class="acs-details-buttons">
<div class="aca-details-buttons">
<aca-toolbar [items]="aspectActions" info-drawer-buttons></aca-toolbar>
<button
class="aca-close-details-button"

View File

@@ -1,5 +1,5 @@
app-details-manager {
.acs-details-buttons {
.aca-details-buttons {
display: flex;
.aca-close-details-button {
@@ -26,21 +26,19 @@ app-details-manager {
margin-top: 40px;
height: calc(100% - 136px);
.mat-tab-body-wrapper {
> div {
height: 100%;
}
.mat-tab-list {
margin-left: 50px;
.mat-tab-labels {
.mat-tab-label {
padding: 0 12px;
min-width: 95px;
letter-spacing: 0.25px;
height: 32px;
}
div[role='tab'] {
&:first-of-type {
margin-left: 50px;
}
padding: 0 12px;
min-width: 95px;
letter-spacing: 0.25px;
height: 32px;
}
}

View File

@@ -6,7 +6,7 @@
(click)="searchSubmit(searchTerm)"
[title]="'SEARCH.BUTTON.TOOLTIP' | translate"
>
<mat-icon class="app-search-button-icon" [attr.aria-label]="'SEARCH.BUTTON.ARIA-LABEL' | translate">search</mat-icon>
<mat-icon class="app-search-input-control-icon app-search-button-icon" [attr.aria-label]="'SEARCH.BUTTON.ARIA-LABEL' | translate">search</mat-icon>
</button>
<mat-form-field class="app-input-form-field" [floatLabel]="'never'">
<input
@@ -23,7 +23,7 @@
autocomplete="off"
/>
<div matSuffix class="app-suffix-search-icon-wrapper">
<mat-icon *ngIf="searchTerm.length" (click)="clear()" class="app-clear-icon">clear</mat-icon>
<mat-icon *ngIf="searchTerm.length" (click)="clear()" class="app-search-input-control-icon app-clear-icon">clear</mat-icon>
</div>
</mat-form-field>
</div>

View File

@@ -5,7 +5,7 @@ $top-margin: 12px;
margin: 14px 1px;
float: left;
mat-icon {
.app-search-input-control-icon {
font-size: 24px;
cursor: pointer;
}
@@ -24,16 +24,13 @@ $top-margin: 12px;
box-sizing: border-box;
margin-bottom: 12px;
/* stylelint-disable-next-line selector-class-pattern */
.mat-form-field-underline {
display: none;
}
.mat-form-field-label-wrapper {
label {
cursor: text;
}
// fixes pointer event on FF
&.app-search-menu-trigger .mat-form-field-label-wrapper {
pointer-events: auto;
}

View File

@@ -78,24 +78,26 @@ $top-margin: 12px;
letter-spacing: -0.7px;
margin-bottom: -8px;
.app-search-options-checkbox label {
max-width: 155px;
}
&-checkbox {
padding: 3px 24px 3px 19px;
/* stylelint-disable-next-line selector-class-pattern */
.mat-checkbox-inner-container {
height: 18px;
width: 18px;
}
.mat-checkbox-label {
/* stylelint-disable-next-line no-descending-specificity */
label {
padding: 0 0 0 11px;
overflow: hidden;
text-overflow: ellipsis;
}
}
.app-search-options-checkbox label {
max-width: 155px;
}
}
.app-search-hint {
@@ -122,17 +124,17 @@ $top-margin: 12px;
#search-options {
padding-left: 20px;
mat-checkbox {
padding: 3px 20px 3px 0;
.mat-checkbox-label {
padding: 0;
}
}
label {
max-width: 105px;
}
.app-search-options-checkbox {
padding: 3px 20px 3px 0;
label {
padding: 0;
}
}
}
}

View File

@@ -45,10 +45,10 @@ aca-search-results {
color: var(--theme-search-chip-icon-color);
}
mat-icon {
color: var(--theme-search-chip-icon-color);
}
.adf-search-filter-chip-icon {
color: var(--theme-search-chip-icon-color);
}
}
.adf-search-filter-placeholder {
color: var(--theme-selected-text-color);

View File

@@ -27,7 +27,7 @@
(click)="onSaveGeneralData(profileForm)">{{'APP.EDIT_PROFILE.SAVE' | translate}}</button>
</div>
</div>
<mat-divider class="app-mat-divider" *ngIf="generalSectionDropdown"></mat-divider>
<mat-divider class="app-divider" *ngIf="generalSectionDropdown"></mat-divider>
<div *ngIf="generalSectionDropdown">
<div class="app-general-dropdown">
<div class="app-general-dropdown-details">
@@ -96,7 +96,7 @@
(click)="onSaveCompanyData(profileForm)">{{'APP.EDIT_PROFILE.SAVE' | translate}}</button>
</div>
</div>
<mat-divider class="app-mat-divider" *ngIf="contactSectionDropdown"></mat-divider>
<mat-divider class="app-divider" *ngIf="contactSectionDropdown"></mat-divider>
<div *ngIf="contactSectionDropdown">
<div class="app-general-dropdown">
<div class="app-general-dropdown-details">

View File

@@ -75,7 +75,7 @@ app-view-profile {
text-align: end;
}
.app-mat-divider {
.app-divider {
border-top-width: 2px;
border-top-color: var(--theme-grey-background-color);
padding-left: -1px;