thebadspace/public/assets/css/global/frame.css
ro 43e0004ac5 Updated blocklist retrival process, template edits
The process for updating blocklists per source wasn't effecient, so it
has been rewritten to process each source individually before moving on,
relieving some processing load on the server and ensuring every source
comes back with data, even in the event it doesn't grab it the first
time.

also removed the recent list from the index page as the recently updated
list doesn't reflect what's been the last to get updated and changed the
theme color to match the current palette.
2024-09-12 19:20:13 -06:00

262 lines
3.7 KiB
CSS

html {
width: 100%;
height: 100%;
overflow: hidden;
font: 400 1.4em/1.4em var(--base-type);
}
html body {
background: var(--primary);
color: var(--white);
margin: 0;
padding: 0;
height: 100%;
width: 100%;
overflow-y: scroll;
overflow-x: hidden;
}
a {
color: var(--highlight);
text-decoration: none;
transition: all 0.2s linear;
/*
border-bottom: 1px solid var(--white);
*/
}
strong {
color: var(--secondary);
}
hr {
border-width: 0.5px;
border-color: var(--white);
}
header {
width: 100%;
color: var(--primary);
background: var(--secondary);
}
header > div:nth-child(1) {
display: grid;
grid-template-columns: 200px 1fr 40px;
padding: 10px;
gap: 10px;
height: 200px;
width: 80%;
margin: 0 auto;
max-width: 1000px;
position: relative;
}
header > div span {
font-size: 3em;
font-weight: bold;
position: absolute;
bottom: 25px;
width: 50%;
line-height: 0.8em;
}
header > div img {
width: 100%;
}
header > div a {
color: var(--primary);
}
header > div i {
font-size: 1.3em;
}
header > div nav {
background: var(--black);
position: relative;
}
.header-right {
text-align: right;
}
div.system-notice-error {
background: var(--error);
color: var(--white);
padding: 10px;
}
div.system-notice-message {
background: var(--highlight);
color: var(--black);
padding: 10px;
}
main > section > article {
width: 80%;
max-width: 1000px;
margin: 0 auto;
min-height: 400px;
}
textarea[name="appeal_description"] {
width: 300px;
height: 200px;
}
/* NAV */
#main-nav {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: var(--black);
z-index: 1;
display: flex;
align-items: center;
justify-content: center;
}
label[for="element-toggle"] {
cursor: pointer;
}
#element-toggle {
display: none;
}
#element-toggle:not(:checked) ~ #main-nav {
display: none;
}
a.nav-links {
border-bottom: none;
font-size: 40px;
color: var(--highlight);
text-decoration: none;
}
/* GLOBALS */
a:hover {
/*
border-bottom: 1px solid var(--secondary);
*/
color: var(--white);
}
pre {
white-space: pre;
background: var(--secondary);
}
code {
background: var(--secondary);
color: var(--primary);
padding: 3px;
}
sup {
background: var(--black);
color: var(--white);
padding: 2px;
border-radius: 3px;
vertical-align: baseline;
font-family: var(--mono-type);
}
.button-icon {
height: 90%;
padding-top: 3px;
}
.menu-icon {
width: 40px;
}
.location-title {
display: none;
}
.location-image {
height: 200px;
width: 200px;
display: inline-block;
border-radius: 3px;
}
footer {
color: var(--primary);
background: var(--secondary);
display: grid;
grid-template-columns: 50% 48%;
padding: 10px;
gap: 10px;
height: auto;
width: auto;
margin: 20px auto;
position: relative;
}
footer a {
color: var(--white);
}
footer > div:nth-child(2) {
text-align: right;
}
/*
responsive
*/
@media only screen and (max-width: 960px) {
header > div nav {
bottom: 17px;
}
}
@media only screen and (max-width: 960px) {
header > div:nth-child(1) {
grid-template-columns: 150px 65% 1fr;
height: 150px;
}
header > div nav {
bottom: 17px;
}
}
@media only screen and (max-width: 650px) {
header > div:nth-child(1) {
grid-template-columns: 150px 65% 1fr;
grid-template-rows: 75% 1fr;
height: auto;
gap: 15px;
}
header > div > div.header-left {
grid-row: 1/2;
position: relative;
width: 100px;
}
header > div > div.header-center {
grid-row: 2/3;
grid-column: 1/4;
position: relative;
}
}
@media only screen and (max-width: 440px) {
header > div:nth-child(1) {
grid-template-columns: 150px 40% 1fr;
}
}