AAE-34493 Improved internal mat-selectors (#10829)

This commit is contained in:
Denys Vuika
2025-04-28 11:17:36 -04:00
committed by GitHub
parent dc35ef8a6f
commit b1113c51a7
104 changed files with 1131 additions and 544 deletions

View File

@@ -1,9 +1,9 @@
@import 'styles/mat-selectors';
@use '../mat-selectors.scss' as ms;
adf-aspect-list-dialog {
display: block;
#{$mat-expansion-panel-body} {
#{ms.$mat-expansion-panel-body} {
margin-top: -2px;
}
}
@@ -35,7 +35,7 @@ adf-aspect-list-dialog {
padding-right: 4px;
padding-top: 0;
#{$mat-dialog-content} {
#{ms.$mat-dialog-content} {
padding: 0;
}

View File

@@ -1,4 +1,5 @@
@import 'styles/mat-selectors';
@use '../mat-selectors.scss' as ms;
$dialog-title-height: 100px;
$dialog-information-height: 44px;
$dialog-buttons-height: 68px;
@@ -49,7 +50,7 @@ $dialog-list-height: calc(65vh - ($dialog-title-height + $dialog-information-hei
box-shadow: none;
background: border-box;
#{$mat-checkbox-background} {
#{ms.$mat-checkbox-background} {
height: 16px;
width: 16px;
}

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../mat-selectors.scss' as ms;
$dropdown-horizontal-offset: 30px;
@@ -98,6 +98,6 @@ $dropdown-horizontal-offset: 30px;
}
}
#{$cdk-overlay-pane}:has(>.adf-breadcrumb-dropdown-panel){
#{ms.$cdk-overlay-pane}:has(> .adf-breadcrumb-dropdown-panel) {
min-width: fit-content;
}

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../../mat-selectors.scss' as ms;
.adf-categories-management {
.adf-category-name-field {
@@ -20,7 +20,7 @@
box-sizing: content-box;
}
#{$mat-form-field-error} {
#{ms.$mat-form-field-error} {
padding-top: 5px;
}
}
@@ -56,7 +56,7 @@
background-color: inherit;
color: inherit;
&:not(#{$mat-list-item-disabled}):hover {
&:not(#{ms.$mat-list-item-disabled}):hover {
cursor: pointer;
background: var(--adf-theme-mat-grey-color-a200);
}
@@ -86,7 +86,7 @@
overflow-wrap: anywhere;
}
#{$mat-list-item-disabled} #{$mat-list-item-primary-text} {
#{ms.$mat-list-item-disabled} #{ms.$mat-list-item-primary-text} {
opacity: 1;
}
}

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
$panel-properties-height: 56px !default;
@@ -11,11 +11,11 @@ $panel-properties-height: 56px !default;
margin: 12px;
adf-card-view-textitem {
#{$mat-form-field-subscript-wrapper} {
#{ms.$mat-form-field-subscript-wrapper} {
display: none;
}
#{$mat-form-field-infix} {
#{ms.$mat-form-field-infix} {
padding-bottom: 0;
}
}
@@ -47,7 +47,7 @@ $panel-properties-height: 56px !default;
}
}
#{$mat-expansion-panel-body} {
#{ms.$mat-expansion-panel-body} {
padding-top: 16px;
input {
@@ -64,7 +64,7 @@ $panel-properties-height: 56px !default;
color: var(--adf-theme-foreground-text-color-054);
}
#{$mat-chip} {
#{ms.$mat-chip} {
&.metadata-properties-tag-chip {
// TODO: bug open https://github.com/angular/components/issues/26584
/* stylelint-disable selector-class-pattern */

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../../mat-selectors.scss' as ms;
/* stylelint-disable no-descending-specificity */
$content-node-selector-thumbnail-width: 35px !default;
@@ -15,8 +15,8 @@ h2.adf-search-results-label {
color: var(--adf-theme-foreground-text-color-087);
}
#{$mdc-dialog} {
#{$mat-dialog-surface}:is(div) {
#{ms.$mdc-dialog} {
#{ms.$mat-dialog-surface}:is(div) {
padding-bottom: 0;
}
}
@@ -41,17 +41,17 @@ h2.adf-search-results-label {
}
&-content {
#{$mat-input-element} {
#{ms.$mat-input-element} {
&:focus::placeholder {
color: var(--theme-primary-color);
}
}
#{$mat-form-field-wrapper} {
#{$mat-form-field-flex} {
#{ms.$mat-form-field-wrapper} {
#{ms.$mat-form-field-flex} {
align-items: center;
#{$mat-form-field-infix} {
#{ms.$mat-form-field-infix} {
padding-bottom: 0;
}
}
@@ -59,13 +59,13 @@ h2.adf-search-results-label {
.adf-sites-dropdown-form-field {
label {
&#{$mat-form-field-label} {
&#{ms.$mat-form-field-label} {
top: 32px;
}
}
}
#{$mat-form-field-subscript-wrapper} {
#{ms.$mat-form-field-subscript-wrapper} {
height: 16px;
}
@@ -88,7 +88,7 @@ h2.adf-search-results-label {
}
}
#{$mat-form-field-subscript-wrapper} {
#{ms.$mat-form-field-subscript-wrapper} {
display: none;
}
}

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../mat-selectors.scss' as ms;
adf-content-node-selector {
.adf-upload-dialog {
@@ -42,7 +42,7 @@ adf-content-node-selector {
}
.adf-content-node-selector-dialog {
#{$mat-form-field} {
#{ms.$mat-form-field} {
width: 100%;
}
@@ -50,7 +50,7 @@ adf-content-node-selector {
color: var(--adf-theme-foreground-base-color-045);
}
#{$mat-dialog-title} {
#{ms.$mat-dialog-title} {
margin-bottom: 0;
padding: 0;

View File

@@ -1,8 +1,8 @@
@import 'styles/mat-selectors';
@use '../mat-selectors.scss' as ms;
.adf-share-link-dialog {
.adf-share-link {
#{$mat-form-field-flex} {
#{ms.$mat-form-field-flex} {
height: 48px;
}
@@ -35,7 +35,7 @@
&__form {
padding-top: 8px;
#{$mat-form-field-infix}:has(.adf-share-link__input) {
#{ms.$mat-form-field-infix}:has(.adf-share-link__input) {
border-top: 0.9375em solid transparent;
border-bottom: 0.9375em solid transparent;
height: 16px;

View File

@@ -1,21 +1,21 @@
@import 'styles/mat-selectors';
@use '../../mat-selectors.scss' as ms;
.adf-folder-dialog {
.adf-folder-dialog-content {
padding: 0;
overflow: unset;
#{$mat-form-field-infix} {
#{ms.$mat-form-field-infix} {
padding-bottom: 3.5px;
}
#{$mat-form-field-hide-placeholder} {
#{$mat-floating-label} {
#{ms.$mat-form-field-hide-placeholder} {
#{ms.$mat-floating-label} {
padding-top: 20px;
}
}
#{$mat-form-field-hint-wrapper} {
#{ms.$mat-form-field-hint-wrapper} {
padding-left: 0;
margin-left: -2px;
color: var(--adf-theme-foreground-secondary-text-color);

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../../mat-selectors.scss' as ms;
.adf-library-dialog {
.adf-library-dialog-content {
@@ -28,34 +28,34 @@
padding-top: 4.5px;
}
#{$mat-floating-label} {
#{ms.$mat-floating-label} {
-webkit-font-smoothing: subpixel-antialiased;
}
&#{$mat-form-field-hide-placeholder} {
#{$mat-floating-label} {
&#{ms.$mat-form-field-hide-placeholder} {
#{ms.$mat-floating-label} {
padding-top: 20px;
}
}
&-description {
&#{$mat-form-field-hide-placeholder} {
#{$mat-floating-label} {
&#{ms.$mat-form-field-hide-placeholder} {
#{ms.$mat-floating-label} {
padding-top: 20px;
}
}
}
#{$mat-form-field-infix} {
#{ms.$mat-form-field-infix} {
padding-bottom: 3.5px;
}
#{$mat-form-field-error-wrapper} {
#{ms.$mat-form-field-error-wrapper} {
margin-left: -2px;
font-size: 10.5px;
-webkit-font-smoothing: subpixel-antialiased;
#{$mat-form-field-error} {
#{ms.$mat-form-field-error} {
height: 13.125px;
}
}

