feat: Modification du design
This commit is contained in:
@ -12,21 +12,35 @@
|
||||
|
||||
/* semantic color variables for this project */
|
||||
:root, body.theme-light {
|
||||
--color-header-background: var(--color-green);
|
||||
--color-header-text: var(--color-white);
|
||||
--color-background: var(--color-white);
|
||||
--color-text: var(--color-black);
|
||||
--color-highlight: var(--color-green);
|
||||
--header-size: var(--header-size-small);
|
||||
--color-highlight-background: var(--color-green);
|
||||
--color-highlight-text: var(--color-white);
|
||||
--color-highlight-text-invert: var(--color-black);
|
||||
--header-size: var(--header-size-small)
|
||||
}
|
||||
|
||||
body.theme-dark {
|
||||
--color-header-background: var(--color-green);
|
||||
--color-header-text: var(--color-black);
|
||||
--color-background: var(--color-black);
|
||||
--color-text: var(--color-white);
|
||||
--color-highlight-background: var(--color-green);
|
||||
--color-highlight-text: var(--color-black);
|
||||
--color-highlight-text-invert: var(--color-white);
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
:root {
|
||||
--color-header-background: var(--color-green);
|
||||
--color-header-text: var(--color-black);
|
||||
--color-background: var(--color-black);
|
||||
--color-text: var(--color-white);
|
||||
--color-highlight-background: var(--color-green);
|
||||
--color-highlight-text: var(--color-black);
|
||||
--color-highlight-text-invert: var(--color-white);
|
||||
}
|
||||
}
|
||||
|
||||
@ -51,6 +65,10 @@ html, body, #app {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
#app {
|
||||
min-width: 320px;
|
||||
}
|
||||
|
||||
body {
|
||||
color: var(--color-text);
|
||||
background: var(--color-background);
|
||||
|
Reference in New Issue
Block a user