Try to improve dark-mode colors for alert boxes, outline buttons

This commit is contained in:
Alexandre Aubin 2022-10-08 20:31:15 +02:00 committed by axolotle
parent 90231ef84d
commit 72a941e648
2 changed files with 50 additions and 3 deletions

View file

@ -34,7 +34,7 @@ $font-weight-bold: 500;
--background-color: #ffffff;
--background-color-secondary: #fafbfc;
--border-color: #c5d9e8;
--font-color: #2c405a;
--font-color: #333;
--font-color-secondary: #3f536e;
--black: #2c405a;
@ -59,7 +59,7 @@ $font-weight-bold: 500;
[dark-theme="true"] {
/* Variables for dark mode */
--background-color: #222c3c;
--background-color: #202025;
--background-color-secondary: #273142;
--border-color: #313d4f;
--font-color: #ffffff;
@ -85,6 +85,43 @@ $font-weight-bold: 500;
--warning: #ffc02a;
}
//
// FIXME : these five blocks are probably not well-written and are not just "variable declarations" ;/
// probably to be refactored ...
//
[dark-theme="true"] .alert-success {
color: #4dd0af;
background-color: #005e46;
border: var(--border-color);
}
[dark-theme="true"] .alert-info {
color: #5dbecd;
background-color: #0c515c;
border: var(--border-color);
}
[dark-theme="true"] .alert-warning {
color: #f7ba59;
background-color: #7a4e09;
border: var(--border-color);
}
[dark-theme="true"] .alert-danger {
color: #ee8277;
background-color: #74261e;
border: var(--border-color);
}
[dark-theme="true"] .btn-outline-dark {
color: var(--font-color-secondary);
border-color: var(--border-color);
}
//
// END FIXME
//
$purple: #9932cc;
$theme-colors: (
@ -133,6 +170,8 @@ $background-color-primary: var(--background-color);
$background-color-secondary: var(--background-color-secondary);
$card-border-color: var(--border-color);
//
//
//

View file

@ -43,11 +43,19 @@ body {
color: $list-group-action-color;
}
.list-group-item {
border-color: var(--border-color);
}
.list-group-item:hover {
background-color: $background-color-secondary;
color: var(--font-color-secondary);
}
.text-secondary {
color: var(--font-color-secondary) !important;
}
.form-control {
background-color: $background-color-secondary;
}
@ -257,4 +265,4 @@ code {
.list-group-item-danger {
color: var(--error);
}
*/
*/