MaDgiK-CITE
/
argos
13
0
Fork 0
Code Issues Pull Requests Projects Releases 3 Wiki Activity

add css warning color tenant configuration

This commit is contained in:
mchouliara 2024-10-02 16:55:13 +03:00
parent 363a3c9142
commit 0fa24f23ba
17 changed files with 50 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
frontend/src/app/core/model/tenant-configuaration/tenant-configuration.ts
View File

@ -76,6 +76,7 @@ export interface CssColorsTenantConfigurationPersist{
primaryText?: string;
secondaryText?: string;
invertedBtnColor?: string;
warningColor?: string;
}
export interface DefaultUserLocaleTenantConfigurationPersist{

2
frontend/src/app/core/services/tenant/tenant-handling.service.ts
View File

@ -90,6 +90,8 @@ export class TenantHandlingService extends BaseService {
if (localStorage.getItem('primaryText')) document.documentElement.style.setProperty(`--primary-text`, localStorage.getItem('primaryText'));
if (localStorage.getItem('secondaryText')) document.documentElement.style.setProperty(`--secondary-text`, localStorage.getItem('secondaryText'));
if (localStorage.getItem('invertedBtnColor')) document.documentElement.style.setProperty(`--inverted-btn-color`, localStorage.getItem('invertedBtnColor'));
if (localStorage.getItem('warningColor')) document.documentElement.style.setProperty(`--warning-color`, localStorage.getItem('warningColor'));
}
}
}

17
frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.component.html
View File

