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-text-color: #555555;
$forms-background-color: #ffffff;
$forms-placeholder-color: rgba($forms-text-color, 0.6);
// Vue.js tree
@ -54,7 +55,9 @@ $tree-background-selected-color: #606060;
// Django autocomplete light
$dal-result-focus-text-color: $text-color;
$dal-result-focus-background-color: #5897fb;
$dal-result-selected-text-color: $text-color;
$dal-result-selected-background-color: #dddddd;

View file

@ -45,7 +45,7 @@ $link-focus-color: $link-color;
// Forms
$forms-text-color: #495057;
$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
@ -55,8 +55,10 @@ $tree-background-selected-color: #b4cccc;
// Django autocomplete light
$dal-result-focus-text-color: $text-color;
$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

View file

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

View file

@ -134,8 +134,9 @@ a:hover {
/*
* Forms
*/
::placeholder {
color: $forms-text-color;
::placeholder,
::-webkit-input-placeholder {
color: $forms-placeholder-color !important;
opacity: 1;
}
.form-control {
@ -167,7 +168,7 @@ a:hover {
border-color: $border-color;
}
.select2-container--default .select2-selection--single {
background-color: $forms-background-color;
background-color: $forms-background-color !important;
}
.select2-search__field {
color: $forms-text-color;
@ -178,11 +179,11 @@ a:hover {
background-color: $forms-background-color;
}
.select2-results__option--highlighted {
color: $text-color !important;
color: $dal-result-focus-text-color !important;
background-color: $dal-result-focus-background-color !important;
}
.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;
}