palmoe.dk/assets/main.css

68 lines
1.2 KiB
CSS
Raw Permalink Normal View History

2022-11-14 16:44:28 +00:00
@media (prefers-color-scheme: light) {
:root {
--primary: white;
--font-color: black;
--font-inverted: white;
--link-color: blue;
}
}
@media (prefers-color-scheme: dark) {
:root {
2024-03-25 21:50:47 +00:00
--primary: black;
2022-11-14 16:44:28 +00:00
--font-color: white;
2024-03-25 21:50:47 +00:00
--font-inverted: black;
--link-color: lime;
2022-11-14 16:44:28 +00:00
}
}
2024-03-25 21:50:47 +00:00
*, *::before, *::after {
2022-11-14 16:44:28 +00:00
box-sizing: border-box;
color: var(--font-color);
2024-03-25 21:50:47 +00:00
margin: 0;
padding: 0;
2022-11-14 16:44:28 +00:00
}
2024-03-25 21:50:47 +00:00
html, body {
font-family: Bahnschrift, sans-serif-condensed, sans-serif;
background-color: var(--primary);
width: 100%;
height: 100%;
2022-11-18 15:03:19 +00:00
}
2024-03-25 21:50:47 +00:00
h1, h2, h3, h4, h5, h6 {
2022-11-14 16:44:28 +00:00
word-wrap: break-word;
2024-03-25 21:50:47 +00:00
width: fit-content;
2022-11-14 16:44:28 +00:00
}
a {
2024-03-25 21:50:47 +00:00
display: inline-block;
2022-11-14 16:44:28 +00:00
text-decoration: underline solid var(--link-color) 10%;
2024-03-25 21:50:47 +00:00
text-underline-offset: 4px;
2022-11-14 16:44:28 +00:00
}
a:hover {
background-color: var(--link-color);
color: var(--font-inverted);
}
2024-03-25 21:50:47 +00:00
.column {
display: flex;
flex-direction: column;
2022-11-18 15:03:19 +00:00
}
2024-03-25 21:50:47 +00:00
.row {
display: flex;
flex-direction: row;
2022-11-18 15:03:19 +00:00
}
2024-03-25 21:50:47 +00:00
.center {
justify-content: center;
gap: 5px;
2022-11-18 15:03:19 +00:00
}
2024-03-25 21:50:47 +00:00
.separate {
justify-content: space-between;
align-content: space-between;
gap: 5px;
2022-11-18 15:03:19 +00:00
}
2024-03-25 21:50:47 +00:00
.wrap {
flex-wrap: wrap;
2022-11-18 15:03:19 +00:00
}
2024-03-25 21:50:47 +00:00
.nowrap {
flex-wrap: nowrap;
2024-03-02 20:18:33 +00:00
}