View File

@@ -1,4 +1,4 @@
@import 'styles/flex';
@use '../../flex' as flex;
.adf-document-list {
min-height: 0;
@@ -143,7 +143,7 @@
word-break: break-all;
white-space: pre-line;
@include layout-bp(lt-sm) {
@include flex.layout-bp(lt-sm) {
font-size: 48px;
}
}
@@ -165,12 +165,12 @@
object-fit: contain;
margin-top: 17px;
@include layout-bp(lt-sm) {
@include flex.layout-bp(lt-sm) {
width: 250px;
}
}
@include layout-bp(lt-md) {
@include flex.layout-bp(lt-md) {
&-drag-drop,
&-any-files-here-to-add {
display: none;

View File

@@ -0,0 +1,81 @@
@charset "UTF-8";
/* stylelint-disable */
// Non-overlapping Material Design breakpoints
// @type map
$breakpoints: (
xs: (
begin: 0,
end: 599.9px
),
sm: (
begin: 600px,
end: 959.9px
),
md: (
begin: 960px,
end: 1279.9px
),
lg: (
begin: 1280px,
end: 1919.9px
),
xl: (
begin: 1920px,
end: 4999.99px
)
) !default;
// Overlapping breakpoints that are greater than defined
// Material Design breakpoints
// @type map
$overlapping-gt: (
gt-xs: 600px,
gt-sm: 960px,
gt-md: 1280px,
gt-lg: 1920px
) !default;
// Overlapping breakpoints that are less than defined
// Material Design breakpoints
// @type map
$overlapping-lt: (
lt-sm: 599.9px,
lt-md: 959.9px,
lt-lg: 1279.9px,
lt-xl: 1919.9px
) !default;
// Media Query Mixin, takes a breakpoint and returns a wrapping
// media query statement
// e.g.
//
// @include layout-bp(xs) {
// background-color: red;
// }
//
// becomes
//
// @media (min-width: 0px) and (max-width: 599px) {
// background-color: red;
// }
@mixin layout-bp($bp) {
@if map-has-key($breakpoints, $bp) {
$min: map-get(map-get($breakpoints, $bp), begin);
$max: map-get(map-get($breakpoints, $bp), end);
@media (min-width: $min) and (max-width: $max) {
@content;
}
} @else if map-has-key($overlapping-gt, $bp) {
$min: map-get($overlapping-gt, $bp);
@media (min-width: $min) {
@content;
}
} @else if map-has-key($overlapping-lt, $bp) {
$max: map-get($overlapping-lt, $bp);
@media (max-width: $max) {
@content;
}
}
}
/* stylelint-enable */

View File

@@ -0,0 +1,190 @@
/* Variables in this file are used in the Angular Material library. Do not modify them unless you know what you are doing. */
$material-icons: '.material-icons';
$mat-icon: '.mat-icon';
$mat-icon-button: '.mat-mdc-icon-button';
$mat-icon-button-hover: '.mdc-icon-button__ripple';
$mat-accent: '.mat-accent';
$mat-focused: '.mat-focused';
$mat-line: '.mat-line';
$mat-tab-label: '.mat-mdc-tab';
$mat-tab-label-active: '.mdc-tab--active';
$mat-tab-label-content: '.mdc-tab__content';
$mat-tab-label-container: '.mat-mdc-tab-label-container';
$mat-expansion-panel-body: '.mat-expansion-panel-body';
$mat-tab-label-text: '.mdc-tab__text-label';
$mat-tab-list: '.mat-mdc-tab-list';
$mat-tab-body: '.mat-mdc-tab-body';
$mat-tab-body-wrapper: '.mat-mdc-tab-body-wrapper';
$mat-tab-body-content: '.mat-mdc-tab-body-content';
$mat-tab-header: '.mat-mdc-tab-header';
$mat-tab-labels: '.mat-mdc-tab-labels';
$mat-tab-ink-bar: '.mdc-tab-indicator';
$mat-chip: '.mat-mdc-chip';
$mat-chip-list: '.mat-mdc-chip-list';
$mat-chip-list-wrapper: '.mat-chip-list-wrapper';
$mat-checkbox: '.mat-mdc-checkbox';
$mat-checkbox-box: '.mdc-checkbox';
$mat-checkbox-frame: '.mdc-checkbox__checkmark';
$mat-checkbox-label: '.mdc-label';
$mat-checkbox-checked: '.mat-mdc-checkbox-checked';
$mat-button: '.mat-mdc-button';
$mat-button-label: '.mdc-button__label';
$mat-button-label-text: '.mdc-button__label';
$mat-radio-checked: '.mat-mdc-radio-checked';
$mat-radio-label: '.mdc-label';
$mat-progress-bar: '.mat-mdc-progress-bar';
$mat-progress-spinner: '.mat-mdc-progress-spinner';
$mat-form-field: '.mat-mdc-form-field';
$mat-form-field-flex: '.mat-mdc-form-field-flex';
$mat-form-field-outline: '.mat-mdc-form-field-outline';
$mat-form-field-wrapper: '.mat-mdc-text-field-wrapper';
$mat-line-ripple: '.mdc-line-ripple';
$mat-form-field-subscript-wrapper: '.mat-mdc-form-field-subscript-wrapper';
$mat-form-field-prefix: '.mat-mdc-form-field-text-prefix';
$mat-form-field-suffix: '.mat-mdc-form-field-text-suffix';
$mat-form-text-field-infix: '.mat-mdc-form-text-infix';
$mat-form-field-label: '.mat-mdc-floating-label';
$mat-form-field-invalid: '.mat-form-field-invalid';
$mat-form-field-appearance-outline: '.mat-form-field-appearance-outline';
$mat-text-field-outlined: '.mdc-text-field--outlined';
$mat-text-field-outlined-thick: '.mdc-text-field--outlined-thick';
$mat-text-field-focused: '.mdc-text-field--focused';
$mat-dialog-actions: '.mat-mdc-dialog-actions';
$mat-dialog-container: '.mdc-dialog__container';
$mat-dialog-content: '.mat-mdc-dialog-content';
$mat-button-toggle: '.mat-button-toggle';
$mat-button-toggle-checked: '.mat-button-toggle-checked';
$mat-button-touch-target: '.mat-mdc-button-touch-target';
$mat-input-element: '.mat-mdc-input-element';
$mat-card: '.mat-mdc-card';
$mat-card-actions: '.mat-mdc-card-actions';
$mat-card-header-text: '.mat-mdc-card-header-text';
$mat-card-title: '.mat-mdc-card-title';
$mat-card-content: '.mat-mdc-card-content';
$mat-mini-fab: '.mat-mdc-mini-fab';
$mat-list-item-primary-text: '.mdc-list-item__primary-text';
$mat-list-item-end: '.mdc-list-item__end';
$mat-table: '.mat-mdc-table';
$mat-header-row: '.mat-mdc-header-row';
$mat-row: '.mat-mdc-row';
$mat-select: '.mat-mdc-select';
$mat-select-value: '.mat-select-value';
$mat-select-value-text: '.mat-mdc-select-value-text';
$mat-select-panel: '.mat-mdc-select-panel';
$mat-grid-tile: '.mat-grid-tile';
$mat-sidenav-content: '.mat-sidenav-content';
$mat-drawer-transition: '.mat-drawer-transition';
$mat-drawer-content: '.mat-drawer-content';
$mat-subheader: '.mat-mdc-subheader';
$mat-menu-panel: '.mat-mdc-menu-panel';
$mat-menu-content: '.mat-mdc-menu-content';
$mat-expansion-panel: '.mat-expansion-panel';
$mat-expansion-panel-header: '.mat-expansion-panel-header';
$mat-expanded: '.mat-expanded';
$mat-calendar: '.mat-calendar';
$mat-calendar-header: '.mat-calendar-header';
$mat-calendar-content: '.mat-calendar-content';
$mat-calendar-table-header: '.mat-calendar-table-header';
$mat-calendar-body-disabled: '.mat-calendar-body-disabled';
$mat-toolbar: '.mat-toolbar';
$mat-slide-toggle: '.mat-mdc-slide-toggle';
$mat-list-item-content: '.mdc-list-item__content';
$mat-list-item-unscoped-content: '.mat-mdc-list-item-unscoped-content';
$mat-text-field-no-label: '.mdc-text-field--no-label';
$mat-form-field-infix: '.mat-mdc-form-field-infix';
$mat-form-field-hide-placeholder: '.mat-form-field-hide-placeholder';
$mat-form-field-hint-wrapper: '.mat-mdc-form-field-hint-wrapper';
$mat-form-field-error-wrapper: '.mat-mdc-form-field-error-wrapper';
$mat-form-field-error: '.mat-mdc-form-field-error';
$mat-checkbox-background: '.mdc-checkbox__background';
$mat-dialog-content: '.mdc-dialog__content';
$mat-floating-label: '.mdc-floating-label';
$mat-floating-label-above: '.mdc-floating-label--float-above';
$mat-select-arrow-wrapper: '.mat-mdc-select-arrow-wrapper';
$mat-dialog-title: '.mdc-dialog__title';
$mat-expansion-panel-body: '.mat-expansion-panel-body';
$mat-dialog-surface: '.mat-mdc-dialog-surface';
$mdc-dialog: '.mdc-dialog';
$mat-text-filed-input: '.mdc-text-field__input';
$mat-floating-label-float-above: '.mdc-floating-label--float-above';
$mat-floating-label-required: '.mdc-floating-label--required';
$mat-evolution-chip: '.mdc-evolution-chip';
$mat-standard-chip: '.mat-mdc-standard-chip';
$mat-evolution-chip-action: '.mdc-evolution-chip__action';
$mat-evolution-chip-text-label: '.mdc-evolution-chip__text-label';
$mat-notched-outline: '.mdc-notched-outline';
$mat-evolution-chip-graphic: '.mdc-evolution-chip__graphic';
$mat-select-trigger: '.mat-mdc-select-trigger';
$mat-select-arrow: '.mat-mdc-select-arrow';
$mat-notched-outline-leading: '.mdc-notched-outline__leading';
$mat-notched-outline-trailing: '.mdc-notched-outline__trailing';
$mat-notched-outline-notch: '.mdc-notched-outline__notch';
$mat-evolution-chip-set: '.mdc-evolution-chip-set';
$mat-mdc-button: '.mdc-button';
$mat-outlined-button: '.mat-mdc-outlined-button';
$mat-button-base: '.mat-mdc-button-base';
$mat-button-touch-target: '.mat-mdc-button-touch-target';
$mat-evolution-chip-text-label: '.mdc-evolution-chip__text-label';
$cdk-overlay-pane: '.cdk-overlay-pane';
$cdk-drag-preview: '.cdk-drag-preview';
$mat-snackbar: '.mdc-snackbar';
$mat-snack-bar-container: '.mat-mdc-snack-bar-container';
$mat-snackbar-label: '.mdc-snackbar__label';
$mat-datetimepicker-dialog: '.mat-datetimepicker-dialog';
$mat-tab-indicator-underline: '.mdc-tab-indicator__content--underline';
$mat-autocomplete-panel: '.mat-mdc-autocomplete-panel';
$mat-menu-surface: '.mdc-menu-surface';
$mat-text-field-filled: '.mdc-text-field--filled';
$mat-text-field-disabled: '.mdc-text-field--disabled';
$mat-form-field-focus-overlay: '.mat-mdc-form-field-focus-overlay';
$mat-form-field-error-wrapper: '.mat-mdc-form-field-error-wrapper';
$mat-text-field-textarea: '.mdc-text-field--textarea';
$mat-list-item-disabled: '.mdc-list-item--disabled';
$mat-chip-focus-overlay: '.mat-mdc-chip-focus-overlay';
$mat-primary: '.mat-primary';
$mat-checkbox-touch-target: '.mat-mdc-checkbox-touch-target';
$mat-switch: '.mdc-switch';
$mat-switch-ripple: '.mdc-switch-ripple';
$mat-switch-selected: '.mdc-switch--selected';
$mat-switch-checked: '.mdc-switch--checked';
$mat-switch-handle-track: '.mdc-switch__handle-track';
$mat-switch-handle: '.mdc-switch__handle';
$mat-switch-track: '.mdc-switch__track';
$mat-switch-icons: '.mdc-switch__icons';
$mat-switch-shadow: '.mdc-switch__shadow';
$mat-switch-unselected: '.mdc-switch--unselected';
$mat-chip-action: '.mat-mdc-chip-action';
$mat-chip-graphic: '.mat-mdc-chip-graphic';
$mat-data-table-row: '.mdc-data-table__row';
$mat-data-table-cell: '.mdc-data-table__cell';
$mat-data-table-header-cell: '.mdc-data-table__header-cell';
$mat-toolbar-single-row: '.mat-toolbar-single-row';
$mat-toolbar-multiple-row: '.mat-toolbar-multiple-row';
$mat-unthemed: '.mat-unthemed';
$mat-calendar-period-button: '.mat-calendar-period-button';
$mat-radio-button: '.mat-mdc-radio-button';
$mat-radio: '.mdc-radio';
$mat-tab-ripple: '.mdc-tab__ripple';
$mat-tab-disabled: '.mat-mdc-tab-disabled';
$mat-tab-group: '.mat-mdc-tab-group';
$mat-tab-group-stretch: '.mat-mdc-tab-group-stretch-tabs';
$mat-list-item: '.mdc-list-item';
$mat-menu-item: '.mat-mdc-menu-item';
$mat-icon-no-color: '.mat-icon-no-color';
$mat-submenu-icon: '.mat-menu-submenu-icon';
$mat-mdc-submenu-icon: '.mat-mdc-menu-submenu-icon';
$mdc-form-field: '.mdc-form-field';
$mat-divider-horizontal: '.mat-divider-horizontal';
$mat-accordion: '.mat-accordion';
$mdc-list: '.mdc-list';
$mat-form-field-icon-suffix: '.mat-mdc-form-field-icon-suffix';
$mat-text-field: '.mdc-text-field';
$mat-form-field-disabled: '.mat-form-field-disabled';
$mat-select-disabled: '.mat-mdc-select-disabled';
$mat-select-value: '.mat-mdc-select-value';
$mat-checkbox-native-control: '.mdc-checkbox__native-control';
$mat-checkbox-selected: '.mdc-checkbox--selected';
$mat-checkbox-ripple: '.mat-mdc-checkbox-ripple';
$mat-list-base: '.mat-mdc-list-base';
$mat-card-header: '.mat-mdc-card-header';

View File

@@ -1,7 +1,7 @@
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
#{$mdc-dialog} {
#{$mat-dialog-surface}:is(div) {
#{ms.$mdc-dialog} {
#{ms.$mat-dialog-surface}:is(div) {
padding-bottom: 0;
}
}
@@ -31,11 +31,11 @@
width: 100%;
justify-content: unset;
#{$mat-button-label} {
#{ms.$mat-button-label} {
padding-right: 0;
}
#{$mat-icon} {
#{ms.$mat-icon} {
font-size: 24px;
width: 24px;
height: 24px;

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
$search-result-height: calc(100% - 60px);
@@ -9,7 +9,7 @@ $search-result-height: calc(100% - 60px);
overflow: auto;
border: 2px solid var(--adf-theme-foreground-text-color-007);
#{$mat-list-item-end} {
#{ms.$mat-list-item-end} {
display: none;
}
@@ -54,18 +54,18 @@ $search-result-height: calc(100% - 60px);
padding-bottom: 0;
padding-top: 12px;
#{$mat-form-field-wrapper} {
#{$mat-form-field-flex} {
#{ms.$mat-form-field-wrapper} {
#{ms.$mat-form-field-flex} {
align-items: center;
#{$mat-form-field-infix} {
#{ms.$mat-form-field-infix} {
padding-top: 0;
padding-bottom: 0;
}
}
}
#{$mat-form-field-subscript-wrapper} {
#{ms.$mat-form-field-subscript-wrapper} {
height: 16px;
}

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
.adf {
&-permission-card {
@@ -88,7 +88,7 @@
height: calc(100% - 63px);
}
&-local-permission-container#{$mat-card-content} {
&-local-permission-container#{ms.$mat-card-content} {
overflow: hidden;
flex: 1 1 auto;
padding: 0;

View File

@@ -1,11 +1,11 @@
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
.adf-role-selector-field#{$mat-form-field} {
.adf-role-selector-field#{ms.$mat-form-field} {
width: 100%;
max-width: 200px;
height: 40px;
#{$mat-form-field-infix}:not(:disabled) {
#{ms.$mat-form-field-infix}:not(:disabled) {
padding-top: 8px;
}
}

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
.adf-search-check-list > div {
display: flex;
@@ -21,7 +21,7 @@
white-space: nowrap;
}
#{$mat-checkbox-box} {
#{ms.$mat-checkbox-box} {
margin-left: 4px;
margin-top: 5px;
margin-bottom: 4px;

