[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,71 @@
.adf {
&-notification-history-menu_button.mat-button {
margin-right: 0;
border-radius: 90%;
padding: 0;
min-width: 40px;
height: 40px;
}
&-notification-history-list .mat-subheader {
justify-content: space-between;
}
&-notification-history-menu {
&-item {
cursor: pointer;
}
&-item:focus {
outline: none;
background: var(--theme-bg-hover-color);
}
&-item:hover {
background-color: var(--theme-bg-hover-color);
}
&-message, &-no-message {
font-size: 13px !important;
}
&-date {
font-size: 12px !important;
}
&-initiator {
margin: 4px;
}
}
&-notification-initiator-pic {
min-width: 40px;
background: var(--theme-accent-color);
display: inline-block;
height: 40px;
border-radius: 100px;
text-align: center;
font-weight: bolder;
font-size: 18px;
text-transform: uppercase;
vertical-align: middle;
line-height: 40px;
color: var(--theme-colors-mat-grey);
}
&-notification-history-load-more {
display: flex;
justify-content: center;
padding: 10px;
}
}
.mat-menu-panel.adf-notification-history-menu {
min-width: 320px;
max-height: 500px;
.mat-menu-content {
padding: 0;
}
}

View File

@@ -15,7 +15,7 @@
* limitations under the License.
*/
import { Component, Input, ViewChild, OnDestroy, OnInit, AfterViewInit, ChangeDetectorRef } from '@angular/core';
import { Component, Input, ViewChild, OnDestroy, OnInit, AfterViewInit, ChangeDetectorRef, ViewEncapsulation } from '@angular/core';
import { NotificationService } from '../services/notification.service';
import { NotificationModel, NOTIFICATION_TYPE } from '../models/notification.model';
import { MatMenuTrigger, MenuPositionX, MenuPositionY } from '@angular/material/menu';
@@ -26,7 +26,9 @@ import { Pagination } from '@alfresco/js-api';
@Component({
selector: 'adf-notification-history',
templateUrl: 'notification-history.component.html'
templateUrl: 'notification-history.component.html',
styleUrls: ['./notification-history.component.scss'],
encapsulation: ViewEncapsulation.None
})
export class NotificationHistoryComponent implements OnDestroy, OnInit, AfterViewInit {

View File

@@ -1,76 +0,0 @@
@mixin adf-notification-history-theme($theme) {
$background: map-get($theme, background);
$accent: map-get($theme, accent);
.adf {
&-notification-history-menu_button.mat-button {
margin-right: 0;
border-radius: 90%;
padding: 0;
min-width: 40px;
height: 40px;
}
&-notification-history-list .mat-subheader {
justify-content: space-between;
}
&-notification-history-menu {
&-item {
cursor: pointer;
}
&-item:focus {
outline: none;
background: mat-color($background, 'hover');
}
&-item:hover {
background-color: mat-color($background, 'hover');
}
&-message, &-no-message {
font-size: 13px !important;
}
&-date {
font-size: 12px !important;
}
&-initiator {
margin: 4px;
}
}
&-notification-initiator-pic {
min-width: 40px;
background: mat-color($accent);
display: inline-block;
height: 40px;
border-radius: 100px;
text-align: center;
font-weight: bolder;
font-size: 18px;
text-transform: uppercase;
vertical-align: middle;
line-height: 40px;
color: mat-color($mat-grey, 50);
}
&-notification-history-load-more {
display: flex;
justify-content: center;
padding: 10px;
}
}
.mat-menu-panel.adf-notification-history-menu {
min-width: 320px;
max-height: 500px;
.mat-menu-content {
padding: 0;
}
}
}