120 lines
1.7 KiB
CSS
120 lines
1.7 KiB
CSS
|
|
||
|
/* Basic stuff */
|
||
|
body {
|
||
|
max-width: 100ch;
|
||
|
margin: 0 auto;
|
||
|
padding: 8px;
|
||
|
line-height: 1.2;
|
||
|
}
|
||
|
/* To make sure the header text is always bigger than a normal h1*/
|
||
|
header h1 {
|
||
|
font-size: 300%;
|
||
|
}
|
||
|
|
||
|
|
||
|
/* get these to play nicely with teh max width */
|
||
|
header, main, footer, img{
|
||
|
max-width: 100ch;
|
||
|
}
|
||
|
|
||
|
a:link{
|
||
|
color:#5bf
|
||
|
}
|
||
|
a:visited{
|
||
|
color:#5bf
|
||
|
}
|
||
|
|
||
|
table {
|
||
|
border-collapse: collapse;
|
||
|
}
|
||
|
|
||
|
td, th {
|
||
|
border: 1px solid #999;
|
||
|
padding: 0.5rem;
|
||
|
text-align: left;
|
||
|
}
|
||
|
|
||
|
li p {
|
||
|
margin-block-start: 0;
|
||
|
margin-block-end: 0;
|
||
|
}
|
||
|
|
||
|
p code {
|
||
|
background-color: rgba(173, 173, 173, 0.26);
|
||
|
border-radius: 0.3em;
|
||
|
padding: 4px 5px 6px;
|
||
|
}
|
||
|
|
||
|
pre {
|
||
|
max-width: 95vw;
|
||
|
display: block;
|
||
|
overflow: auto;
|
||
|
}
|
||
|
|
||
|
/* navbar */
|
||
|
.links ul, .breadcrumb ul {
|
||
|
list-style-type: none;
|
||
|
display: flex;
|
||
|
padding-left: 0;
|
||
|
}
|
||
|
|
||
|
/* sticky footer */
|
||
|
main {
|
||
|
min-height: calc(95vh - 150px);
|
||
|
}
|
||
|
footer {
|
||
|
min-height: 50px;
|
||
|
}
|
||
|
|
||
|
/* spoilers
|
||
|
using https://starbeamrainbowlabs.com/blog/article.php?article=posts%2F415-pure-css-spoiler.html
|
||
|
as a base then using it for on hover instead of target.
|
||
|
Seems to work well enough for mobile as well
|
||
|
*/
|
||
|
|
||
|
.md-spoiler {
|
||
|
background: #333333;
|
||
|
border-radius: 0.2em;
|
||
|
color: transparent;
|
||
|
}
|
||
|
/* hover is for desktop, active for mobile*/
|
||
|
.md-spoiler:hover, .md-spoiler:active {
|
||
|
background: transparent;
|
||
|
color: inherit;
|
||
|
}
|
||
|
|
||
|
/* every page gets a scrollbar to stop it shifting around */
|
||
|
html {
|
||
|
overflow-y: scroll;
|
||
|
}
|
||
|
|
||
|
label, input, select {
|
||
|
display: table-cell;
|
||
|
margin-bottom: 10px;
|
||
|
}
|
||
|
/* Make hidden great again */
|
||
|
[hidden] {
|
||
|
display: none !important;
|
||
|
}
|
||
|
|
||
|
|
||
|
/* Specific to handovers */
|
||
|
|
||
|
h1 {
|
||
|
color: #087581;
|
||
|
}
|
||
|
|
||
|
h2 {
|
||
|
color: white;
|
||
|
background: #087581;
|
||
|
}
|
||
|
|
||
|
/*h3 {*/
|
||
|
/* background: #B8F4FA;*/
|
||
|
/*}*/
|
||
|
|
||
|
#logo {
|
||
|
background: white;
|
||
|
float: right;
|
||
|
margin: 0 0 0 1px;
|
||
|
}
|