View File

@@ -1,21 +1,21 @@
/* stylelint-disable selector-class-pattern */
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
adf-search-chip-autocomplete-input {
.adf-chip-list {
width: 100%;
}
.adf-chip-list:has(#{$mat-notched-outline}) {
.adf-chip-list:has(#{ms.$mat-notched-outline}) {
margin-top: 4px;
}
#{$mat-form-text-field-infix} {
#{ms.$mat-form-text-field-infix} {
border: none;
}
.adf-chip-list#{$mat-form-field} {
#{$mat-form-field-infix} {
.adf-chip-list#{ms.$mat-form-field} {
#{ms.$mat-form-field-infix} {
padding-top: 14px;
padding-bottom: 14px;
min-height: unset;
@@ -35,8 +35,8 @@ adf-search-chip-autocomplete-input {
padding: 4px 0;
}
#{$mat-evolution-chip-set} {
#{$mat-evolution-chip} {
#{ms.$mat-evolution-chip-set} {
#{ms.$mat-evolution-chip} {
margin-left: 0;
margin-right: 4px;
}

View File

@@ -1,8 +1,8 @@
@use '@angular/material' as mat;
@import 'styles/flex';
@use '../../flex' as flex;
$mat-menu-overlay-min-width: 112px !default; // 56 * 2
$mat-menu-overlay-max-width: 280px !default; // 56 * 5
$mat-menu-overlay-min-width: 112px !default; // 56 * 2
$mat-menu-overlay-max-width: 280px !default; // 56 * 5
.adf {
&-search-result-autocomplete {
@@ -24,7 +24,7 @@ $mat-menu-overlay-max-width: 280px !default; // 56 * 5
background-color: var(--adf-theme-background-card-color);
border-radius: 2px;
@include layout-bp(lt-md) {
@include flex.layout-bp(lt-md) {
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;

View File

@@ -1,7 +1,7 @@
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
adf-search-date-range-tabbed {
#{$mat-tab-header} {
#{ms.$mat-tab-header} {
margin-top: -5px;
}
}

View File

@@ -1,50 +1,50 @@
@import "styles/mat-selectors";
@use '../../../../mat-selectors' as ms;
adf-search-date-range {
.adf-search-date-range-container {
margin-top: 20px;
padding: 10px;
.adf-search-date-range-container {
margin-top: 20px;
padding: 10px;
.adf-search-date-range-form-field-select {
width: 180px;
min-width: 180px;
}
&-row {
display: flex;
flex-direction: row;
padding-bottom: 21px;
align-items: center;
&-date {
margin-top: 8px;
}
#{$mat-select-arrow-wrapper} {
height: unset;
}
.adf-search-date-range-input-field {
width: 75px;
}
.adf-search-date-range-form-field {
padding-left: 10px;
flex: 1;
margin-bottom: 12px;
#{$mat-form-field-flex} {
align-items: center;
#{$mat-form-field-infix} {
padding: 0.375em 0 4px;
}
.adf-search-date-range-form-field-select {
width: 180px;
min-width: 180px;
}
}
}
}
.adf-search-widget-extra-width {
max-width: 500px;
}
&-row {
display: flex;
flex-direction: row;
padding-bottom: 21px;
align-items: center;
&-date {
margin-top: 8px;
}
#{ms.$mat-select-arrow-wrapper} {
height: unset;
}
.adf-search-date-range-input-field {
width: 75px;
}
.adf-search-date-range-form-field {
padding-left: 10px;
flex: 1;
margin-bottom: 12px;
#{ms.$mat-form-field-flex} {
align-items: center;
#{ms.$mat-form-field-infix} {
padding: 0.375em 0 4px;
}
}
}
}
}
.adf-search-widget-extra-width {
max-width: 500px;
}
}

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../../../../mat-selectors.scss' as ms;
adf-search-facet-chip-tabbed {
.adf-search-filter-chip-tabbed {
@@ -6,7 +6,7 @@ adf-search-facet-chip-tabbed {
pointer-events: none;
}
#{$mat-evolution-chip-graphic} {
#{ms.$mat-evolution-chip-graphic} {
display: none;
}
}
@@ -16,6 +16,6 @@ adf-search-facet-chip-tabbed {
}
}
.adf-search-widget-extra-width#{$mat-menu-panel} {
.adf-search-widget-extra-width#{ms.$mat-menu-panel} {
max-width: 500px;
}

