forked from Computer_Society/open-goverance
120 lines
No EOL
1.7 KiB
CSS
120 lines
No EOL
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;
|
|
} |