Fix some colors not being applied to forms

This commit is contained in:
Jean-Romain Garnier 2021-01-16 12:17:39 +01:00
parent 4be2f5f21e
commit 2bf5979e3b
4 changed files with 16 additions and 7 deletions

View file

@ -45,6 +45,7 @@ $link-focus-color: #49a8e8;
// Forms // Forms
$forms-text-color: #555555; $forms-text-color: #555555;
$forms-background-color: #ffffff; $forms-background-color: #ffffff;
$forms-placeholder-color: rgba($forms-text-color, 0.6);
// Vue.js tree // Vue.js tree
@ -54,7 +55,9 @@ $tree-background-selected-color: #606060;
// Django autocomplete light // Django autocomplete light
$dal-result-focus-text-color: $text-color;
$dal-result-focus-background-color: #5897fb; $dal-result-focus-background-color: #5897fb;
$dal-result-selected-text-color: $text-color;
$dal-result-selected-background-color: #dddddd; $dal-result-selected-background-color: #dddddd;

View file

@ -45,7 +45,7 @@ $link-focus-color: $link-color;
// Forms // Forms
$forms-text-color: #495057; $forms-text-color: #495057;
$forms-background-color: #a9bdbd; $forms-background-color: #a9bdbd;
$forms-placeholder-color: rgba($forms-text-color, 0.8); $forms-placeholder-color: rgba($forms-text-color, 0.6);
// Vue.js tree // Vue.js tree
@ -55,8 +55,10 @@ $tree-background-selected-color: #b4cccc;
// Django autocomplete light // Django autocomplete light
$dal-result-focus-text-color: $text-color;
$dal-result-focus-background-color: #133B45; $dal-result-focus-background-color: #133B45;
$dal-result-selected-background-color: #dddddd; $dal-result-selected-text-color: #bfd0d2;
$dal-result-selected-background-color: #205562;
// Navbar // Navbar

View file

@ -49,6 +49,7 @@ $link-focus-color: none;
// Forms // Forms
$forms-text-color: none; $forms-text-color: none;
$forms-background-color: none; $forms-background-color: none;
$forms-placeholder-color: none;
// Vue.js tree // Vue.js tree
@ -58,7 +59,9 @@ $tree-background-selected-color: none;
// Django autocomplete light // Django autocomplete light
$dal-result-focus-text-color: none;
$dal-result-focus-background-color: none; $dal-result-focus-background-color: none;
$dal-result-selected-text-color: none;
$dal-result-selected-background-color: none; $dal-result-selected-background-color: none;

View file

@ -134,8 +134,9 @@ a:hover {
/* /*
* Forms * Forms
*/ */
::placeholder { ::placeholder,
color: $forms-text-color; ::-webkit-input-placeholder {
color: $forms-placeholder-color !important;
opacity: 1; opacity: 1;
} }
.form-control { .form-control {
@ -167,7 +168,7 @@ a:hover {
border-color: $border-color; border-color: $border-color;
} }
.select2-container--default .select2-selection--single { .select2-container--default .select2-selection--single {
background-color: $forms-background-color; background-color: $forms-background-color !important;
} }
.select2-search__field { .select2-search__field {
color: $forms-text-color; color: $forms-text-color;
@ -178,11 +179,11 @@ a:hover {
background-color: $forms-background-color; background-color: $forms-background-color;
} }
.select2-results__option--highlighted { .select2-results__option--highlighted {
color: $text-color !important; color: $dal-result-focus-text-color !important;
background-color: $dal-result-focus-background-color !important; background-color: $dal-result-focus-background-color !important;
} }
.select2-container--default .select2-results__option[aria-selected="true"] { .select2-container--default .select2-results__option[aria-selected="true"] {
color: $text-color !important; color: $dal-result-selected-text-color !important;
background-color: $dal-result-selected-background-color !important; background-color: $dal-result-selected-background-color !important;
} }