add pseudo tenant settings primary text color, secondary text color saved in local storage
This commit is contained in:
parent
2146c564b7
commit
1f6e471563
|
@ -73,6 +73,8 @@ export interface CssColorsTenantConfigurationPersist{
|
|||
primaryColor2: string;
|
||||
primaryColor3: string;
|
||||
secondaryColor: string;
|
||||
primaryText?: string;
|
||||
secondaryText?: string;
|
||||
}
|
||||
|
||||
export interface DefaultUserLocaleTenantConfigurationPersist{
|
||||
|
|
|
@ -87,6 +87,8 @@ export class TenantHandlingService extends BaseService {
|
|||
if (cssColors.primaryColor2) document.documentElement.style.setProperty(`--primary-color-2`, cssColors.primaryColor2);
|
||||
if (cssColors.primaryColor3) document.documentElement.style.setProperty(`--primary-color-3`, cssColors.primaryColor3);
|
||||
if (cssColors.secondaryColor) document.documentElement.style.setProperty(`--secondary-color`, cssColors.secondaryColor);
|
||||
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'));
|
||||
}
|
||||
}
|
||||
}
|
|
@ -4,7 +4,7 @@
|
|||
width: 100%;
|
||||
height: 89px;
|
||||
background-color: var(--primary-color);
|
||||
color: #FFFFFF;
|
||||
color: var(--primary-color-text);
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
|
|
|
@ -55,7 +55,7 @@ $blue-color-light: #5cf7f2;
|
|||
margin-right: 0.5em;
|
||||
margin-left: -.09em;
|
||||
height: auto;
|
||||
color: var(--primary-color);;
|
||||
color: var(--primary-color);
|
||||
}
|
||||
.input_icon{
|
||||
width: 14px;
|
||||
|
|
|
@ -36,7 +36,7 @@
|
|||
.finalize-btn {
|
||||
border-radius: 30px;
|
||||
border: 1px solid var(--primary-color);
|
||||
background: transparent;
|
||||
background: var(--primary-text);
|
||||
padding-left: 2em;
|
||||
padding-right: 2em;
|
||||
box-shadow: 0px 3px 6px #1E202029;
|
||||
|
|
|
@ -14,7 +14,7 @@ min-width: 101px;
|
|||
}
|
||||
|
||||
.next-btn {
|
||||
background: #ffffff 0% 0% no-repeat padding-box;
|
||||
background: var(--primary-text) 0% 0% no-repeat padding-box;
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
|
@ -35,7 +35,7 @@ min-width: 101px;
|
|||
|
||||
.next-btn:not([disabled]):hover {
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
||||
//ngx dropzone
|
||||
|
|
|
@ -56,6 +56,32 @@
|
|||
<mat-error *ngIf="formGroup.get('cssColors')?.get('secondaryColor')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('cssColors')?.get('secondaryColor')?.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.PRIMARY-COLOR-TEXT' | translate}}</mat-label>
|
||||
<input matInput [formControl]="formGroup.get('cssColors')?.get('primaryTextInput')" required />
|
||||
<ngx-colors
|
||||
class="suffix"
|
||||
matSuffix
|
||||
ngx-colors-trigger
|
||||
[formControl]="formGroup.get('cssColors')?.get('primaryText')"
|
||||
></ngx-colors>
|
||||
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryText')?.hasError('backendError')">{{formGroup.get('cssColors')?.get('primaryText')?.getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryText')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('cssColors')?.get('primaryText')?.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.SECONDARY-COLOR-TEXT' | translate}}</mat-label>
|
||||
<input matInput [formControl]="formGroup.get('cssColors')?.get('secondaryTextInput')" required />
|
||||
<ngx-colors
|
||||
class="suffix"
|
||||
matSuffix
|
||||
ngx-colors-trigger
|
||||
[formControl]="formGroup.get('cssColors')?.get('secondaryText')"
|
||||
></ngx-colors>
|
||||
<mat-error *ngIf="formGroup.get('cssColors')?.get('secondaryText')?.hasError('backendError')">{{formGroup.get('cssColors')?.get('secondaryText')?.getError('backendError').message}}</mat-error>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
|
|
|
@ -122,6 +122,28 @@ export class CssColorsEditorComponent extends BasePendingChangesComponent implem
|
|||
emitEvent: false,
|
||||
})
|
||||
);
|
||||
|
||||
this.formGroup.get('cssColors')?.get('primaryTextInput').valueChanges.subscribe((color) => {
|
||||
this.formGroup.get('cssColors')?.get('primaryText').setValue(color, {
|
||||
emitEvent: false,
|
||||
});
|
||||
});
|
||||
this.formGroup.get('cssColors')?.get('secondaryTextInput').valueChanges.subscribe((color) => {
|
||||
this.formGroup.get('cssColors')?.get('secondaryText').setValue(color, {
|
||||
emitEvent: false,
|
||||
});
|
||||
});
|
||||
|
||||
this.formGroup.get('cssColors')?.get('primaryText').valueChanges.subscribe((color) => {
|
||||
this.formGroup.get('cssColors')?.get('primaryTextInput').setValue(color, {
|
||||
emitEvent: false,
|
||||
});
|
||||
});
|
||||
this.formGroup.get('cssColors')?.get('secondaryText').valueChanges.subscribe((color) => {
|
||||
this.formGroup.get('cssColors')?.get('secondaryTextInput').setValue(color, {
|
||||
emitEvent: false,
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
getItem(successFunction: (item: TenantConfiguration) => void) {
|
||||
|
@ -179,6 +201,8 @@ export class CssColorsEditorComponent extends BasePendingChangesComponent implem
|
|||
|
||||
persistEntity(onSuccess?: (response) => void): void {
|
||||
const formData = this.formService.getValue(this.formGroup.value) as TenantConfigurationPersist;
|
||||
localStorage.setItem('primaryText', formData?.cssColors?.primaryText);
|
||||
localStorage.setItem('secondaryText', formData?.cssColors?.secondaryText);
|
||||
|
||||
this.tenantConfigurationService.persist(formData)
|
||||
.pipe(takeUntil(this._destroyed)).subscribe(
|
||||
|
|
|
@ -57,6 +57,8 @@ export class CssColorsTenantConfigurationEditorModel implements CssColorsTenantC
|
|||
primaryColor2: string;
|
||||
primaryColor3: string;
|
||||
secondaryColor: string;
|
||||
primaryText: string;
|
||||
secondaryText: string;
|
||||
|
||||
protected formBuilder: UntypedFormBuilder = new UntypedFormBuilder();
|
||||
|
||||
|
@ -70,6 +72,8 @@ export class CssColorsTenantConfigurationEditorModel implements CssColorsTenantC
|
|||
this.primaryColor2 = item.primaryColor2;
|
||||
this.primaryColor3 = item.primaryColor3;
|
||||
this.secondaryColor = item.secondaryColor;
|
||||
this.primaryText = localStorage.getItem('primaryText') ?? '#ffffff'
|
||||
this.secondaryText = localStorage.getItem('secondaryText') ?? '#000000'
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
@ -89,13 +93,17 @@ export class CssColorsTenantConfigurationEditorModel implements CssColorsTenantC
|
|||
|
||||
const form: UntypedFormGroup = this.formBuilder.group({
|
||||
primaryColor: [{ value: this.primaryColor, disabled: disabled }, context.getValidation('primaryColor').validators],
|
||||
primaryText: [{ value: this.primaryText, disabled: disabled }, context.getValidation('primaryText').validators],
|
||||
primaryColor2: [{ value: this.primaryColor2, disabled: disabled }, context.getValidation('primaryColor2').validators],
|
||||
primaryColor3: [{ value: this.primaryColor3, disabled: disabled }, context.getValidation('primaryColor3').validators],
|
||||
secondaryColor: [{ value: this.secondaryColor, disabled: disabled }, context.getValidation('secondaryColor').validators],
|
||||
secondaryText: [{ value: this.secondaryText, disabled: disabled }, context.getValidation('secondaryText').validators],
|
||||
primaryColorInput: [{ value: this.primaryColor, disabled: disabled}, context.getValidation('primaryColorInput').validators ],
|
||||
primaryColor2Input: [{ value: this.primaryColor2, disabled: disabled}, context.getValidation('primaryColor2Input').validators ],
|
||||
primaryColor3Input: [{ value: this.primaryColor3, disabled: disabled}, context.getValidation('primaryColor3Input').validators ],
|
||||
secondaryColorInput: [{ value: this.secondaryColor, disabled: disabled}, context.getValidation('secondaryColorInput').validators ],
|
||||
secondaryTextInput: [{ value: this.secondaryText, disabled: disabled}, context.getValidation('secondaryTextInput').validators ],
|
||||
primaryTextInput: [{ value: this.primaryText, disabled: disabled}, context.getValidation('primaryTextInput').validators ],
|
||||
},
|
||||
{ updateOn: "change" });
|
||||
|
||||
|
@ -115,10 +123,14 @@ export class CssColorsTenantConfigurationEditorModel implements CssColorsTenantC
|
|||
baseValidationArray.push({ key: 'primaryColor2', validators: [validColorValidator(), Validators.required, BackendErrorValidator(validationErrorModel, `${rootPath}primaryColor2`)] });
|
||||
baseValidationArray.push({ key: 'primaryColor3', validators: [validColorValidator(), Validators.required, BackendErrorValidator(validationErrorModel, `${rootPath}primaryColor3`)] });
|
||||
baseValidationArray.push({ key: 'secondaryColor', validators: [validColorValidator(), Validators.required, BackendErrorValidator(validationErrorModel, `${rootPath}secondaryColor`)] });
|
||||
baseValidationArray.push({ key: 'primaryText', validators: [validColorValidator(), Validators.required, BackendErrorValidator(validationErrorModel, `${rootPath}primaryColorText`)] });
|
||||
baseValidationArray.push({ key: 'secondaryText', validators: [validColorValidator(), Validators.required, BackendErrorValidator(validationErrorModel, `${rootPath}secondaryColorText`)] });
|
||||
baseValidationArray.push({ key: 'primaryColorInput', validators: [validColorValidator()] });
|
||||
baseValidationArray.push({ key: 'primaryColor2Input', validators: [validColorValidator()] });
|
||||
baseValidationArray.push({ key: 'primaryColor3Input', validators: [validColorValidator()] });
|
||||
baseValidationArray.push({ key: 'secondaryColorInput', validators: [validColorValidator()] });
|
||||
baseValidationArray.push({ key: 'primaryTextInput', validators: [validColorValidator()] });
|
||||
baseValidationArray.push({ key: 'secondaryTextInput', validators: [validColorValidator()] });
|
||||
|
||||
baseContext.validation = baseValidationArray;
|
||||
return baseContext;
|
||||
|
|
|
@ -65,7 +65,7 @@ $mat-card-header-size: 40px !default;
|
|||
|
||||
.comments-count {
|
||||
background-color: var(--primary-color) !important;// #129D99;
|
||||
color: #FFFFFF !important;
|
||||
color: var(--primary-text) !important;
|
||||
min-width: 2rem;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
|
|
@ -28,7 +28,7 @@ img {
|
|||
}
|
||||
|
||||
.send-btn {
|
||||
background: #ffffff 0% 0% no-repeat padding-box;
|
||||
background: var(--primary-text) 0% 0% no-repeat padding-box;
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
|
|
|
@ -62,7 +62,7 @@
|
|||
box-shadow: 0px 3px 6px #1e202029;
|
||||
border-radius: 30px;
|
||||
border: none;
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
opacity: 1;
|
||||
line-height: 1;
|
||||
font-size: 0.87rem;
|
||||
|
@ -78,7 +78,7 @@
|
|||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
border: none;
|
||||
color: #000000;
|
||||
color: var(--secondary-text);
|
||||
opacity: 1;
|
||||
line-height: 1;
|
||||
font-size: 0.87rem;
|
||||
|
@ -179,7 +179,7 @@ input[type="text"] {
|
|||
opacity: 1;
|
||||
min-width: 67px;
|
||||
height: 37px;
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
line-height: 2.4;
|
||||
}
|
||||
|
||||
|
|
|
@ -19,7 +19,7 @@ input[type="text"] {
|
|||
opacity: 1;
|
||||
min-width: 67px;
|
||||
height: 37px;
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
line-height: 2.4;
|
||||
}
|
||||
|
||||
|
|
|
@ -17,7 +17,7 @@ min-width: 101px;
|
|||
}
|
||||
|
||||
.confirm-btn {
|
||||
background: #ffffff 0% 0% no-repeat padding-box;
|
||||
background: var(--primary-text) 0% 0% no-repeat padding-box;
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
|
@ -29,5 +29,5 @@ min-width: 101px;
|
|||
|
||||
.confirm-btn:hover {
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
|
|
@ -171,7 +171,7 @@
|
|||
min-width: 67px;
|
||||
height: 37px;
|
||||
background: var(--primary-color) 0% 0% no-repeat padding-box;
|
||||
color: white;
|
||||
color: var(--primary-text);
|
||||
border-radius: 4px;
|
||||
opacity: 1;
|
||||
display: flex;
|
||||
|
@ -331,7 +331,7 @@
|
|||
|
||||
.next {
|
||||
background: var(--primary-color) 0% 0% no-repeat padding-box;
|
||||
color: white;
|
||||
color: var(--primary-text);
|
||||
box-shadow: 0px 3px 6px #1e202029;
|
||||
font-weight: 400;
|
||||
cursor: pointer;
|
||||
|
|
|
@ -116,7 +116,7 @@ input[type="text"] {
|
|||
opacity: 1;
|
||||
min-width: 67px;
|
||||
height: 37px;
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
line-height: 2.4;
|
||||
}
|
||||
|
||||
|
|
|
@ -24,7 +24,7 @@
|
|||
.actions-btn:hover,
|
||||
.finalize-btn:hover {
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
||||
.status-icon {
|
||||
|
@ -70,7 +70,7 @@
|
|||
|
||||
.plan-btn,
|
||||
.plan-btn > mat-icon {
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
||||
.show-more-btn {
|
||||
|
|
|
@ -147,7 +147,7 @@ input[type="text"] {
|
|||
opacity: 1;
|
||||
min-width: 67px;
|
||||
height: 37px;
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
line-height: 2.4;
|
||||
}
|
||||
|
||||
|
|
|
@ -15,7 +15,7 @@
|
|||
width: 2.5em;
|
||||
height: 2.5em;
|
||||
background-color: var(--primary-color);
|
||||
color: white;
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
||||
.mat-mini-fab-icon,
|
||||
|
@ -110,7 +110,7 @@
|
|||
background: var(--primary-color);
|
||||
border-radius: 4px;
|
||||
font-size: 0.875em;
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
||||
.label-txt {
|
||||
|
|
|
@ -29,6 +29,6 @@
|
|||
|
||||
.delete-btn:hover {
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -60,7 +60,7 @@
|
|||
}
|
||||
|
||||
.save-btn, .plan-export-btn {
|
||||
background: #ffffff 0% 0% no-repeat padding-box !important;
|
||||
background: var(--primary-text) 0% 0% no-repeat padding-box !important;
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
width: auto;
|
||||
|
|
|
@ -87,14 +87,14 @@
|
|||
justify-content: center;
|
||||
align-items: center;
|
||||
font-weight: 700;
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
min-width: 84px;
|
||||
height: 43px;
|
||||
background: #ffffff;
|
||||
background: var(--primary-text);
|
||||
color: var(--primary-color);
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
|
@ -107,7 +107,7 @@
|
|||
|
||||
.submit-btn:not([disabled]):hover {
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
||||
.default-btn {
|
||||
|
|
|
@ -5,7 +5,7 @@
|
|||
width: 100%;
|
||||
height: 89px;
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
|
||||
|
@ -32,7 +32,7 @@
|
|||
.add-btn {
|
||||
width: 84px;
|
||||
height: 43px;
|
||||
background: #ffffff;
|
||||
background: var(--primary-text);
|
||||
color: var(--primary-color);
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
|
@ -41,6 +41,6 @@
|
|||
|
||||
.add-btn:hover {
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -468,6 +468,8 @@
|
|||
"PRIMARY-COLOR-2": "Primary Color 2",
|
||||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -468,6 +468,8 @@
|
|||
"PRIMARY-COLOR-2": "Primary Color 2",
|
||||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -474,6 +474,8 @@
|
|||
"PRIMARY-COLOR-2": "Primary Color 2",
|
||||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -468,6 +468,8 @@
|
|||
"PRIMARY-COLOR-2": "Primary Color 2",
|
||||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -468,6 +468,8 @@
|
|||
"PRIMARY-COLOR-2": "Primary Color 2",
|
||||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -468,6 +468,8 @@
|
|||
"PRIMARY-COLOR-2": "Primary Color 2",
|
||||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -468,6 +468,8 @@
|
|||
"PRIMARY-COLOR-2": "Primary Color 2",
|
||||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -468,6 +468,8 @@
|
|||
"PRIMARY-COLOR-2": "Primary Color 2",
|
||||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -468,6 +468,8 @@
|
|||
"PRIMARY-COLOR-2": "Primary Color 2",
|
||||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -468,6 +468,8 @@
|
|||
"PRIMARY-COLOR-2": "Primary Color 2",
|
||||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -468,6 +468,8 @@
|
|||
"PRIMARY-COLOR-2": "Primary Color 2",
|
||||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"SECONDARY-COLOR-TEXT": "Secondary Color Text",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -56,7 +56,7 @@ min-width: 101px;
|
|||
}
|
||||
|
||||
.next-btn {
|
||||
background: #ffffff 0% 0% no-repeat padding-box;
|
||||
background: var(--primary-text) 0% 0% no-repeat padding-box;
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
|
|
|
@ -15,7 +15,7 @@
|
|||
box-shadow: 0px 3px 6px #1E202029;
|
||||
border-radius: 30px;
|
||||
border: none;
|
||||
color: #FFFFFF;
|
||||
color: var(--primary-text);
|
||||
opacity: 1;
|
||||
font-size: 0.87rem;
|
||||
padding: 0.62rem 1.87rem;
|
||||
|
|
|
@ -9,6 +9,8 @@
|
|||
--primary-color-3: #246AD3;
|
||||
--secondary-color: #36900B;
|
||||
--warning-color: #f44336;
|
||||
--primary-text: #ffffff;
|
||||
--secondary-text: #000000
|
||||
}
|
||||
|
||||
// Define your theme with color palettes, typography and density
|
||||
|
@ -425,7 +427,7 @@ button, .mdc-button, .mat-mdc-button, .mdc-button:has(.material-icons,mat-icon,[
|
|||
}
|
||||
&.primary {
|
||||
background: var(--primary-color) 0% 0% no-repeat padding-box;
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
border: none;
|
||||
&:disabled, &.mat-mdc-button.mat-mdc-button-disabled{
|
||||
background: #CBCBCB;
|
||||
|
@ -436,7 +438,7 @@ button, .mdc-button, .mat-mdc-button, .mdc-button:has(.material-icons,mat-icon,[
|
|||
|
||||
&.secondary {
|
||||
background: var(--secondary-color) 0% 0% no-repeat padding-box;
|
||||
color: #000000;
|
||||
color: var(--secondary-text);
|
||||
border: none;
|
||||
&:disabled, &.mat-mdc-button.mat-mdc-button-disabled{
|
||||
background: #CBCBCB;
|
||||
|
@ -448,14 +450,14 @@ button, .mdc-button, .mat-mdc-button, .mdc-button:has(.material-icons,mat-icon,[
|
|||
&.primary-inverted {
|
||||
color: var(--primary-color);
|
||||
border: 1px solid var(--primary-color);
|
||||
background: #fafafafa;
|
||||
background: var(--primary-text);
|
||||
&:disabled, &.mat-mdc-button.mat-mdc-button-disabled{
|
||||
border: 1px solid #CBCBCB;
|
||||
color: #CBCBCB;
|
||||
}
|
||||
&.primary-inverted-hover:hover {
|
||||
background-color: var(--primary-color);
|
||||
color: white;
|
||||
color: var(--primary-text);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -508,10 +510,11 @@ button, .mdc-button, .mat-mdc-button, .mdc-button:has(.material-icons,mat-icon,[
|
|||
height: 44px;
|
||||
color: #ffffff;
|
||||
background: var(--primary-color) 0% 0% no-repeat padding-box;
|
||||
color: var(--primary-text);
|
||||
box-shadow: 0px 3px 6px #1e202029;
|
||||
border-radius: 30px;
|
||||
&:hover {
|
||||
background-color: #ffffff;
|
||||
background-color: var(--primary-text);
|
||||
border: 1px solid var(--primary-color);
|
||||
color: var(--primary-color);
|
||||
}
|
||||
|
@ -535,7 +538,7 @@ button, .mdc-button, .mat-mdc-button, .mdc-button:has(.material-icons,mat-icon,[
|
|||
}
|
||||
&.primary{
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
&:hover {
|
||||
background-color: var(--secondary-color);
|
||||
color: #000000;
|
||||
|
@ -545,10 +548,10 @@ button, .mdc-button, .mat-mdc-button, .mdc-button:has(.material-icons,mat-icon,[
|
|||
&.secondary{
|
||||
background-color: var(--secondary-color);
|
||||
|
||||
color: #000000;
|
||||
color: var(--secondary-text);
|
||||
&:hover {
|
||||
background-color: var(--primary-color);
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue