blog.spyhoodle.me/public/css/style.css

100 lines
1.2 KiB
CSS

:root {
--background: #1E2127;
--foreground: #FFFFFF;
--secondary: #ABB2BF;
--tertiary: #5C6370;
}
/* LAYOUT */
body {
font-family: "Iosevka Nerd Font", "Iosevka", "JetBrainsMono Nerd Font", "JetBrainsMono", monospace;
background-color: var(--background);
color: var(--foreground);
line-height: 1.5;
max-width: 50rem;
padding: 1rem;
}
img {
width: 20rem;
}
.content {
margin-bottom: 2rem;
}
/* NAVIGATION */
.site-nav {
display: flex;
font-size: 13px !important;
}
.site-nav a {
font-size: 13px !important;
display: block;
}
.site-nav .logo {
font-weight: bold;
padding-left: 0;
}
.main-menu {
display: flex;
list-style: none;
margin: 0;
padding: 0;
}
@media screen and (max-width: 48rem) {
.site-nav,
.main-menu {
flex-direction: column;
}
.site-nav a {
padding: 0rem;
padding-left: 0;
}
}
/* LISTS */
.post-snippet {
margin-bottom: 1rem;
}
.post-snippet h3 {
margin-bottom: 0.25rem;
}
/* TYPOGRAPHY */
h1 {
font-size: 25px;
}
h2 {
font-size: 17.5px;
}
h3, p, li {
font-size: 15px;
}
hr {
margin: 0;
color: white;
}
a {
color: inherit;
}
a:hover {
background-color: var(--tertiary);
}
time {
color: var(--secondary);
font-style: italic;
}