You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
176 lines
2.9 KiB
176 lines
2.9 KiB
svg |
|
display: block |
|
width: auto |
|
height: auto |
|
max-width: 100% |
|
max-height: 100% |
|
margin: auto |
|
|
|
a |
|
text-decoration: inherit |
|
|
|
header |
|
z-index: 98 |
|
display: flex |
|
overflow: visible |
|
justify-content: space-between |
|
background-color: blue |
|
color: white |
|
line-height: 1em |
|
h1 |
|
z-index: 99 |
|
font-size: 100% |
|
margin: 0.5em |
|
&::before |
|
width: 1em |
|
content: "☰" |
|
color: white |
|
margin-right: .25em |
|
&:hover #menu |
|
display: block |
|
#menu |
|
display: none |
|
background-color: #ccc |
|
color: black |
|
margin: 1px |
|
padding: 0 |
|
border: 1px solid black |
|
z-index: 100 |
|
a |
|
margin: 0 |
|
padding: .5em |
|
&:hover |
|
background-color: #eee |
|
a + a |
|
border-top: 1px solid black |
|
&:hover |
|
display: block |
|
a |
|
margin: 0.5em |
|
display: none |
|
&[href] |
|
display: block |
|
&:link |
|
color: inherit |
|
#downloads, #info |
|
display: flex |
|
#clock |
|
margin: 0.5em |
|
#status |
|
margin: 0.5em |
|
&.wait |
|
&::before |
|
content: "⌛" |
|
color: inherit |
|
&.error |
|
&::before |
|
content: "✘" |
|
color: red |
|
&.success |
|
&::before |
|
content: "✔" |
|
color: green |
|
#orientation |
|
margin: 0.5em |
|
&.lr |
|
&::before |
|
content: "→" |
|
&.tb |
|
&::before |
|
content: "↓" |
|
&.rl |
|
&::before |
|
content: "←" |
|
&.bt |
|
&::before |
|
content: "↑" |
|
|
|
#error |
|
display: none |
|
background-color: red |
|
|
|
.top |
|
header |
|
position: absolute |
|
top: 0 |
|
left: 0 |
|
width: 100% |
|
height: 2em |
|
#menu |
|
position: absolute |
|
main |
|
position: absolute |
|
top: 2em |
|
left: 0 |
|
right: 0 |
|
bottom: 0 |
|
overflow: auto |
|
|
|
.bottom |
|
header |
|
position: absolute |
|
bottom: 0 |
|
left: 0 |
|
width: 100% |
|
height: 2em |
|
#menu |
|
position: absolute |
|
transform: translate(0, -100%) translate(0, -1em) |
|
main |
|
position: absolute |
|
top: 0 |
|
left: 0 |
|
right: 0 |
|
bottom: 2em |
|
overflow: auto |
|
|
|
.left |
|
header |
|
transform: translate(-50%) translate(1em) rotate(270deg) translate(-50%) translate(1em) |
|
position: absolute |
|
top: 0 |
|
left: 0 |
|
width: 100vh |
|
height: 2em |
|
#orientation |
|
transform: rotate(90deg) |
|
#menu |
|
position: absolute |
|
left: -3em |
|
transform: rotate(90deg) translate(50%) translate(-2em) |
|
main |
|
position: absolute |
|
top: 0 |
|
right: 0 |
|
left: 2em |
|
bottom: 0 |
|
|
|
.right |
|
header |
|
position: absolute |
|
top: 0 |
|
right: 0 |
|
width: 100vh |
|
height: 2em |
|
transform: translate(50%) translate(-1em) rotate(90deg) translate(50%) translate(-1em) |
|
#orientation |
|
transform: rotate(270deg) |
|
#menu |
|
position: absolute |
|
left: -3em |
|
transform: rotate(270deg) translate(-50%) translate(2em) |
|
main |
|
position: absolute |
|
top: 0 |
|
left: 0 |
|
right: 2em |
|
bottom: 0 |
|
overflow: auto |
|
|
|
#image |
|
height: 100% |
|
|
|
div#loading |
|
text-align: center |
|
margin-top: 40vh |
|
font-size: 200%
|
|
|