View File

@@ -1,7 +1,7 @@
@import 'styles/mat-selectors';
@use '../../../../mat-selectors.scss' as ms;
.adf-search-filter-chip {
#{$mat-evolution-chip-graphic} {
#{ms.$mat-evolution-chip-graphic} {
display: none;
}

View File

@@ -1,5 +1,5 @@
@use '@angular/material' as mat;
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
.adf-search-filter-chip,
.adf-search-filter-chip-tabbed {
@@ -52,15 +52,15 @@
}
}
.adf-search-filter-chip#{$mat-evolution-chip}#{$mat-standard-chip} {
.adf-search-filter-chip#{ms.$mat-evolution-chip}#{ms.$mat-standard-chip} {
margin-top: 0;
margin-bottom: 0;
}
#{$mat-standard-chip} {
#{ms.$mat-standard-chip} {
-webkit-font-smoothing: unset;
}
#{$mat-evolution-chip-set} {
#{ms.$mat-evolution-chip-set} {
margin-top: -4px;
}

View File

@@ -1,5 +1,5 @@
@use '@angular/material' as mat;
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
.adf-filter {
&-button:has(.adf-filter-icon) {
@@ -73,7 +73,7 @@
padding-right: 16px;
-webkit-font-smoothing: subpixel-antialiased;
#{$mat-button-label} {
#{ms.$mat-button-label} {
font-weight: unset;
}
}

