[AAE-5637] Remove SCSS mixins and use CSS variables (#7250)

* remove default-class mixin and use regular import

* cleanup colors

* remove variables file, fix bugs in animations

* proper ordering of imports, core css vars

* cleanup snackbar and material themes

* tags component

* login component styles

* app login

* toolbar component styles

* breadcrumb styles

* dropdown breadcrumb

* app layout component

* demo shell: files component

* aspect list styles

* content metadata styles

* node selector

* name location cell

* node share dialog

* content type dialog

* folder dialog

* document list

* datatable theme

* pagination theme

* viewer theme

* viewer theme

* user-info theme

* container widget

* dynamic table theme

* form widgets

* form theme

* form renderer

* sidebar menu

* header theme

* info drawer theme

* comment list

* commens and layout container

* sidenav layout

* empty content

* error content

* clipboard theme

* search input

* tooltip card and notification history

* card view theme

* remove unused keys

* add permission dialog

* search and permission dialogs

* version comparison and column themes

* upload drag area and cleanup references

* remove the need for content styles

* insight components

* cleanup insights theme

* process components

* process components

* process cloud themes

* cleanup unsed imports

* cleanup mixins

* update build scripts

* test fixes

* remove fdescribe

* css fixes

* update unit tests
This commit is contained in:
Denys Vuika
2021-09-29 13:17:05 +01:00
committed by GitHub
parent 8113b9b10b
commit 6f968f7e4a
335 changed files with 7703 additions and 8339 deletions

View File

@@ -0,0 +1,75 @@
.adf {
&-invisible-date-input {
height: 2px;
width: 0;
overflow: hidden;
opacity: 0;
border: none;
margin: 0;
padding: 0;
float: right;
}
&-dateitem-chip-list-container.adf-property-field {
margin-bottom: -7px !important;
border-bottom: 0;
cursor: pointer;
.adf-dateitem-editable-controls {
margin-top: 15px;
}
.mat-datetimepicker-toggle {
position: absolute;
right: 0;
top: -20px;
}
}
&-dateitem-editable {
cursor: pointer;
border-bottom: 1px solid var(--adf-card-view-datetime-border-color);
padding-bottom: 6px;
&-controls {
display: flex;
align-items: center;
justify-content: space-between;
button.mat-icon-button {
line-height: 20px;
height: 20px;
width: 20px;
}
mat-icon {
width: 16px;
height: 16px;
opacity: 0.5;
}
&:hover mat-icon {
opacity: 1;
}
.adf-datepicker-toggle {
flex: 1 0 auto;
}
mat-icon.adf-date-reset-icon {
line-height: 10px;
font-size: 16px;
width: 16px;
height: 16px;
position: relative;
top: 4px;
padding-left: 8px;
opacity: 0.3;
}
&:hover mat-icon.adf-date-reset-icon {
opacity: 1;
}
}
}
}

View File

@@ -15,7 +15,7 @@
* limitations under the License.
*/
import { Component, Input, OnDestroy, OnInit, ViewChild } from '@angular/core';
import { Component, Input, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
import { DateAdapter, MAT_DATE_FORMATS } from '@angular/material/core';
import { DatetimeAdapter, MAT_DATETIME_FORMATS, MatDatetimepicker } from '@mat-datetimepicker/core';
import { MAT_MOMENT_DATETIME_FORMATS, MomentDatetimeAdapter } from '@mat-datetimepicker/moment';
@@ -41,7 +41,9 @@ import { TranslationService } from '../../../services/translation.service';
{ provide: MAT_DATETIME_FORMATS, useValue: MAT_MOMENT_DATETIME_FORMATS }
],
selector: 'adf-card-view-dateitem',
templateUrl: './card-view-dateitem.component.html'
templateUrl: './card-view-dateitem.component.html',
styleUrls: ['./card-view-dateitem.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class CardViewDateItemComponent extends BaseCardView<CardViewDateItemModel> implements OnInit, OnDestroy {

View File

@@ -1,79 +0,0 @@
@mixin adf-card-view-dateitem-theme($theme) {
$foreground: map-get($theme, foreground);
.adf {
&-invisible-date-input {
height: 2px;
width: 0;
overflow: hidden;
opacity: 0;
border: none;
margin: 0;
padding: 0;
float: right;
}
&-dateitem-chip-list-container.adf-property-field {
margin-bottom: -7px !important;
border-bottom: 0;
cursor: pointer;
.adf-dateitem-editable-controls {
margin-top: 15px;
}
.mat-datetimepicker-toggle {
position: absolute;
right: 0;
top: -20px;
}
}
&-dateitem-editable {
cursor: pointer;
border-bottom: 1px solid mat-color($foreground, text, 0.42);
padding-bottom: 6px;
&-controls {
display: flex;
align-items: center;
justify-content: space-between;
button.mat-icon-button {
line-height: 20px;
height: 20px;
width: 20px;
}
mat-icon {
width: 16px;
height: 16px;
opacity: 0.5;
}
&:hover mat-icon {
opacity: 1;
}
.adf-datepicker-toggle {
flex: 1 0 auto;
}
mat-icon.adf-date-reset-icon {
line-height: 10px;
font-size: 16px;
width: 16px;
height: 16px;
position: relative;
top: 4px;
padding-left: 8px;
opacity: 0.3;
}
&:hover mat-icon.adf-date-reset-icon {
opacity: 1;
}
}
}
}
}