mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2026-09-09 18:03:21 +00:00
[ACS-8630] - Removing mat-selectors - part II
This commit is contained in:
-8
@@ -141,10 +141,6 @@ h2.adf-search-results-label {
|
||||
.adf-datatable-body .adf-datatable-row {
|
||||
min-height: 40px;
|
||||
|
||||
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
|
||||
padding-top: 15px;
|
||||
}
|
||||
|
||||
&:first-child {
|
||||
.adf-datatable-cell {
|
||||
border-top: none;
|
||||
@@ -163,10 +159,6 @@ h2.adf-search-results-label {
|
||||
.adf-datatable-list .adf-datatable-body .adf-datatable-row {
|
||||
min-height: 65px;
|
||||
|
||||
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
|
||||
padding-top: 15px;
|
||||
}
|
||||
|
||||
.adf-name-location-cell-name {
|
||||
padding: 5px 10px 2px;
|
||||
}
|
||||
|
||||
@@ -7,36 +7,25 @@ $mat-expansion-panel-body: '.mat-expansion-panel-body';
|
||||
$mat-tab-label-text: '.mdc-tab__text-label';
|
||||
$mat-tab-header: '.mat-mdc-tab-header';
|
||||
$mat-chip: '.mat-mdc-chip';
|
||||
$mat-checkbox: '.mat-mdc-checkbox';
|
||||
$mat-checkbox-box: '.mdc-checkbox';
|
||||
$mat-button: '.mat-mdc-button';
|
||||
$mat-button-label: '.mdc-button__label';
|
||||
$mat-form-field: '.mat-mdc-form-field';
|
||||
$mat-form-field-wrapper: '.mat-mdc-text-field-wrapper';
|
||||
$mat-form-field-appearance-outline: '.mat-form-field-appearance-outline';
|
||||
$mat-text-field-outlined: '.mdc-text-field--outlined';
|
||||
$mat-card: '.mat-mdc-card';
|
||||
$mat-card-content: '.mat-mdc-card-content';
|
||||
$mat-list-item-primary-text: '.mdc-list-item__primary-text';
|
||||
$mat-list-item-end: '.mdc-list-item__end';
|
||||
$mat-select: '.mat-mdc-select';
|
||||
$mat-menu-panel: '.mat-mdc-menu-panel';
|
||||
$mat-expansion-panel: '.mat-expansion-panel';
|
||||
$mat-form-field-infix: '.mat-mdc-form-field-infix';
|
||||
$mat-form-field-hide-placeholder: '.mat-form-field-hide-placeholder';
|
||||
$mat-checkbox-background: '.mdc-checkbox__background';
|
||||
$mat-floating-label: '.mdc-floating-label';
|
||||
$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-evolution-chip: '.mdc-evolution-chip';
|
||||
$mat-standard-chip: '.mat-mdc-standard-chip';
|
||||
$mat-notched-outline: '.mdc-notched-outline';
|
||||
$mat-evolution-chip-graphic: '.mdc-evolution-chip__graphic';
|
||||
$mat-select-arrow: '.mat-mdc-select-arrow';
|
||||
$mat-evolution-chip-set: '.mdc-evolution-chip-set';
|
||||
$cdk-overlay-pane: '.cdk-overlay-pane';
|
||||
$mat-list-item-disabled: '.mdc-list-item--disabled';
|
||||
$mat-switch: '.mdc-switch';
|
||||
|
||||
+1
-1
@@ -28,7 +28,7 @@
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
&__add-btn#{ms.$mat-button} {
|
||||
&__add-btn {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
|
||||
@@ -77,31 +77,6 @@ $data-table-cell-min-width-file-size: $data-table-cell-min-width-1 !default;
|
||||
box-sizing: border-box;
|
||||
overflow-x: auto;
|
||||
|
||||
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
|
||||
.adf-datatable-center-size-column-ie {
|
||||
padding-top: 17px;
|
||||
}
|
||||
|
||||
.adf-datatable__actions-cell.adf-datatable-center-actions-column-ie {
|
||||
padding-top: 7px;
|
||||
}
|
||||
|
||||
.adf-cell-date.adf-datatable-center-date-column-ie {
|
||||
position: relative;
|
||||
|
||||
.adf-datatable-cell-value {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.adf-datatable-center-img-ie {
|
||||
padding: 0;
|
||||
min-width: 0;
|
||||
width: 24px;
|
||||
height: 56px;
|
||||
}
|
||||
}
|
||||
|
||||
.adf-datatable-header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
@@ -245,13 +220,6 @@ $data-table-cell-min-width-file-size: $data-table-cell-min-width-1 !default;
|
||||
max-width: $data-table-thumbnail-width;
|
||||
width: $data-table-thumbnail-width;
|
||||
}
|
||||
|
||||
/* query for Microsoft IE 11 */
|
||||
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
|
||||
.adf-datatable-checkbox {
|
||||
padding-top: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.adf-datatable-cell,
|
||||
@@ -358,10 +326,6 @@ $data-table-cell-min-width-file-size: $data-table-cell-min-width-1 !default;
|
||||
.adf-datatable-cell-value {
|
||||
word-break: break-word;
|
||||
display: block;
|
||||
|
||||
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
|
||||
padding: 17px 10px 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -464,13 +428,6 @@ $data-table-cell-min-width-file-size: $data-table-cell-min-width-1 !default;
|
||||
overflow: unset;
|
||||
}
|
||||
|
||||
/* query for Microsoft IE 11 */
|
||||
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
|
||||
.adf-cell-value {
|
||||
top: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
/* cell stretching content */
|
||||
& > div::after {
|
||||
content: attr(title);
|
||||
|
||||
@@ -174,11 +174,12 @@
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
& #{ms.$mat-tab-ink-bar} {
|
||||
#{ms.$mat-tab-indicator-underline} {
|
||||
border-top-width: 4px;
|
||||
}
|
||||
}
|
||||
// Tab active-indicator thickness via the public token API.
|
||||
@include mat.tabs-overrides(
|
||||
(
|
||||
active-indicator-height: 4px
|
||||
)
|
||||
);
|
||||
|
||||
& #{ms.$mat-form-field-wrapper} {
|
||||
margin: 0 12px 0 0;
|
||||
|
||||
@@ -29,7 +29,7 @@
|
||||
[title]="field.tooltip"
|
||||
[min]="minDate"
|
||||
[max]="maxDate">
|
||||
<mat-datetimepicker-toggle matSuffix [for]="datetimePicker"
|
||||
<mat-datetimepicker-toggle class="adf-date-time-widget-toggle" matSuffix [for]="datetimePicker"
|
||||
[disabled]="field.readOnly" />
|
||||
<mat-datetimepicker #datetimePicker
|
||||
data-automation-id="adf-date-time-widget-picker"
|
||||
|
||||
@@ -25,6 +25,6 @@
|
||||
@include mixins.adf-error-icon;
|
||||
}
|
||||
|
||||
#{ms.$mat-datetimepicker-toggle} {
|
||||
.adf-date-time-widget-toggle {
|
||||
color: var(--mat-sys-on-surface);
|
||||
}
|
||||
|
||||
@@ -1,7 +1,3 @@
|
||||
/* stylelint-disable no-descending-specificity */
|
||||
/* stylelint-disable declaration-no-important */
|
||||
@use '../../../styles/mat-selectors' as ms;
|
||||
|
||||
.adf {
|
||||
&-error-container {
|
||||
height: 20px;
|
||||
@@ -32,14 +28,3 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* query for Microsoft IE 11 */
|
||||
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
|
||||
adf-form-field {
|
||||
#{ms.$mat-input-element},
|
||||
#{ms.$mat-select},
|
||||
#{ms.$mat-form-field} {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -23,13 +23,6 @@ adf-layout-container {
|
||||
margin-right 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
|
||||
}
|
||||
|
||||
/* query for Microsoft IE 11 */
|
||||
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
|
||||
.adf-container-full-width {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.adf-layout-container {
|
||||
display: block;
|
||||
width: 100%;
|
||||
|
||||
@@ -13,29 +13,11 @@
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
|
||||
// IE11 vertical centering
|
||||
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
|
||||
& {
|
||||
display: table;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.adf-ie11FixerParent {
|
||||
margin: 16px 0;
|
||||
min-width: 320px;
|
||||
|
||||
// IE11 vertical centering
|
||||
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
width: 100%;
|
||||
padding-top: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
// IE11 vertical centering
|
||||
.adf-ie11FixerChild {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
|
||||
@@ -2,28 +2,20 @@ $mat-icon: '.mat-icon';
|
||||
$mat-focused: '.mat-focused';
|
||||
$mat-line: '.mat-line';
|
||||
$mat-tab-label: '.mat-mdc-tab';
|
||||
$mat-tab-label-active: '.mdc-tab--active';
|
||||
$mat-tab-label-container: '.mat-mdc-tab-label-container';
|
||||
$mat-tab-label-text: '.mdc-tab__text-label';
|
||||
$mat-tab-body: '.mat-mdc-tab-body';
|
||||
$mat-tab-header: '.mat-mdc-tab-header';
|
||||
$mat-tab-body-content: '.mat-mdc-tab-body-content';
|
||||
$mat-tab-ink-bar: '.mdc-tab-indicator';
|
||||
$mat-chip: '.mat-mdc-chip';
|
||||
$mat-chip-list: '.mat-mdc-chip-list';
|
||||
$mat-checkbox: '.mat-mdc-checkbox';
|
||||
$mat-checkbox-label: '.mdc-label';
|
||||
$mat-button: '.mat-mdc-button';
|
||||
$mat-button-label: '.mdc-button__label';
|
||||
$mat-form-field: '.mat-mdc-form-field';
|
||||
$mat-form-field-wrapper: '.mat-mdc-text-field-wrapper';
|
||||
$mat-line-ripple: '.mdc-line-ripple';
|
||||
$mat-form-field-prefix: '.mat-mdc-form-field-text-prefix';
|
||||
$mat-form-field-suffix: '.mat-mdc-form-field-text-suffix';
|
||||
$mat-form-field-label: '.mat-mdc-floating-label';
|
||||
$mat-form-field-invalid: '.mat-form-field-invalid';
|
||||
$mat-text-field-focused: '.mdc-text-field--focused';
|
||||
$mat-dialog-container: '.mdc-dialog__container';
|
||||
$mat-button-touch-target: '.mat-mdc-button-touch-target';
|
||||
$mat-input-element: '.mat-mdc-input-element';
|
||||
$mat-card: '.mat-mdc-card';
|
||||
@@ -39,39 +31,13 @@ $mat-drawer-transition: '.mat-drawer-transition';
|
||||
$mat-drawer-content: '.mat-drawer-content';
|
||||
$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-list-item-unscoped-content: '.mat-mdc-list-item-unscoped-content';
|
||||
$mat-list-item-end: '.mdc-list-item__end';
|
||||
$mat-text-field-no-label: '.mdc-text-field--no-label';
|
||||
$mat-form-field-infix: '.mat-mdc-form-field-infix';
|
||||
$mat-dialog-surface: '.mat-mdc-dialog-surface';
|
||||
$mat-floating-label-required: '.mdc-floating-label--required';
|
||||
$mat-evolution-chip-action: '.mdc-evolution-chip__action';
|
||||
$mat-evolution-chip-text-label: '.mdc-evolution-chip__text-label';
|
||||
$mat-evolution-chip-graphic: '.mdc-evolution-chip__graphic';
|
||||
$mat-select-trigger: '.mat-mdc-select-trigger';
|
||||
$mat-button-base: '.mat-mdc-button-base';
|
||||
$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-form-field-icon-suffix: '.mat-mdc-form-field-icon-suffix';
|
||||
$mat-select-value: '.mat-mdc-select-value';
|
||||
$mat-datetimepicker-calendar: '.mat-datetimepicker-calendar';
|
||||
$mat-datetimepicker-calendar-header: '.mat-datetimepicker-calendar-header';
|
||||
$mat-datetimepicker-calendar-table-header: '.mat-datetimepicker-calendar-table-header';
|
||||
$mat-datetimepicker-calendar-header-year: '.mat-datetimepicker-calendar-header-year';
|
||||
$mat-datetimepicker-calendar-header-date: '.mat-datetimepicker-calendar-header-date';
|
||||
$mat-datetimepicker-calendar-header-time: '.mat-datetimepicker-calendar-header-time';
|
||||
$mat-datetimepicker-calendar-content: '.mat-datetimepicker-calendar-content';
|
||||
$mat-datetimepicker-calendar-body-disabled: '.mat-datetimepicker-calendar-body-disabled';
|
||||
$mat-datetimepicker-toggle: '.mat-datetimepicker-toggle';
|
||||
|
||||
@@ -16,13 +16,6 @@
|
||||
max-height: 100%;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
/* query for Microsoft IE 11 */
|
||||
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
|
||||
img {
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&__toolbar {
|
||||
|
||||
@@ -1,3 +0,0 @@
|
||||
/* 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';
|
||||
+10
-2
@@ -1,3 +1,4 @@
|
||||
@use '@angular/material' as mat;
|
||||
@use '../../../../mat-selectors' as ms;
|
||||
|
||||
.adf-task-form-cloud-container {
|
||||
@@ -11,14 +12,21 @@
|
||||
padding-bottom: 25px;
|
||||
padding-right: 25px;
|
||||
|
||||
// Size all action buttons (incl. projected cloud outcome buttons)
|
||||
// via the public token API; layout below still needs the element selector.
|
||||
@include mat.button-overrides(
|
||||
(
|
||||
text-container-height: 36px,
|
||||
text-container-shape: 5px
|
||||
)
|
||||
);
|
||||
|
||||
.adf-task-form-actions-button {
|
||||
height: 36px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
#{ms.$mat-button} {
|
||||
height: 36px;
|
||||
border-radius: 5px;
|
||||
width: auto;
|
||||
padding: 0 16px;
|
||||
margin: 0 8px;
|
||||
|
||||
@@ -1,3 +1,4 @@
|
||||
@use '@angular/material' as mat;
|
||||
@use '../../styles/mat-selectors' as ms;
|
||||
|
||||
.adf-form-container {
|
||||
@@ -22,9 +23,12 @@
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
& #{ms.$mat-tab-ink-bar} {
|
||||
height: 4px;
|
||||
}
|
||||
// Tab active-indicator thickness via the public token API.
|
||||
@include mat.tabs-overrides(
|
||||
(
|
||||
active-indicator-height: 4px
|
||||
)
|
||||
);
|
||||
|
||||
& #{ms.$mat-form-field-wrapper} {
|
||||
margin: 0 12px 0 0;
|
||||
@@ -84,10 +88,13 @@
|
||||
padding-bottom: 25px;
|
||||
padding-right: 25px;
|
||||
|
||||
& #{ms.$mat-button} {
|
||||
height: 36px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
// Text buttons (incl. projected custom buttons) sized via public token API.
|
||||
@include mat.button-overrides(
|
||||
(
|
||||
text-container-height: 36px,
|
||||
text-container-shape: 5px
|
||||
)
|
||||
);
|
||||
|
||||
& #{ms.$mat-button-label} {
|
||||
width: 58px;
|
||||
|
||||
@@ -4,19 +4,14 @@ $mat-card: '.mat-mdc-card';
|
||||
$mat-card-header-text: '.mat-mdc-card-header-text';
|
||||
$mat-card-content: '.mat-mdc-card-content';
|
||||
$mat-card-header: '.mat-mdc-card-header';
|
||||
$mat-card-title: '.mat-mdc-card-title';
|
||||
$mat-tab-body-content: '.mat-mdc-tab-body-content';
|
||||
$mat-tab-label-text: '.mdc-tab__text-label';
|
||||
$mat-tab-ink-bar: '.mdc-tab-indicator';
|
||||
$mat-form-field-wrapper: '.mat-mdc-text-field-wrapper';
|
||||
$mat-button: '.mat-mdc-button';
|
||||
$mat-button-label: '.mdc-button__label';
|
||||
$mat-input-element: '.mat-mdc-input-element';
|
||||
$mat-line: '.mat-line';
|
||||
$mat-select-value-text: '.mat-mdc-select-value-text';
|
||||
$mat-form-field-label: '.mat-mdc-floating-label';
|
||||
$mat-form-field: '.mat-mdc-form-field';
|
||||
$mat-form-field-prefix: '.mat-mdc-form-field-text-prefix';
|
||||
$mat-slide-toggle: '.mat-mdc-slide-toggle';
|
||||
$mat-select-arrow-wrapper: '.mat-mdc-select-arrow-wrapper';
|
||||
$mat-dialog-surface: '.mat-mdc-dialog-surface';
|
||||
|
||||
+9
-4
@@ -1,3 +1,4 @@
|
||||
@use '@angular/material' as mat;
|
||||
@use '../../../styles/mat-selectors' as ms;
|
||||
|
||||
.adf-task-form {
|
||||
@@ -10,10 +11,14 @@
|
||||
padding-right: 25px;
|
||||
padding-bottom: 25px;
|
||||
|
||||
& #{ms.$mat-button} {
|
||||
height: 36px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
// Buttons here (incl. any projected/templated ones) are text buttons;
|
||||
// size them via Material's public token API instead of the internal class.
|
||||
@include mat.button-overrides(
|
||||
(
|
||||
text-container-height: 36px,
|
||||
text-container-shape: 5px
|
||||
)
|
||||
);
|
||||
|
||||
& #{ms.$mat-button-label} {
|
||||
width: 58px;
|
||||
|
||||
Reference in New Issue
Block a user