View File

@@ -1,14 +1,14 @@
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
adf-search-filter-tabbed {
#{$mat-tab-header} {
#{ms.$mat-tab-header} {
margin-top: 0;
}
.adf-search-tab-label-active {
border-bottom: 1px solid var(--theme-primary-color);
#{$mat-tab-label-text} {
#{ms.$mat-tab-label-text} {
color: var(--adf-theme-foreground-secondary-text-color);
}
}

View File

@@ -1,5 +1,5 @@
@use '@angular/material' as mat;
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
.adf-search-form {
&.adf-search-form-button {
@@ -28,7 +28,7 @@
text-align: left;
}
.adf-search-form-icon#{$mat-icon} {
.adf-search-form-icon#{ms.$mat-icon} {
font-size: 24px;
height: 24px;
width: 24px;

View File

@@ -1,5 +1,5 @@
/* stylelint-disable selector-class-pattern */
@import 'styles/mat-selectors';
@use '../../../mat-selectors.scss' as ms;
adf-search-properties {
.adf-search-properties-form {
@@ -9,39 +9,39 @@ adf-search-properties {
display: block;
}
#{$mat-text-field-no-label} {
#{$mat-form-field-infix} {
#{ms.$mat-text-field-no-label} {
#{ms.$mat-form-field-infix} {
padding-top: 9px;
padding-bottom: 9px;
display: inline-block;
}
}
#{$mat-form-field-infix} {
#{ms.$mat-form-field-infix} {
height: 37.5px;
min-height: 37.5px;
display: inline-block;
}
#{$mat-select-trigger} {
#{ms.$mat-select-trigger} {
height: 17.5px;
}
#{$mat-select-arrow-wrapper} {
#{ms.$mat-select-arrow-wrapper} {
width: 16px;
}
#{$mat-line-ripple} {
#{ms.$mat-line-ripple} {
&::before {
display: none;
}
}
#{$mat-select-arrow} {
#{ms.$mat-select-arrow} {
margin-left: 5px;
}
#{$mat-form-field} {
#{ms.$mat-form-field} {
margin-bottom: 18px;
}
}
@@ -49,7 +49,7 @@ adf-search-properties {
adf-search-chip-autocomplete-input {
display: block;
#{$mat-text-field-outlined} {
#{ms.$mat-text-field-outlined} {
&-start,
&-end {
border-top: 1px solid var(--adf-theme-mat-grey-color-a400);
@@ -65,15 +65,15 @@ adf-search-properties {
}
}
#{$mat-focused} {
#{$mat-text-field-outlined} {
#{ms.$mat-focused} {
#{ms.$mat-text-field-outlined} {
outline: 2px auto -webkit-focus-ring-color;
}
}
#{$mat-form-field-appearance-outline} {
#{$mat-text-field-outlined-thick} {
#{$mat-text-field-outlined} {
#{ms.$mat-form-field-appearance-outline} {
#{ms.$mat-text-field-outlined-thick} {
#{ms.$mat-text-field-outlined} {
&-start,
&-end {
border-width: 1px;
@@ -82,11 +82,11 @@ adf-search-properties {
}
}
#{$mat-notched-outline-leading} {
#{ms.$mat-notched-outline-leading} {
border-color: var(--adf-theme-foreground-text-color-027);
}
#{$mat-notched-outline-trailing} {
#{ms.$mat-notched-outline-trailing} {
border-color: var(--adf-theme-foreground-text-color-027);
}
}
@@ -107,14 +107,14 @@ adf-search-properties {
.adf-search-properties-file-size-operator,
.adf-search-properties-file-size-unit {
#{$mat-form-field-infix} {
#{ms.$mat-form-field-infix} {
border: 1px solid var(--adf-theme-mat-grey-color-a400);
border-radius: 5px;
padding: 9px;
}
&#{$mat-focused} {
#{$mat-form-field-infix} {
&#{ms.$mat-focused} {
#{ms.$mat-form-field-infix} {
outline: 2px auto -webkit-focus-ring-color;
}
}