@ -1,7 +1,7 @@
<div *ngIf="formGroup" class="container-fluid css-colors">
<div class="row">
<div class="col-12">
<div class="row">
<div class="row" style="row-gap: 0.5rem">
<mat-form-field class="col-12 col-md-6">
<mat-label>{{'TENANT-CONFIGURATION-EDITOR.FIELDS.PRIMARY-COLOR' | translate}}</mat-label>
@ -56,6 +56,21 @@
<mat-error *ngIf="formGroup.get('cssColors')?.get('secondaryText')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('secondaryText')?.hasError('invalidColor')">{{'GENERAL.VALIDATION.INVALID-COLOR' | translate}}</mat-error>
</mat-form-field>
<mat-form-field class="col-12 col-md-6">
<mat-label >
{{'TENANT-CONFIGURATION-EDITOR.FIELDS.WARNING-COLOR' | translate}}
</mat-label>
<input matInput [formControl]="formGroup.get('cssColors')?.get('warningColorInput')" required />
<ngx-colors
class="suffix"
matSuffix
ngx-colors-trigger
[formControl]="formGroup.get('cssColors')?.get('warningColor')"
></ngx-colors>
<mat-error *ngIf="formGroup.get('cssColors')?.get('warningColor')?.hasError('backendError')">{{formGroup.get('cssColors')?.get('invertedBtnColor')?.getError('backendError').message}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('warningColor')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
<mat-error *ngIf="formGroup.get('cssColors')?.get('warningColor')?.hasError('invalidColor')">{{'GENERAL.VALIDATION.INVALID-COLOR' | translate}}</mat-error>
</mat-form-field>
<mat-form-field class="col-12 col-md-6">
<mat-label>
<mat-icon aria-hidden [matTooltip]="'TENANT-CONFIGURATION-EDITOR.FIELDS.LINK-COLOR-HINT' | translate">

13
frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.component.ts
View File

@ -19,7 +19,6 @@ import { BasePendingChangesComponent } from '@common/base/base-pending-changes.c
import { Observable } from 'rxjs';
import { TenantConfigurationType } from '@app/core/common/enum/tenant-configuration-type';
import { HttpErrorResponse } from '@angular/common/http';
import { ResponseErrorCode } from '@app/core/common/enum/respone-error-code';
import { LoggingService } from '@app/core/services/logging/logging-service';
import { AnalyticsService } from '@app/core/services/matomo/analytics-service';
@ -154,6 +153,17 @@ export class CssColorsEditorComponent extends BasePendingChangesComponent implem
emitEvent: false,
});
});
this.formGroup.get('cssColors')?.get('warningColor').valueChanges.subscribe((color) => {
this.formGroup.get('cssColors')?.get('warningColorInput').setValue(color, {
emitEvent: false,
});
});
this.formGroup.get('cssColors')?.get('warningColorInput').valueChanges.subscribe((color) => {
this.formGroup.get('cssColors')?.get('warningColor').setValue(color, {
emitEvent: false,
});
});
}
getItem(successFunction: (item: TenantConfiguration) => void) {
@ -214,6 +224,7 @@ export class CssColorsEditorComponent extends BasePendingChangesComponent implem
localStorage.setItem('primaryText', formData?.cssColors?.primaryText);
localStorage.setItem('secondaryText', formData?.cssColors?.secondaryText);
localStorage.setItem('invertedBtnColor', formData?.cssColors?.invertedBtnColor);
localStorage.setItem('warningColor', formData?.cssColors?.warningColor);
this.tenantConfigurationService.persist(formData)
.pipe(takeUntil(this._destroyed)).subscribe(

7
frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.model.ts
View File

@ -60,6 +60,7 @@ export class CssColorsTenantConfigurationEditorModel implements CssColorsTenantC
primaryText: string;
secondaryText: string;
invertedBtnColor: string;
warningColor: string;
protected formBuilder: UntypedFormBuilder = new UntypedFormBuilder();
@ -76,6 +77,7 @@ export class CssColorsTenantConfigurationEditorModel implements CssColorsTenantC
this.primaryText = localStorage.getItem('primaryText') ?? '#ffffff';
this.secondaryText = localStorage.getItem('secondaryText') ?? '#000000';
this.invertedBtnColor = localStorage.getItem('invertedBtnColor') ?? '#ffffff';
this.warningColor = localStorage.getItem('warningColor') ?? '#ff4081';
}
return this;
}
@ -108,6 +110,9 @@ export class CssColorsTenantConfigurationEditorModel implements CssColorsTenantC
secondaryTextInput: [{ value: this.secondaryText, disabled: disabled}, context.getValidation('secondaryTextInput').validators ],
primaryTextInput: [{ value: this.primaryText, disabled: disabled}, context.getValidation('primaryTextInput').validators ],
invertedBtnColorInput: [{ value: this.invertedBtnColor, disabled: disabled}, context.getValidation('invertedBtnColorInput').validators ],
warningColor: [{ value: this.warningColor, disabled: disabled }, context.getValidation('secondaryText').validators],
warningColorInput: [{ value: this.warningColor, disabled: disabled }, context.getValidation('invertedBtnColor').validators],
},
{ updateOn: "change" });
@ -137,6 +142,8 @@ export class CssColorsTenantConfigurationEditorModel implements CssColorsTenantC
baseValidationArray.push({ key: 'primaryTextInput', validators: [validColorValidator()] });
baseValidationArray.push({ key: 'secondaryTextInput', validators: [validColorValidator()] });
baseValidationArray.push({ key: 'invertedBtnColorInput', validators: [validColorValidator()] });
baseValidationArray.push({ key: 'warningColor', validators: [validColorValidator()] });
baseValidationArray.push({ key: 'warningColorInput', validators: [validColorValidator()] });
baseContext.validation = baseValidationArray;
return baseContext;

1
frontend/src/assets/i18n/baq.json
View File

@ -479,6 +479,7 @@
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color",
"INVERTED-BUTTON-HINT": "Background color for buttons whose text color is the selected Primary color",
"WARNING-COLOR": "Warning Color",
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
"DEPOSIT-PLUGINS": "Plugin",
"FILE-TRANSFORMER-PLUGINS": "Plugin",

1
frontend/src/assets/i18n/de.json
View File

@ -482,6 +482,7 @@
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color",
"INVERTED-BUTTON-HINT": "Background color for buttons whose text color is the selected Primary color",
"WARNING-COLOR": "Warning Color",
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
"DEPOSIT-PLUGINS": "Plugin",
"FILE-TRANSFORMER-PLUGINS": "Plugin",

