diff --git a/frontend/src/app/core/model/tenant-configuaration/tenant-configuration.ts b/frontend/src/app/core/model/tenant-configuaration/tenant-configuration.ts index fd67504d9..bf6f2d35a 100644 --- a/frontend/src/app/core/model/tenant-configuaration/tenant-configuration.ts +++ b/frontend/src/app/core/model/tenant-configuaration/tenant-configuration.ts @@ -75,6 +75,7 @@ export interface CssColorsTenantConfigurationPersist{ secondaryColor: string; primaryText?: string; secondaryText?: string; + invertedBtnColor?: string; } export interface DefaultUserLocaleTenantConfigurationPersist{ diff --git a/frontend/src/app/core/services/tenant/tenant-handling.service.ts b/frontend/src/app/core/services/tenant/tenant-handling.service.ts index 661ee65d5..dffd84ff3 100644 --- a/frontend/src/app/core/services/tenant/tenant-handling.service.ts +++ b/frontend/src/app/core/services/tenant/tenant-handling.service.ts @@ -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')); } } } \ No newline at end of file diff --git a/frontend/src/app/ui/admin/plan-blueprint/editor/plan-blueprint-editor.component.scss b/frontend/src/app/ui/admin/plan-blueprint/editor/plan-blueprint-editor.component.scss index bb1b3b8f8..0251f5a28 100644 --- a/frontend/src/app/ui/admin/plan-blueprint/editor/plan-blueprint-editor.component.scss +++ b/frontend/src/app/ui/admin/plan-blueprint/editor/plan-blueprint-editor.component.scss @@ -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; diff --git a/frontend/src/app/ui/admin/plan-blueprint/listing/import-plan-blueprint/import-plan-blueprint.dialog.component.scss b/frontend/src/app/ui/admin/plan-blueprint/listing/import-plan-blueprint/import-plan-blueprint.dialog.component.scss index 687e34f96..c7670e8f1 100644 --- a/frontend/src/app/ui/admin/plan-blueprint/listing/import-plan-blueprint/import-plan-blueprint.dialog.component.scss +++ b/frontend/src/app/ui/admin/plan-blueprint/listing/import-plan-blueprint/import-plan-blueprint.dialog.component.scss @@ -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; diff --git a/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.component.html b/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.component.html index 2213f1cce..a5e2d3913 100644 --- a/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.component.html +++ b/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.component.html @@ -82,6 +82,19 @@ {{'GENERAL.VALIDATION.REQUIRED' | translate}} {{'GENERAL.VALIDATION.INVALID-COLOR' | translate}} + + {{'TENANT-CONFIGURATION-EDITOR.FIELDS.INVERTED-BUTTON-COLOR' | translate}} + + + {{formGroup.get('cssColors')?.get('invertedBtnColor')?.getError('backendError').message}} + {{'GENERAL.VALIDATION.REQUIRED' | translate}} + {{'GENERAL.VALIDATION.INVALID-COLOR' | translate}} +
diff --git a/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.component.ts b/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.component.ts index f945f765e..2735adb31 100644 --- a/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.component.ts +++ b/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.component.ts @@ -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( diff --git a/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.model.ts b/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.model.ts index 973acdb8d..d48e5a60b 100644 --- a/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.model.ts +++ b/frontend/src/app/ui/admin/tenant-configuration/editor/css-colors/css-colors-editor.model.ts @@ -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; diff --git a/frontend/src/app/ui/contact/contact-content/contact-content.component.scss b/frontend/src/app/ui/contact/contact-content/contact-content.component.scss index 2add7b7ed..516daa2f5 100644 --- a/frontend/src/app/ui/contact/contact-content/contact-content.component.scss +++ b/frontend/src/app/ui/contact/contact-content/contact-content.component.scss @@ -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; diff --git a/frontend/src/app/ui/description/description-copy-dialog/description-copy-dialog.component.html b/frontend/src/app/ui/description/description-copy-dialog/description-copy-dialog.component.html index c94bfb2b2..d475ad4d3 100644 --- a/frontend/src/app/ui/description/description-copy-dialog/description-copy-dialog.component.html +++ b/frontend/src/app/ui/description/description-copy-dialog/description-copy-dialog.component.html @@ -28,6 +28,6 @@
-
+
diff --git a/frontend/src/app/ui/description/description-copy-dialog/description-copy-dialog.component.scss b/frontend/src/app/ui/description/description-copy-dialog/description-copy-dialog.component.scss index deeff4946..57e595ac7 100644 --- a/frontend/src/app/ui/description/description-copy-dialog/description-copy-dialog.component.scss +++ b/frontend/src/app/ui/description/description-copy-dialog/description-copy-dialog.component.scss @@ -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); -} +} \ No newline at end of file diff --git a/frontend/src/app/ui/description/overview/description-overview.component.scss b/frontend/src/app/ui/description/overview/description-overview.component.scss index 299573ee8..7d95aa895 100644 --- a/frontend/src/app/ui/description/overview/description-overview.component.scss +++ b/frontend/src/app/ui/description/overview/description-overview.component.scss @@ -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; diff --git a/frontend/src/app/ui/plan/plan-editor-blueprint/plan-editor.component.scss b/frontend/src/app/ui/plan/plan-editor-blueprint/plan-editor.component.scss index 231de5dc1..882b976c8 100644 --- a/frontend/src/app/ui/plan/plan-editor-blueprint/plan-editor.component.scss +++ b/frontend/src/app/ui/plan/plan-editor-blueprint/plan-editor.component.scss @@ -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; diff --git a/frontend/src/app/ui/plan/plan-finalize-dialog/plan-finalize-dialog.component.scss b/frontend/src/app/ui/plan/plan-finalize-dialog/plan-finalize-dialog.component.scss index f84d80a7b..f9f3f971f 100644 --- a/frontend/src/app/ui/plan/plan-finalize-dialog/plan-finalize-dialog.component.scss +++ b/frontend/src/app/ui/plan/plan-finalize-dialog/plan-finalize-dialog.component.scss @@ -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; -} diff --git a/frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.scss b/frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.scss index f19b398de..af4db63bf 100644 --- a/frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.scss +++ b/frontend/src/app/ui/user-profile/add-account/add-account-dialog.component.scss @@ -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); - } } diff --git a/frontend/src/assets/i18n/baq.json b/frontend/src/assets/i18n/baq.json index cbb74f4dd..147522200 100644 --- a/frontend/src/assets/i18n/baq.json +++ b/frontend/src/assets/i18n/baq.json @@ -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", diff --git a/frontend/src/assets/i18n/de.json b/frontend/src/assets/i18n/de.json index 6db036302..5d37457d1 100644 --- a/frontend/src/assets/i18n/de.json +++ b/frontend/src/assets/i18n/de.json @@ -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", diff --git a/frontend/src/assets/i18n/en.json b/frontend/src/assets/i18n/en.json index c46d467a0..2eb731c82 100644 --- a/frontend/src/assets/i18n/en.json +++ b/frontend/src/assets/i18n/en.json @@ -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", diff --git a/frontend/src/assets/i18n/es.json b/frontend/src/assets/i18n/es.json index 123918714..104c5344c 100644 --- a/frontend/src/assets/i18n/es.json +++ b/frontend/src/assets/i18n/es.json @@ -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", diff --git a/frontend/src/assets/i18n/gr.json b/frontend/src/assets/i18n/gr.json index d2d07adbd..7589a4ed6 100644 --- a/frontend/src/assets/i18n/gr.json +++ b/frontend/src/assets/i18n/gr.json @@ -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", diff --git a/frontend/src/assets/i18n/hr.json b/frontend/src/assets/i18n/hr.json index 05d9c069e..5d3a05feb 100644 --- a/frontend/src/assets/i18n/hr.json +++ b/frontend/src/assets/i18n/hr.json @@ -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", diff --git a/frontend/src/assets/i18n/pl.json b/frontend/src/assets/i18n/pl.json index 8aaed86e2..b7026d516 100644 --- a/frontend/src/assets/i18n/pl.json +++ b/frontend/src/assets/i18n/pl.json @@ -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", diff --git a/frontend/src/assets/i18n/pt.json b/frontend/src/assets/i18n/pt.json index 050a9c8bd..6f01e57c8 100644 --- a/frontend/src/assets/i18n/pt.json +++ b/frontend/src/assets/i18n/pt.json @@ -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", diff --git a/frontend/src/assets/i18n/sk.json b/frontend/src/assets/i18n/sk.json index d522d3402..ca0551266 100644 --- a/frontend/src/assets/i18n/sk.json +++ b/frontend/src/assets/i18n/sk.json @@ -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", diff --git a/frontend/src/assets/i18n/sr.json b/frontend/src/assets/i18n/sr.json index 574c7999e..2b3883c8b 100644 --- a/frontend/src/assets/i18n/sr.json +++ b/frontend/src/assets/i18n/sr.json @@ -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", diff --git a/frontend/src/assets/i18n/tr.json b/frontend/src/assets/i18n/tr.json index 19fb88475..8c41ce0dc 100644 --- a/frontend/src/assets/i18n/tr.json +++ b/frontend/src/assets/i18n/tr.json @@ -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", diff --git a/frontend/src/assets/scss/core/_misc.scss b/frontend/src/assets/scss/core/_misc.scss index 0bd4e2f1b..f89b34924 100644 --- a/frontend/src/assets/scss/core/_misc.scss +++ b/frontend/src/assets/scss/core/_misc.scss @@ -44,7 +44,7 @@ a{ label{ font-size: 14px; line-height: 1.42857; - color: $checkboxes-text-color; + color: var(--gray); font-weight: 400; } diff --git a/frontend/src/assets/scss/core/variables/_bootstrap-material-design.scss b/frontend/src/assets/scss/core/variables/_bootstrap-material-design.scss index d5ba0c576..a4c2462ba 100644 --- a/frontend/src/assets/scss/core/variables/_bootstrap-material-design.scss +++ b/frontend/src/assets/scss/core/variables/_bootstrap-material-design.scss @@ -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; diff --git a/frontend/src/common/forms/form-validation-errors-dialog/form-validation-errors-dialog.component.scss b/frontend/src/common/forms/form-validation-errors-dialog/form-validation-errors-dialog.component.scss index a5dde4724..281bf5b33 100644 --- a/frontend/src/common/forms/form-validation-errors-dialog/form-validation-errors-dialog.component.scss +++ b/frontend/src/common/forms/form-validation-errors-dialog/form-validation-errors-dialog.component.scss @@ -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; diff --git a/frontend/src/styles.scss b/frontend/src/styles.scss index 5592d344d..2fc122fdd 100644 --- a/frontend/src/styles.scss +++ b/frontend/src/styles.scss @@ -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,24 +447,23 @@ 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(--inverted-btn-color); } - &.primary-inverted-hover:hover { - background-color: var(--primary-color); - color: var(--primary-text); - } } @@ -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; +// } \ No newline at end of file