inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-26 17:24:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

[AAE-15149] Added reference variables to edit task filter component (#8636)

Browse Source 
* AAE-15149: Added reference variables to edit task filter component

* AAE-15149: Added component variables

* AAE-15149: updated variable names

* AAE-15149: updated class names targeting directly the elements

* AAE-15149: updated class names targeting directly the elements

* AAE-15149: Fixed lint errors
This commit is contained in:
Ehsan Rezaei 2023-06-12 15:31:38 +02:00 committed by GitHub
parent 6c6f7613b4
commit c66fb5f6ec
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 40 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
lib/core/src/lib/styles/_components-variables.scss Normal file
View File

@ -0,0 +1,16 @@
@use './reference-variables' as *;
@mixin adf-components-variables() {
$defaults: (
--adf-edit-task-and-service-filter-header-title-color: $adf-ref-edit-task-and-service-filter-header-title-color,
--adf-edit-task-and-service-filter-header-description-color: $adf-ref-edit-task-and-service-filter-header-description-color,
--adf-edit-task-and-service-filter-header-height: $adf-ref-edit-task-and-service-filter-header-height,
);
// propagates SCSS variables into the CSS variables scope
:root {
@each $name, $value in $defaults {
#{$name}: #{$value};
}
}
}

2
lib/core/src/lib/styles/_index.scss
View File

@ -10,6 +10,7 @@
@import '../clipboard/clipboard.theme';
@import './snackbar.theme';
@import './material.theme';
@import './components-variables';
@import '../../../../../node_modules/@mat-datetimepicker/core/datetimepicker/datetimepicker-theme';
@mixin alfresco-material-theme($theme) {
@ -112,6 +113,7 @@
@include mat-datetimepicker-theme($theme);
@include adf-snackbar-theme;
@include adf-material-theme;
@include adf-components-variables;
}
$adf-custom-theme-sizes: (

3
lib/core/src/lib/styles/_reference-variables.scss Normal file
View File

@ -0,0 +1,3 @@
$adf-ref-edit-task-and-service-filter-header-title-color: rgba(0, 0, 0, 0.87);
$adf-ref-edit-task-and-service-filter-header-description-color: rgba(0, 0, 0, 0.54);
$adf-ref-edit-task-and-service-filter-header-height: 48px;

8
lib/process-services-cloud/src/lib/task/task-filters/components/edit-task-filters/base-edit-task-filter-cloud.component.html
View File

@ -1,10 +1,10 @@
<mat-accordion [hideToggle]="isLoading">
<mat-accordion [hideToggle]="isLoading" class="adf-edit-task-filter">
<mat-expansion-panel (afterExpand)="onExpand()" (closed)="onClose()">
<mat-expansion-panel-header *ngIf="taskFilter" id="adf-edit-task-filter-expansion-header">
<mat-expansion-panel-header *ngIf="taskFilter" id="adf-edit-task-filter-expansion-header" class="adf-edit-task-filter-header">
<ng-container *ngIf="!isLoading; else loadingTemplate">
<mat-panel-title *ngIf="showTaskFilterName" id="adf-edit-task-filter-title-id"
<mat-panel-title *ngIf="showTaskFilterName" id="adf-edit-task-filter-title-id" class="adf-edit-task-filter-header__title"
>{{taskFilter.name | translate}}</mat-panel-title>
<mat-panel-description class="adf-edit-task-filter-description" id="adf-edit-task-filter-sub-title-id">
<mat-panel-description class="adf-edit-task-filter-header__description" id="adf-edit-task-filter-sub-title-id">
<span *ngIf="showTitle">{{ 'ADF_CLOUD_EDIT_TASK_FILTER.TITLE' | translate}}</span>
<div *ngIf="showFilterActions" class="adf-cloud-edit-task-filter-actions">
<ng-container *ngIf="toggleFilterActions">

19
lib/process-services-cloud/src/lib/task/task-filters/components/edit-task-filters/base-edit-task-filter-cloud.component.scss
View File

@ -42,10 +42,6 @@
margin-right: calc((100% - 100px) / 2);
}
&-edit-task-filter-description {
place-content: center space-between;
}
&-edit-task-filter-form {
flex-flow: row wrap;
display: flex;
@ -72,4 +68,19 @@
}
}
}
&-edit-task-filter {
&-header {
height: var(--adf-edit-task-and-service-filter-header-height);
&__title {
color: var(--adf-edit-task-and-service-filter-header-title-color);
}
&__description {
color: var(--adf-edit-task-and-service-filter-header-description-color);
place-content: center space-between;
}
}
}
}