add inverted btn color tenant option, fix mat checkbox text color, remove some unused styles
This commit is contained in:
parent
453cde406e
commit
37fcd1edc5
|
@ -75,6 +75,7 @@ export interface CssColorsTenantConfigurationPersist{
|
|||
secondaryColor: string;
|
||||
primaryText?: string;
|
||||
secondaryText?: string;
|
||||
invertedBtnColor?: string;
|
||||
}
|
||||
|
||||
export interface DefaultUserLocaleTenantConfigurationPersist{
|
||||
|
|
|
@ -89,6 +89,7 @@ export class TenantHandlingService extends BaseService {
|
|||
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'));
|
||||
if (localStorage.getItem('invertedBtnColor')) document.documentElement.style.setProperty(`--inverted-btn-color`, localStorage.getItem('invertedBtnColor'));
|
||||
}
|
||||
}
|
||||
}
|
|
@ -33,20 +33,6 @@
|
|||
background-color: #b0b0b0;
|
||||
}
|
||||
|
||||
.finalize-btn {
|
||||
border-radius: 30px;
|
||||
border: 1px solid var(--primary-color);
|
||||
background: var(--primary-text);
|
||||
padding-left: 2em;
|
||||
padding-right: 2em;
|
||||
box-shadow: 0px 3px 6px #1E202029;
|
||||
color: var(--primary-color);
|
||||
&:disabled{
|
||||
background-color: #CBCBCB;
|
||||
color: #FFF;
|
||||
border: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
.dlt-section-btn {
|
||||
margin: 0;
|
||||
|
|
|
@ -13,31 +13,6 @@ min-width: 101px;
|
|||
font-weight: 500;
|
||||
}
|
||||
|
||||
.next-btn {
|
||||
background: var(--primary-text) 0% 0% no-repeat padding-box;
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
min-width: 101px;
|
||||
height: 43px;
|
||||
color: var(--primary-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.next-btn[disabled] {
|
||||
width: 100px;
|
||||
height: 43px;
|
||||
background: #ffffff 0% 0% no-repeat padding-box;
|
||||
border: 1px solid #b5b5b5;
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.next-btn:not([disabled]):hover {
|
||||
background-color: var(--primary-color);
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
||||
//ngx dropzone
|
||||
.drop-file {
|
||||
background-color: #fafafa;
|
||||
|
|
|
@ -82,6 +82,19 @@
|
|||
<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 [matTooltip]="'TENANT-CONFIGURATION-EDITOR.FIELDS.INVERTED-BUTTON-HINT' | translate">{{'TENANT-CONFIGURATION-EDITOR.FIELDS.INVERTED-BUTTON-COLOR' | translate}}</mat-label>
|
||||
<input matInput [formControl]="formGroup.get('cssColors')?.get('invertedBtnColorInput')" required />
|
||||
<ngx-colors
|
||||
class="suffix"
|
||||
matSuffix
|
||||
ngx-colors-trigger
|
||||
[formControl]="formGroup.get('cssColors')?.get('invertedBtnColor')"
|
||||
></ngx-colors>
|
||||
<mat-error *ngIf="formGroup.get('cssColors')?.get('invertedBtnColor')?.hasError('backendError')">{{formGroup.get('cssColors')?.get('invertedBtnColor')?.getError('backendError').message}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('cssColors')?.get('invertedBtnColor')?.hasError('required')">{{'GENERAL.VALIDATION.REQUIRED' | translate}}</mat-error>
|
||||
<mat-error *ngIf="formGroup.get('cssColors')?.get('invertedBtnColor')?.hasError('invalidColor')">{{'GENERAL.VALIDATION.INVALID-COLOR' | translate}}</mat-error>
|
||||
</mat-form-field>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-12">
|
||||
|
|
|
@ -144,6 +144,16 @@ export class CssColorsEditorComponent extends BasePendingChangesComponent implem
|
|||
emitEvent: false,
|
||||
});
|
||||
});
|
||||
this.formGroup.get('cssColors')?.get('invertedBtnColor').valueChanges.subscribe((color) => {
|
||||
this.formGroup.get('cssColors')?.get('invertedBtnColorInput').setValue(color, {
|
||||
emitEvent: false,
|
||||
});
|
||||
});
|
||||
this.formGroup.get('cssColors')?.get('invertedBtnColorInput').valueChanges.subscribe((color) => {
|
||||
this.formGroup.get('cssColors')?.get('invertedBtnColor').setValue(color, {
|
||||
emitEvent: false,
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
getItem(successFunction: (item: TenantConfiguration) => void) {
|
||||
|
@ -203,6 +213,7 @@ export class CssColorsEditorComponent extends BasePendingChangesComponent implem
|
|||
const formData = this.formService.getValue(this.formGroup.value) as TenantConfigurationPersist;
|
||||
localStorage.setItem('primaryText', formData?.cssColors?.primaryText);
|
||||
localStorage.setItem('secondaryText', formData?.cssColors?.secondaryText);
|
||||
localStorage.setItem('invertedBtnColor', formData?.cssColors?.invertedBtnColor);
|
||||
|
||||
this.tenantConfigurationService.persist(formData)
|
||||
.pipe(takeUntil(this._destroyed)).subscribe(
|
||||
|
|
|
@ -59,6 +59,7 @@ export class CssColorsTenantConfigurationEditorModel implements CssColorsTenantC
|
|||
secondaryColor: string;
|
||||
primaryText: string;
|
||||
secondaryText: string;
|
||||
invertedBtnColor: string;
|
||||
|
||||
protected formBuilder: UntypedFormBuilder = new UntypedFormBuilder();
|
||||
|
||||
|
@ -72,8 +73,9 @@ 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'
|
||||
this.primaryText = localStorage.getItem('primaryText') ?? '#ffffff';
|
||||
this.secondaryText = localStorage.getItem('secondaryText') ?? '#000000';
|
||||
this.invertedBtnColor = localStorage.getItem('invertedBtnColor') ?? '#ffffff';
|
||||
}
|
||||
return this;
|
||||
}
|
||||
|
@ -98,12 +100,14 @@ export class CssColorsTenantConfigurationEditorModel implements CssColorsTenantC
|
|||
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],
|
||||
invertedBtnColor: [{ value: this.invertedBtnColor, disabled: disabled }, context.getValidation('invertedBtnColor').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 ],
|
||||
invertedBtnColorInput: [{ value: this.invertedBtnColor, disabled: disabled}, context.getValidation('invertedBtnColorInput').validators ],
|
||||
},
|
||||
{ updateOn: "change" });
|
||||
|
||||
|
@ -125,12 +129,14 @@ export class CssColorsTenantConfigurationEditorModel implements CssColorsTenantC
|
|||
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: 'invertedBtnColor', validators: [validColorValidator(), Validators.required, BackendErrorValidator(validationErrorModel, `${rootPath}invertedBtnColor`)] });
|
||||
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()] });
|
||||
baseValidationArray.push({ key: 'invertedBtnColorInput', validators: [validColorValidator()] });
|
||||
|
||||
baseContext.validation = baseValidationArray;
|
||||
return baseContext;
|
||||
|
|
|
@ -27,30 +27,6 @@ img {
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
.send-btn {
|
||||
background: var(--primary-text) 0% 0% no-repeat padding-box;
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
min-width: 101px;
|
||||
height: 43px;
|
||||
color: var(--primary-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.send-btn-disabled {
|
||||
min-width: 6.64em;
|
||||
height: 2.93em;
|
||||
background: #FFFFFF;
|
||||
border: 1px solid #B5B5B5;
|
||||
border-radius: 30px;
|
||||
font-weight: bold;
|
||||
letter-spacing: -0.35px;
|
||||
color: #B5B5B5;
|
||||
margin-bottom: 0.25em;
|
||||
cursor: default;
|
||||
}
|
||||
|
||||
.cancel-btn {
|
||||
background: #ffffff 0% 0% no-repeat padding-box;
|
||||
border: 1px solid #B5B5B5;
|
||||
|
|
|
@ -28,6 +28,6 @@
|
|||
</div>
|
||||
<div mat-dialog-actions class="row">
|
||||
<div class="col-auto ml-auto"><button mat-button class="rounded-btn neutral" type="button" (click)="cancel()">{{ data.cancelButton }}</button></div>
|
||||
<div class="col-auto"><button mat-button class="confirm-btn" type="button" [disabled]="!data.formGroup.valid" (click)="confirm()">{{ data.confirmButton }}</button></div>
|
||||
<div class="col-auto"><button mat-button class="rounded-btn primary-inverted primary-inverted-hover confirm-btn" type="button" [disabled]="!data.formGroup.valid" (click)="confirm()">{{ data.confirmButton }}</button></div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -17,17 +17,6 @@ min-width: 101px;
|
|||
}
|
||||
|
||||
.confirm-btn {
|
||||
background: var(--primary-text) 0% 0% no-repeat padding-box;
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
min-width: 101px;
|
||||
min-width: 101px;
|
||||
height: 43px;
|
||||
color: var(--primary-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.confirm-btn:hover {
|
||||
background-color: var(--primary-color);
|
||||
color: var(--primary-text);
|
||||
}
|
|
@ -179,7 +179,7 @@
|
|||
|
||||
.plan-btn-label {
|
||||
margin-right: 1em;
|
||||
color: #ffffff;
|
||||
color: var(--primary-text);
|
||||
opacity: 0.8;
|
||||
text-align: left;
|
||||
min-width: 0;
|
||||
|
|
|
@ -59,22 +59,6 @@
|
|||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.save-btn, .plan-export-btn {
|
||||
background: var(--primary-text) 0% 0% no-repeat padding-box !important;
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
width: auto;
|
||||
min-width: 110px;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
color: var(--primary-color);
|
||||
&:disabled {
|
||||
color: #CBCBCB;
|
||||
}
|
||||
}
|
||||
|
||||
.plan-stepper {
|
||||
position: fixed;
|
||||
display: flex;
|
||||
|
|
|
@ -63,11 +63,6 @@
|
|||
color: black;
|
||||
}
|
||||
|
||||
.close-btn {
|
||||
margin-left: auto;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.descriptions span {
|
||||
color: var(--primary-color-3);
|
||||
}
|
||||
|
@ -76,57 +71,3 @@
|
|||
font-style: italic;
|
||||
color: rgba(0, 0, 0, 0.26);
|
||||
}
|
||||
|
||||
.save-btn {
|
||||
background: var(--primary-color) 0% 0% no-repeat padding-box;
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
width: auto;
|
||||
height: 40px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
font-weight: 700;
|
||||
color: var(--primary-text);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.submit-btn {
|
||||
min-width: 84px;
|
||||
height: 43px;
|
||||
background: var(--primary-text);
|
||||
color: var(--primary-color);
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.submit-btn[disabled] {
|
||||
border: 1px solid #b5b5b5 !important;
|
||||
}
|
||||
|
||||
.submit-btn:not([disabled]):hover {
|
||||
background-color: var(--primary-color);
|
||||
color: var(--primary-text);
|
||||
}
|
||||
|
||||
.default-btn {
|
||||
background: #ffffff 0% 0% no-repeat padding-box;
|
||||
box-shadow: 0px 3px 6px #1e202029;
|
||||
border: 1px solid #b5b5b5;
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
font-size: 0.87rem;
|
||||
font-weight: 500;
|
||||
color: var(--dark-gray);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.cancel-btn {
|
||||
min-width: 101px;
|
||||
height: 43px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #b5b5b5;
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
|
|
|
@ -19,28 +19,4 @@
|
|||
.template-title {
|
||||
margin-left: 37px;
|
||||
}
|
||||
|
||||
.cancel-btn {
|
||||
min-width: 101px;
|
||||
height: 43px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #b5b5b5;
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.add-btn {
|
||||
width: 84px;
|
||||
height: 43px;
|
||||
background: var(--primary-text);
|
||||
color: var(--primary-color);
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.add-btn:hover {
|
||||
background-color: var(--primary-color);
|
||||
color: var(--primary-text);
|
||||
}
|
||||
}
|
||||
|
|
|
@ -470,6 +470,8 @@
|
|||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"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",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -473,6 +473,8 @@
|
|||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"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",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -479,6 +479,8 @@
|
|||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"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",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -473,6 +473,8 @@
|
|||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"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",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -473,6 +473,8 @@
|
|||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"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",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -472,7 +472,8 @@
|
|||
"PRIMARY-COLOR-3": "Primary Color 3",
|
||||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"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",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -473,6 +473,8 @@
|
|||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"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",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -473,6 +473,8 @@
|
|||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"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",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -473,6 +473,8 @@
|
|||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"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",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -473,6 +473,8 @@
|
|||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"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",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -473,6 +473,8 @@
|
|||
"SECONDARY-COLOR": "Secondary Color",
|
||||
"PRIMARY-COLOR-TEXT": "Primary Color Text",
|
||||
"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",
|
||||
"DISABLE-SYSTEM-SOURCES": "Disable System Sources",
|
||||
"DEPOSIT-PLUGINS": "Plugin",
|
||||
"FILE-TRANSFORMER-PLUGINS": "Plugin",
|
||||
|
|
|
@ -44,7 +44,7 @@ a{
|
|||
label{
|
||||
font-size: 14px;
|
||||
line-height: 1.42857;
|
||||
color: $checkboxes-text-color;
|
||||
color: var(--gray);
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
|
|
|
@ -53,7 +53,6 @@ $bmd-checkbox-animation-ripple: 500ms !default;
|
|||
$bmd-checkbox-animation-check: 0.3s !default;
|
||||
$bmd-checkbox-checked-color: $white !default;
|
||||
$bmd-checkbox-label-padding: .3125rem !default; // 5px
|
||||
$checkboxes-text-color: $mdb-input-placeholder-color !default;
|
||||
|
||||
$bmd-checkbox-border-size: .0625rem !default;
|
||||
$bmd-checkbox-border-color: $bmd-label-color-inner-focus !default;
|
||||
|
|
|
@ -45,36 +45,6 @@
|
|||
line-height: 1.9rem;
|
||||
}
|
||||
|
||||
.cancel-btn {
|
||||
background: #ffffff 0% 0% no-repeat padding-box;
|
||||
border: 1px solid #b5b5b5;
|
||||
border-radius: 30px;
|
||||
min-width: 101px;
|
||||
height: 43px;
|
||||
color: var(--dark-gray);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.next-btn {
|
||||
background: var(--primary-text) 0% 0% no-repeat padding-box;
|
||||
border: 1px solid var(--primary-color);
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
min-width: 101px;
|
||||
height: 43px;
|
||||
color: var(--primary-color);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.disabled-btn {
|
||||
border: 1px solid #b5b5b5;
|
||||
border-radius: 30px;
|
||||
opacity: 1;
|
||||
min-width: 101px;
|
||||
height: 43px;
|
||||
color: #b5b5b5;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.error-list {
|
||||
margin-bottom: 0;
|
||||
|
|
|
@ -11,6 +11,7 @@
|
|||
--warning-color: #f44336;
|
||||
--primary-text: #ffffff;
|
||||
--secondary-text: #000000;
|
||||
--inverted-btn-color: #ffffff;
|
||||
--gray: #707070; //previously #848484
|
||||
--light-gray: #aaaaaa;
|
||||
--dark-gray: #212121;
|
||||
|
@ -436,9 +437,8 @@ button, .mdc-button, .mat-mdc-button, .mdc-button:has(.material-icons,mat-icon,[
|
|||
color: var(--primary-text);
|
||||
border: none;
|
||||
&:disabled, &.mat-mdc-button.mat-mdc-button-disabled{
|
||||
background: #CBCBCB;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
color: var(--primary-text);
|
||||
opacity: 0.7;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -447,23 +447,22 @@ button, .mdc-button, .mat-mdc-button, .mdc-button:has(.material-icons,mat-icon,[
|
|||
color: var(--secondary-text);
|
||||
border: none;
|
||||
&:disabled, &.mat-mdc-button.mat-mdc-button-disabled{
|
||||
background: #CBCBCB;
|
||||
color: #ffffff;
|
||||
border: none;
|
||||
color: var(--secondary-text);
|
||||
opacity: 0.7;
|
||||
}
|
||||
}
|
||||
|
||||
&.primary-inverted {
|
||||
color: var(--primary-color);
|
||||
border: 1px solid var(--primary-color);
|
||||
background: var(--primary-text);
|
||||
background: var(--inverted-btn-color);
|
||||
&:disabled, &.mat-mdc-button.mat-mdc-button-disabled{
|
||||
border: 1px solid #CBCBCB;
|
||||
color: #CBCBCB;
|
||||
color: var(--primary-color);
|
||||
opacity: 0.7;
|
||||
}
|
||||
&.primary-inverted-hover:hover {
|
||||
background-color: var(--primary-color);
|
||||
color: var(--primary-text);
|
||||
color: var(--inverted-btn-color);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -651,3 +650,12 @@ ul.unstyled-list {
|
|||
border-top: none !important;
|
||||
border: none;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// .mat-checkbox-checked.mat-accent .mat-checkbox-background, .mat-checkbox-indeterminate.mat-accent .mat-checkbox-background {
|
||||
// background-color: var(--primary-color-3);
|
||||
// }
|
||||
// .mat-checkbox-disabled.mat-checkbox-checked .mat-checkbox-background, .mat-checkbox-disabled.mat-checkbox-indeterminate .mat-checkbox-background {
|
||||
// background-color: #b0b0b0;
|
||||
// }
|
Loading…
Reference in New Issue