nml/style.css

202 lines
2.7 KiB
CSS
Raw Normal View History

2024-07-25 14:19:49 +02:00
body {
background-color: #1b1b1d;
color: #c5c5c5;
font-family: sans-serif;
max-width: 90ch;
margin: 0 auto;
}
2024-07-29 18:06:18 +02:00
/* Styles */
2024-07-25 14:19:49 +02:00
em {
padding-left: .1em;
padding-right: .1em;
border-radius: 3px;
border: solid 1px #100c1e;
color: #ffb454;
background-color: #191f26;
}
2024-07-29 18:06:18 +02:00
a.inline-code {
2024-07-25 14:19:49 +02:00
padding-left: .1em;
padding-right: .1em;
border-radius: 1px;
background-color: #191f26;
}
2024-07-29 18:06:18 +02:00
/* Navbar */
#navbar {
left: 0;
top: 0;
bottom: 0;
width: max(16vw, 20ch);
overflow-y: auto;
position: absolute;
box-sizing: border-box;
overscroll-behavior-y: contain;
background-color: #161a26;
color: #aaa;
font-size: 0.9em;
font-weight: bold;
}
#navbar a {
color: #ffb454;
text-decoration: none;
font-weight: normal;
}
#navbar li {
display: block;
position: relative;
padding-left: 1em;
margin-left: 0em;
}
#navbar ul {
margin-left: 0em;
padding-left: 0;
}
#navbar summary{
display: block;
cursor: pointer;
}
#navbar summary::marker,
#navbar summary::-webkit-details-marker{
display: none;
}
#navbar summary:focus{
outline: none;
}
#navbar summary:focus-visible{
outline: 1px dotted #000;
}
#navbar summary:before {
content: "+";
color: #ffb454;
float: left;
text-align: center;
width: 1em;
}
#navbar details[open] > summary:before {
content: "";
}
2024-07-25 14:19:49 +02:00
/* Code blocks */
div.code-block-title {
background-color: #20202a;
padding-left: .3em;
}
div.code-block-content {
max-height: 20em;
margin-bottom: 0.2em;
width: auto;
overflow: auto;
background-color: #0f141a;
}
div.code-block-content td {
border: 0;
padding: 0;
}
div.code-block-content pre {
border: 0;
margin: 0;
}
div.code-block-content .code-block-gutter {
-moz-user-select: none;
-ms-user-select: none;
-webkit-user-select: none;
user-select: none;
padding-left: .1em;
padding-right: .2em;
text-align: right;
border-right: solid #2a2e3e 1px;
background: #222d3a;
}
div.code-block-content .code-block-line {
padding-left: .1em;
}
/* Media */
.media {
max-width: 85ch;
margin: auto;
text-align: center;
}
.medium {
padding-top: 1em;
display: inline-block;
vertical-align: middle;
margin-left: .5em;
margin-right: .5em;
}
.medium img {
max-width: 100%;
}
div.medium p.medium-refname {
margin: 0;
text-align: center;
font-weight: bold;
2024-07-26 15:06:09 +02:00
color: #d367c1;
2024-07-25 14:19:49 +02:00
}
div.medium p {
padding: 0;
margin-top: 0;
margin-left: 1em;
margin-right: 1em;
text-align: justify;
}
2024-07-26 15:06:09 +02:00
a.medium-ref {
display: inline;
font-weight: bold;
color: #d367c1;
}
a.medium-ref:hover {
background: #334;
}
a.medium-ref img {
display: none;
margin: 1.3em 0 0 0;
}
a:hover.medium-ref img {
max-width: 50%;
margin: auto;
display: inline-block;
position: absolute;
box-shadow: 0px 0px 6px 2px rgba(0,0,0,0.75);
}