style: Prettier colour style!

This commit is contained in:
Yuki Joou 2023-08-16 15:10:41 +02:00
parent 0a7a85a231
commit e2d340f555

View file

@ -1,17 +1,38 @@
:root {
--color-background: #bad2e0;
--color-background-header: #d4abee;
--color-background-main: #efc2e7;
--color-text: #211237;
--color-link: #162fb6;
--color-shadow: #0f5a87;
}
@media (prefers-color-scheme: dark) {
:root {
--color-background: #38235e;
--color-background-header: #5c5185;
--color-background-main: #69265c;
--color-text: #e9ddf8;
--color-link: #96a9e2;
--color-shadow: #200256;
}
}
* {
font-family: "sans-serif" sans;
color: var(--color-text);
}
a {
color: purple;
color: var(--color-link);
}
a:visited {
color: purple;
color: var(--color-link);
}
body {
background-color: lightblue;
background-color: var(--color-background);
display: flex;
flex-direction: column;
align-items: center;
@ -22,14 +43,13 @@ header {
padding: 1rem;
margin: 0 0 2rem 0;
background-color: violet;
box-shadow: 5px 5px black;
background-color: var(--color-background-header);
box-shadow: 5px 5px var(--color-shadow);
text-align: center;
}
header h1 {
color: black;
font-weight: 100;
margin: 1rem 0 0 0;
}
@ -43,8 +63,8 @@ main {
max-width: 50rem;
padding: 1rem;
background-color: pink;
box-shadow: 5px 5px black;
background-color: var(--color-background-main);
box-shadow: 5px 5px var(--color-shadow);
}
footer {