improve table and messagerie display in dark mode

This commit is contained in:
Lisa Durand 2023-11-13 11:22:14 +01:00
parent 11c8e408ef
commit f4283392b7
7 changed files with 33 additions and 13 deletions

View file

@ -7,7 +7,6 @@
} }
.autosave-explanation { .autosave-explanation {
color: $dark-grey;
margin-left: 4px; margin-left: 4px;
} }

View file

@ -1,6 +1,12 @@
@import "colors"; @import "colors";
@import "constants"; @import "constants";
[data-fr-theme="dark"]
.card {
background: none;
border: 1px solid rgb(74, 74, 125);
}
.card { .card {
padding: ($default-spacer * 3) ($default-spacer * 2); padding: ($default-spacer * 3) ($default-spacer * 2);
border: 1px solid $border-grey; border: 1px solid $border-grey;
@ -8,7 +14,6 @@
background: #FFFFFF; background: #FFFFFF;
.card-title { .card-title {
color: $black;
font-weight: bold; font-weight: bold;
font-size: 20px; font-size: 20px;
line-height: 1.5rem; line-height: 1.5rem;

View file

@ -3,6 +3,12 @@
$dossier-actions-bar-border-width: 1px; $dossier-actions-bar-border-width: 1px;
[data-fr-theme="dark"]
.dossier-edit
.dossier-edit-sticky-footer {
background-color: rgb(74, 74, 125);
border: none
}
.dossier-header { .dossier-header {
.fr-container { .fr-container {
padding-bottom: $default-padding; padding-bottom: $default-padding;

View file

@ -10,15 +10,6 @@ ol.fr-ol-content--override {
} }
} }
// override default transparent background on inputs & font-size to 16px by default
input,
textarea,
select,
// FIXME when DSFR is DONE
.form-ds-fr-white .fr-input {
background: $white;
font-size: 1em;
}
// with Marianne font, weight of font is less bolder, so bold it up // with Marianne font, weight of font is less bolder, so bold it up
.button.primary { .button.primary {

View file

@ -1,12 +1,21 @@
@import "colors"; @import "colors";
@import "constants"; @import "constants";
[data-fr-theme="dark"]
.message {
background: rgb(74, 74, 125);
&.inverted-background {
background: rgb(74, 74, 125);
}
}
.message { .message {
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
margin-bottom: $default-padding; margin-bottom: $default-padding;
padding: $default-padding; padding: $default-padding;
background: #FFFFFF; background: $light-grey;
border-radius: 3px; border-radius: 3px;
&.inverted-background { &.inverted-background {

View file

@ -5,7 +5,6 @@
max-height: 350px; max-height: 350px;
overflow-y: scroll; overflow-y: scroll;
border: 1px solid $border-grey; border: 1px solid $border-grey;
background: $light-grey;
padding: 2 * $default-spacer; padding: 2 * $default-spacer;
margin-bottom: $default-spacer; margin-bottom: $default-spacer;
border-radius: 4px; border-radius: 4px;

View file

@ -56,6 +56,17 @@
width: calc(100vw); width: calc(100vw);
} }
[data-fr-theme="dark"]
.fr-table--bordered {
.table {
&.hoverable {
tbody tr:hover {
background-color: rgb(74, 74, 125);
}
}
}
}
.fr-table--bordered { .fr-table--bordered {
.table { .table {
&.hoverable { &.hoverable {