MD3 migration fixes (#11919)

* [ACS-10449] Viewer MD3 fixes

* [ACS-10449] Autocomplete chip MD3 fix

* [ACS-10449] Tabs MD3 fixes

* [ACS-10449] Fix badge sizing

* [ACS-10449] Login page error fix

* [ACS-10449] Fix overlapping options on text next to selectbox

* [ACS-10449] ADF style fixes refactoring I

* [ACS-10449] Breadcrumb and search filter container fixes

* [ACS-10449] User column form field fixes

* [ACS-10449] adapt scroll into view to changes in MD3

* [ACS-10449] Properties panel opened by default

* [ACS-10449] Tag creator fixes

* [ACS-10449] fix metadata property label color

* [ACS-10449] Categories panel fixes

* [ACS-10449] Current aspect on changes fix

* [ACS-10449] Make notification history badge size configurable

* [ACS-10449] Make notification history badge size configurable via config file

---------

Co-authored-by: Aleksander Sklorz <Aleksander.Sklorz@hyland.com>
Co-authored-by: g-jaskowski <grzegorz.jaskowski@hyland.com>
This commit is contained in:
Michal Kinas
2026-05-29 13:16:03 +02:00
committed by GitHub
co-authored by Aleksander Sklorz g-jaskowski
parent 1314f0751f
commit cfdd3f9c50
24 changed files with 78 additions and 37 deletions
@@ -81,7 +81,6 @@ $dialog-list-height: calc(65vh - ($dialog-title-height + $dialog-information-hei
.adf-aspect-property-table-column-title,
.adf-aspect-property-table-column-data-type {
font: var(--mat-sys-body-small);
color: var(--mat-sys-on-secondary-container);
}
.adf-aspect-property-table-column {
@@ -67,12 +67,12 @@
padding-right: 2px;
overflow: hidden;
display: flex;
align-items: center;
font: var(--mat-sys-body-medium);
text-align: left;
color: var(--mat-sys-on-secondary-container);
flex: 0 1 auto;
min-width: 35px;
margin-top: auto;
text-overflow: ellipsis;
&.adf-active {
@@ -96,5 +96,6 @@ $dropdown-horizontal-offset: 30px;
}
#{ms.$cdk-overlay-pane}:has(> .adf-breadcrumb-dropdown-panel) {
margin-top: 12px;
min-width: fit-content;
}
@@ -11,6 +11,7 @@
justify-content: space-between;
align-items: center;
word-break: break-word;
font: var(--mat-sys-body-medium);
}
.adf-categories-padded {
@@ -124,7 +124,7 @@ export class CategoriesManagementComponent implements OnInit, OnDestroy {
this._categoryNameControlVisible = categoryNameControlVisible;
if (categoryNameControlVisible) {
setTimeout(() => {
this.categoryNameInputElement.nativeElement.scrollIntoView();
this.categoryNameInputElement.nativeElement.scrollIntoView({ block: 'nearest' });
});
this._existingCategoriesPanelVisible = true;
} else {
@@ -98,7 +98,7 @@
</div>
</adf-content-metadata-header>
</mat-expansion-panel-header>
<div *ngIf="currentPanel.panelTitle === DefaultPanels.TAGS && editedPanelTitle !== DefaultPanels.TAGS"
<div *ngIf="currentPanel.panelTitle === DefaultPanels.TAGS && editedPanelTitle !== DefaultPanels.TAGS && !showEmptyTagMessage"
class="adf-metadata-properties-tags">
<adf-dynamic-chip-list [chips]="tagsToDisplay" [showDelete]="false" />
</div>
@@ -18,6 +18,11 @@ $panel-properties-height: 56px !default;
height: $panel-properties-height;
}
.adf-metadata-categories-header {
display: block;
margin-top: 16px;
}
.adf-edit-icon-buttons {
color: var(--mat-sys-on-secondary-container);
}
@@ -208,7 +208,7 @@ export class ContentMetadataComponent implements OnChanges, OnInit {
this.loadProperties(this.node);
this.verifyAllowableOperations();
this.currentPanel.panelTitle = this.displayAspect ?? this.DefaultPanels.PROPERTIES;
this.currentPanel.panelTitle = this.displayAspect && this.displayAspect !== '' ? this.displayAspect : this.DefaultPanels.PROPERTIES;
this.currentPanel.expanded = true;
}
@@ -277,7 +277,7 @@ export class ContentMetadataComponent implements OnChanges, OnInit {
this.loadProperties(this.node);
}
if (changes.displayAspect?.currentValue) {
if (changes.displayAspect?.currentValue && changes.displayAspect.currentValue !== '') {
this.currentPanel.panelTitle = changes.displayAspect.currentValue;
this.currentPanel.expanded = true;
}
@@ -18,10 +18,6 @@
width: 100%;
justify-content: unset;
}
&-add-member-action {
padding: 0 15px;
}
}
.adf-new-permission-table {
@@ -1,4 +1,4 @@
$search-result-height: calc(100% - 60px);
$search-result-height: calc(100% - 80px);
.adf {
&-permission-result-list {
@@ -3,9 +3,5 @@
.adf-role-selector-field#{ms.$mat-form-field} {
width: 100%;
max-width: 200px;
height: 40px;
#{ms.$mat-form-field-infix}:not(:disabled) {
padding-top: 8px;
}
padding: 5px 0;
}
@@ -31,12 +31,12 @@ adf-search-chip-autocomplete-input {
}
.adf-option-chips-delete-button.adf-autocomplete-added-option-chips-delete-button {
font: var(--mat-sys-body-small);
font-size: var(--mat-sys-body-small-size);
height: var(--mat-sys-body-small-size);
width: var(--mat-sys-body-small-size);
.adf-option-chips-delete-icon.adf-autocomplete-added-option-chips-delete-icon {
font: var(--mat-sys-body-small);
font-size: var(--mat-sys-body-small-size);
height: var(--mat-sys-body-small-size);
width: var(--mat-sys-body-small-size);
}
@@ -55,6 +55,7 @@
.adf-search-checklist {
margin: 4px 0 0 16px;
padding: 0;
}
.adf-filter-actions {
@@ -14,7 +14,7 @@ adf-tags-creator {
}
.adf-tag-name-field {
margin-top: 10px;
margin-top: 16px;
}
.adf-create-tag-label {
@@ -26,6 +26,7 @@ adf-tags-creator {
display: inline-block;
padding-right: 12px;
overflow: auto;
font: var(--mat-sys-body-medium);
}
.adf-tags-list {
@@ -42,7 +43,7 @@ adf-tags-creator {
width: 100%;
.adf-existing-tags-label {
font-size: 10px;
font: var(--mat-sys-body-small);
color: var(--mat-sys-on-surface-variant);
padding-left: 12px;
margin-bottom: 2px;
@@ -129,7 +129,7 @@ export class TagsCreatorComponent implements OnInit, OnDestroy {
if (tagNameControlVisible) {
this._existingTagsPanelVisible = true;
setTimeout(() => {
this.tagNameInputElement?.nativeElement?.scrollIntoView();
this.tagNameInputElement?.nativeElement?.scrollIntoView({ block: 'nearest' });
});
} else {
this._existingTagsPanelVisible = false;