[FIX] web: adjust frontend form-check-input colors
Prior to this commit, checkboxes, radios and switch inputs had a color issue in frontend: as the inner element (eg. check mark) was always white if the user changed the primary color to a bright one, the inputs were no longer readable. Steps to reproduce: - Go to the Contact page. - Click on Edit. - Click on Theme tab. - Replace the primary color with a bright one (ex. light gray). - Click on the form in the page. - Add a field. - Select the new field and choose the "Radio Buttons" or " Checkbox" type. - Click on Save. - Check the checkbox or the radio button. => The check mark or the dot is not visible enough. This commit adjusts the colors to ensure that these inputs will always be visible. task-3702675 Part-of: odoo/odoo#150886
This commit is contained in:
@@ -60,6 +60,8 @@ $table-color: inherit !default;
|
||||
|
||||
// Forms
|
||||
|
||||
$component-active-bg: $primary !default;
|
||||
|
||||
$input-color: $body-color !default;
|
||||
$input-bg: $body-bg !default;
|
||||
$input-transition: background-color .05s ease-in-out, border-color .05s ease-in-out, box-shadow .05s ease-in-out !default;
|
||||
@@ -69,6 +71,11 @@ $input-disabled-border-color: rgba($input-color, 0.15) !default;
|
||||
|
||||
$form-check-input-border: $border-width solid $gray-400 !default;
|
||||
$form-check-input-border-radius: 0 !default;
|
||||
$form-check-input-checked-color: color-contrast($component-active-bg, $body-color, $white) !default;
|
||||
|
||||
$form-switch-color: $input-color !default;
|
||||
$form-switch-checked-color: $form-check-input-checked-color !default;
|
||||
|
||||
$form-select-indicator-color: $input-color !default;
|
||||
$form-select-disabled-color: mix($input-color, $input-bg) !default;
|
||||
$form-select-disabled-bg: $input-disabled-bg !default;
|
||||
|
||||
Reference in New Issue
Block a user