This repository has been archived on 2025-09-28. You can view files and clone it, but you cannot make any changes to it's state, such as pushing and creating new issues, pull requests or comments.
plaintext-encyclopedia/public/static/style.css

107 lines
1.9 KiB
CSS

/* Copyright (c) 2024 Julian Müller (ChaoticByte) */
body {
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
align-items: center;
width: 100vw;
min-height: 100vh;
font-family: sans-serif;
}
a:hover, a:focus { text-decoration: underline; }
a {
color: black;
text-decoration: none;
outline: none;
}
footer {
margin-top: auto;
padding: 1rem;
box-sizing: border-box;
display: flex;
justify-content: center;
flex-wrap: wrap;
}
footer > div {
margin: 0 .5rem;
}
footer, footer * {
color: #00000080 !important;
font-size: .9rem;
text-align: center;
}
.homebtn {
position: absolute;
top: 1rem;
left: 1rem;
}
.main {
margin: 2rem 0;
width: 100%;
display: flex;
flex-direction: column;
align-items: center;
}
.main > h1, .content {
width: 70vw;
max-width: 50rem;
}
.main > h1 {
font-size: 1.4rem;
margin-top: 1.5rem;
margin-bottom: .5rem;
text-align: center;
}
.content { white-space: pre-line; }
.home-main {
width: 100%;
padding: 2rem;
box-sizing: border-box;
gap: 1rem;
}
.about {
margin-bottom: 2rem;
}
.about > h1 {
font-size: 1.6rem;
}
.description {
white-space: pre-line;
}
.home-main, .toc, #search-results {
display: flex;
flex-direction: column;
}
.toc, #search-results, #search-box { padding: 0 .2rem; }
.toc, #search-results { gap: .2rem; }
#search-box {
width: 100%;
border: none;
outline: none;
border-bottom: 1px solid #00000040;
height: 2rem;
font-size: 1rem;
}
#search-box:active, #search-box:focus, #search-box:hover {
border-bottom: 1px solid black;
}
.hidden { display: none !important; }
@media only screen and (max-width: 750px) {
.main { margin-top: 4rem; }
.main > h1 {
margin-top: unset;
}
.main > h1, .content {
width: 90vw;
max-width: unset;
}
.homebtn {
left: unset;
right: 1rem;
}
}