vodoraslo.xyz/new-site/public/style.css

204 lines
2.5 KiB
CSS
Raw Normal View History

2023-04-03 18:25:08 +02:00
:root {
--bg: #fafafa;
--fg: #2f343f;
--links: #4084d6;
--muted_text: rgb(93, 93, 99);
/* --h1: chocolate;
--h2: sandybrown;
--h3: rgb(164, 135, 97);
--h4: #FEDC56;
--h5: #FCF4A3;
--h6: #FFF4B0; */
--h1: rgb(167, 83, 23);
--h2: rgb(185, 97, 35);
--h3: rgb(196, 110, 49);
--h4: rgb(216, 126, 61);
--h5: rgb(235, 139, 70);
--h6: rgb(244, 156, 93);
--strong: #FD6A02;
--hover-link: rgb(217, 144, 8);
}
@media (prefers-color-scheme: dark) {
:root {
--bg: #141414;
--fg: rgb(232, 228, 228);
--links: #5da0f2;
--muted_text: rgb(179, 182, 186);
/* --h1: chocolate;
--h2: sandybrown;
--h3: rgb(164, 135, 97);
--h4: #FEDC56;
--h5: #FCF4A3;
--h6: #FFF4B0; */
--h1: rgb(167, 83, 23);
--h2: rgb(185, 97, 35);
--h3: rgb(196, 110, 49);
--h4: rgb(216, 126, 61);
--h5: rgb(235, 139, 70);
--h6: rgb(244, 156, 93);
--strong: #FD6A02;
--hover-link: yellow;
}
}
2022-12-17 07:30:26 +01:00
body {
2022-12-27 13:30:02 +01:00
font-family: sans-serif;
2023-04-03 18:25:08 +02:00
background: var(--bg);
2022-12-17 17:15:37 +01:00
/* color: rgb(143, 185, 58) ; */
2023-04-03 18:25:08 +02:00
color: var(--fg);
2022-12-17 07:30:26 +01:00
}
main {
2022-12-27 13:30:02 +01:00
max-width: 800px;
margin: auto;
2022-12-17 07:30:26 +01:00
}
img {
2022-12-27 13:30:02 +01:00
max-width: 100%;
2022-12-17 07:30:26 +01:00
}
header h1 {
2022-12-27 13:30:02 +01:00
text-align: center;
2022-12-17 07:30:26 +01:00
}
footer {
2022-12-27 13:30:02 +01:00
text-align: center;
clear: both;
2022-12-17 07:30:26 +01:00
}
/* For TAGLIST.HTML */
.taglist {
2022-12-27 13:30:02 +01:00
text-align: center;
clear: both;
2022-12-17 07:30:26 +01:00
}
/* For NEXTPREV.HTML */
#nextprev {
/* The container for both the previous and next articles. */
margin-top: 15px;
2022-12-17 07:30:26 +01:00
}
2022-12-27 13:30:02 +01:00
2022-12-17 07:30:26 +01:00
#prevart {
2022-12-27 13:30:02 +01:00
float: left;
text-align: left;
2022-12-17 07:30:26 +01:00
}
2022-12-27 13:30:02 +01:00
2022-12-17 07:30:26 +01:00
#nextart {
2022-12-27 13:30:02 +01:00
float: right;
text-align: right;
2022-12-17 07:30:26 +01:00
}
2022-12-27 13:30:02 +01:00
#nextart,
#prevart {
max-width: 33%;
2022-12-17 07:30:26 +01:00
}
2022-12-17 17:15:37 +01:00
2022-12-27 13:30:02 +01:00
a {
text-decoration: none;
2023-04-03 18:25:08 +02:00
color: var(--links);
2022-12-27 13:30:02 +01:00
}
/* Globally */
2022-12-17 17:15:37 +01:00
/* Each state */
2022-12-27 13:30:02 +01:00
a:visited {
text-decoration: none;
2023-04-03 18:25:08 +02:00
color: var(--links);
2022-12-27 13:30:02 +01:00
}
a:hover {
text-decoration: none;
2023-04-03 18:25:08 +02:00
color: var(--links);
2022-12-27 13:30:02 +01:00
}
2023-04-03 18:25:08 +02:00
/* a:focus {
2022-12-27 13:30:02 +01:00
text-decoration: none;
color: yellow;
2023-04-03 18:25:08 +02:00
} */
2022-12-27 13:30:02 +01:00
a:hover,
a:active {
text-decoration: none;
2023-04-03 18:25:08 +02:00
color: var(--hover-link);
2022-12-27 13:30:02 +01:00
}
strong {
2023-04-03 18:25:08 +02:00
color: var(--strong);
2022-12-27 13:30:02 +01:00
}
h1 {
2023-04-03 18:25:08 +02:00
color: var(--h1);
2022-12-27 13:30:02 +01:00
}
h2 {
2023-04-03 18:25:08 +02:00
color: var(--h2);
2022-12-27 13:30:02 +01:00
}
h3 {
2023-04-03 18:25:08 +02:00
color: var(--h3);
2022-12-27 13:30:02 +01:00
}
h4 {
2023-04-03 18:25:08 +02:00
color: var(--h4);
2022-12-27 13:30:02 +01:00
}
h5 {
2023-04-03 18:25:08 +02:00
color: var(--h5);
2022-12-27 13:30:02 +01:00
}
h6 {
2023-04-03 18:25:08 +02:00
color: var(--h6);
2023-02-04 21:26:25 +01:00
}
pre {
background: #111222;
2023-04-03 18:25:08 +02:00
color: white;
border: 1px solid var(--strong);
2023-02-04 21:26:25 +01:00
border-radius: 20px;
padding: 1em;
white-space: pre-wrap;
overflow-wrap: break-word;
max-width: 800px;
margin: auto;
2023-03-31 20:06:39 +02:00
}
.spanForHeader{
color: rgba(0, 255, 255, 0);
}
.spanForHeader:hover{
2023-04-03 18:25:08 +02:00
color: var(--links);
}
2023-04-05 20:22:27 +02:00
.tenRecentPosts li{
2023-04-03 18:25:08 +02:00
padding-top: 10px;
}
.white_span{
color: var(--fg);
}
.white_link a{
color: var(--fg);
}
.muted_text{
color: var(--muted_text);
2023-04-05 19:31:34 +02:00
}
p {
line-height: 1.5em;
}
2023-04-05 20:22:27 +02:00
ul {
2023-04-05 19:31:34 +02:00
line-height: 1.3em;
}
2023-04-05 20:22:27 +02:00
.footnotes {
line-height: 0px;
}