1
frontend/src/assets/i18n/en.json
View File

@ -488,6 +488,7 @@
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color",
"INVERTED-BUTTON-HINT": "Background color for buttons whose text color is the selected Primary color",
"WARNING-COLOR": "Warning Color",
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
"DEPOSIT-PLUGINS": "Plugin",
"FILE-TRANSFORMER-PLUGINS": "Plugin",

1
frontend/src/assets/i18n/es.json
View File

@ -482,6 +482,7 @@
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color",
"INVERTED-BUTTON-HINT": "Background color for buttons whose text color is the selected Primary color",
"WARNING-COLOR": "Warning Color",
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
"DEPOSIT-PLUGINS": "Plugin",
"FILE-TRANSFORMER-PLUGINS": "Plugin",

1
frontend/src/assets/i18n/gr.json
View File

@ -482,6 +482,7 @@
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color",
"INVERTED-BUTTON-HINT": "Background color for buttons whose text color is the selected Primary color",
"WARNING-COLOR": "Warning Color",
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
"DEPOSIT-PLUGINS": "Plugin",
"FILE-TRANSFORMER-PLUGINS": "Plugin",

1
frontend/src/assets/i18n/hr.json
View File

@ -481,6 +481,7 @@
"PRIMARY-COLOR-TEXT": "Primary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color",
"INVERTED-BUTTON-HINT": "Background color for buttons whose text color is the selected Primary color",
"WARNING-COLOR": "Warning Color",
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
"DEPOSIT-PLUGINS": "Plugin",
"FILE-TRANSFORMER-PLUGINS": "Plugin",

1
frontend/src/assets/i18n/pl.json
View File

@ -482,6 +482,7 @@
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color",
"INVERTED-BUTTON-HINT": "Background color for buttons whose text color is the selected Primary color",
"WARNING-COLOR": "Warning Color",
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
"DEPOSIT-PLUGINS": "Plugin",
"FILE-TRANSFORMER-PLUGINS": "Plugin",

1
frontend/src/assets/i18n/pt.json
View File

@ -481,6 +481,7 @@
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color",
"INVERTED-BUTTON-HINT": "Background color for buttons whose text color is the selected Primary color",
"WARNING-COLOR": "Warning Color",
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
"DEPOSIT-PLUGINS": "Plugin",
"FILE-TRANSFORMER-PLUGINS": "Plugin",

1
frontend/src/assets/i18n/sk.json
View File

@ -482,6 +482,7 @@
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color",
"INVERTED-BUTTON-HINT": "Background color for buttons whose text color is the selected Primary color",
"WARNING-COLOR": "Warning Color",
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
"DEPOSIT-PLUGINS": "Plugin",
"FILE-TRANSFORMER-PLUGINS": "Plugin",

1
frontend/src/assets/i18n/sr.json
View File

@ -482,6 +482,7 @@
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color",
"INVERTED-BUTTON-HINT": "Background color for buttons whose text color is the selected Primary color",
"WARNING-COLOR": "Warning Color",
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
"DEPOSIT-PLUGINS": "Plugin",
"FILE-TRANSFORMER-PLUGINS": "Plugin",

1
frontend/src/assets/i18n/tr.json
View File

@ -482,6 +482,7 @@
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
"INVERTED-BUTTON-COLOR": "Inverted Button Color",
"INVERTED-BUTTON-HINT": "Background color for buttons whose text color is the selected Primary color",
"WARNING-COLOR": "Warning Color",
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
"DEPOSIT-PLUGINS": "Plugin",
"FILE-TRANSFORMER-PLUGINS": "Plugin",

2
frontend/src/styles.scss
View File

@ -36,7 +36,7 @@
--secondary-text: #000000;
--inverted-btn-color: #ffffff;
--warning-color: #f44336;
--warning-color: var(--mat-form-field-error-text-color); // #cf1407 for better contrast
--gray: #707070; //previously #848484
--light-gray: #aaaaaa;
--dark-gray: #212121;