web/css/gemini.css

128 lines
2.2 KiB
CSS
Raw Normal View History

2023-02-22 22:50:46 +01:00
/* Gemini.css
* Author: Paul Wilde
* Source: https://codeberg.org/pswilde/geminicss
* Website: https://geminicss.paulwilde.uk
* */
:root {
--bg: #111122;
--text: #eeeedd;
--text-dark: #ccccbb;
--accent: #d0c010;
--accent-2: #228822;
--accent-2-dark: #006600;
--accent-3: #ffaa44;
}
* {
color: var(--text);
}
body {
background-color: var(--bg);
max-width: 80%;
margin:auto;
margin-top: 2em;
font-size: 1.1em;
}
p, a, label, h1, h2, h3, h4, h5, ul, li {
color: var(--text);
}
h1:before, h2:before, h3:before, a:before {
transition: left 0.5s;
}
h1:before, h2:before, h3:before, a:before {
position:absolute;
left: 100px;
}
a {
transition: color 0.3s, background 0.3s;
}
a:before {
content: "=> "
}
a:hover {
color: var(--accent);
}
a[id]:before {
content: "";
}
h1 a:before, h2 a:before, h3 a:before {
content: "";
}
a.button {
display:inline-block;
padding: 1em;
margin: 0.4em;
margin-left:0;
background-color: var(--accent-2);
border-radius: 15px;
text-decoration:none;
}
a.button:before {
content: "";
position:relative;
}
a.button:hover {
color: var(--text-dark);
background-color: var(--accent-2-dark);
}
h1 a, h2 a, h3 a {
text-decoration:0;
}
h1 {
font-size: 1.8em;
color: var(--accent);
}
h1:before {
content: "# ";
}
h2 {
font-size: 1.6em;
color: var(--accent-2);
}
h2:before {
content: "## ";
}
h3 {
font-size: 1.4em;
color: var(--accent-3);
}
h3:before {
content: "### ";
}
blockquote {
border-left: 3px solid var(--accent-2);
padding: 0.4em;
font-style: italic;
padding-left: 2em;
margin-left: 0;
}
blockquote pre {
padding: 1em;
}
ul li ul {
margin:0;
padding:0;
}
ul li ul {
list-style-type:none;
}
@media only screen and (max-width: 1600px) {
h1:before, h2:before, h3:before, a:before {
left: 60px;
}
}
@media only screen and (max-width: 1200px) {
h1:before, h2:before, h3:before, a:before {
left: 20px;
}
}
@media only screen and (max-width: 700px) {
body {
max-width: 70%;
}
h1:before, h2:before, h3:before, a:before {
left: 4px;
}
}