thebadspace/public/assets/css/global/frame.css
Ro 8ed167b951 Added About, Listings, Location pages
Added additional pages About, Listings, and Location as well as
implementing the corresponding functionality for those pages to be able
to pull the data they need from the DB.

Also continued layout clean up and adjusted some gloabal font sizing
settings
2023-08-18 14:34:53 -07:00

155 lines
2.2 KiB
CSS

html {
width: 100%;
height: 100%;
overflow: hidden;
font: 400 1.6em/1.3em var(--base-type);
}
html body {
background: var(--primary);
color: var(--secondary);
margin: 0;
padding: 0;
height: 100%;
width: 100%;
overflow-y: scroll;
overflow-x: hidden;
}
a {
color: var(--highlight);
text-decoration: none;
/*
border-bottom: 1px solid var(--white);
transition: all 0.2s linear;
*/
}
header {
width: 100%;
color: var(--primary);
background: var(--secondary);
}
header > div:nth-child(1) {
display: grid;
grid-template-columns: 200px 50% 1fr;
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 {
position: absolute;
bottom: 20px;
right: 0;
}
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;
}
/* GLOBALS */
a.nav-links {
padding: 7px;
border-bottom: none;
}
a:hover {
border-bottom: 1px solid var(--secondary);
}
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;
}
.location-image {
height: 200px;
width: 200px;
display: inline-block;
border-radius: 3px;
}
/* GLOBALS */
footer {
width: 100%;
color: var(--primary);
background: var(--secondary);
height: 200px;
}
footer > div:nth-child(1) {
display: grid;
grid-template-columns: 50% 50%;
padding: 10px;
gap: 10px;
height: 200px;
width: 80%;
margin: 0 auto;
max-width: 1000px;
position: relative;
}