View File

@@ -1,5 +1,3 @@
@import 'styles/mat-selectors';
.adf-search-text {
padding: 0;

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../../mat-selectors.scss' as ms;
adf-tags-creator {
display: block;
@@ -77,7 +77,7 @@ adf-tags-creator {
background-color: inherit;
color: inherit;
&:not(#{$mat-list-item-disabled}):hover {
&:not(#{ms.$mat-list-item-disabled}):hover {
cursor: pointer;
background: var(--adf-theme-mat-grey-color-a200);
}
@@ -93,7 +93,7 @@ adf-tags-creator {
min-height: 62px;
}
#{$mat-list-item-disabled} #{$mat-list-item-primary-text} {
#{ms.$mat-list-item-disabled} #{ms.$mat-list-item-primary-text} {
opacity: 1;
}
}

View File

@@ -1,4 +1,4 @@
@import 'styles/mat-selectors';
@use '../mat-selectors.scss' as ms;
.adf-new-version-radio-group {
display: inline-flex;
@@ -26,11 +26,11 @@
width: 100%;
float: right;
#{$mat-floating-label} {
#{ms.$mat-floating-label} {
padding-bottom: 10px;
}
#{$mat-form-field-infix} {
#{ms.$mat-form-field-infix} {
padding-top: 12px;
padding-bottom: 0;
}