122 lines
4.3 KiB
CSS
122 lines
4.3 KiB
CSS
:root {
|
|
--bg-color: #fff;
|
|
--fg-color: #111;
|
|
--link-color: darkblue;
|
|
}
|
|
|
|
* {box-sizing: border-box; margin:0;padding:0}
|
|
html, body {
|
|
position: fixed;
|
|
width: 100vw;
|
|
height: 100vh;
|
|
color: var(--fg-color);
|
|
background: var(--bg-color);
|
|
font-family: sans-serif
|
|
}
|
|
body[data-theme="dark"] {
|
|
--bg-color: #111;
|
|
--fg-color: #fff;
|
|
--link-color: cyan;
|
|
}
|
|
|
|
.preheader {position: absolute; top: 0; left: 0; width: 100%; height: 26px; background: #111}
|
|
header {position: absolute; top: 26px; left: 0; padding-left: 1px; width: 100%; height: 26px; border-bottom: 1px solid var(--fg-color); vertical-align: middle}
|
|
main {position: absolute; top: 52px; left: 0; width: 100%; height: calc(100% - 72px);font-size: 16px}
|
|
footer {position: absolute; bottom: 0; left: 0; width: 100%; padding: 0 4px; height: 20px; border-top: 1px solid var(--fg-color); font-size: 14px}
|
|
|
|
header>* {display:inline-block; font-size: 18px; padding: 2px; vertical-align: middle;line-height:22px}
|
|
header .addr {text-overflow: ellipsis; overflow: hidden; max-width: 87%; white-space: nowrap}
|
|
footer .status {width: 100%; text-overflow: ellipsis; overflow: hidden; white-space: nowrap}
|
|
|
|
.content {
|
|
position: absolute;
|
|
left: 2%;
|
|
width: 96%;
|
|
height: 100%;
|
|
overflow: scroll;
|
|
line-height:1.5em;
|
|
white-space: pre;
|
|
}
|
|
|
|
.content[data-wrap="1"] {
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
.content[data-format="plain"] {
|
|
font-family: "Droid Sans Mono", monospace;
|
|
font-size: 15px;
|
|
}
|
|
|
|
.content pre {
|
|
font-family: "Droid Sans Mono", monospace;
|
|
font-size: 15px;
|
|
white-space: inherit!important;
|
|
}
|
|
|
|
.content a:before {
|
|
content: "\21d2 ";
|
|
color: var(--link-color);
|
|
text-decoration: none;
|
|
}
|
|
.content a, .content a:visited, .content a:active {
|
|
color: var(--link-color);
|
|
text-decoration: none;
|
|
}
|
|
.content a[data-focused="1"] {text-decoration: underline}
|
|
|
|
/* Terminal infoline styling */
|
|
|
|
/* modes = ['', 'BB', 'FN', 'IT', 'UL', 'BL', '', 'IN', 'HI', 'ST'] */
|
|
|
|
/* colors (FC/BC): 0 black, 1 red, 2 green, 3 yellow, 4 blue, 5 magenta, 6 cyan, 7 white */
|
|
|
|
.content span[data-styling] {
|
|
--ds-fg-color: var(--fg-color);
|
|
--ds-bg-color: var(--bg-color);
|
|
background: var(--ds-bg-color);
|
|
color: var(--ds-fg-color);
|
|
}
|
|
|
|
@keyframes strict_blink {
|
|
0% {visibility: hidden}
|
|
50% {visibility: hidden}
|
|
100% {visibility: visible}
|
|
}
|
|
|
|
.content span[data-styling~="BB"] {font-weight: bold}
|
|
.content span[data-styling~="FN"] {font-weight: lighter}
|
|
.content span[data-styling~="IT"] {font-style: italic}
|
|
.content span[data-styling~="UL"] {text-decoration: underline}
|
|
.content span[data-styling~="BL"] {animation: 2s linear infinite strict_blink}
|
|
.content span[data-styling~="IN"] {background:var(--ds-fg-color);color:var(--ds-bg-color)}
|
|
.content span[data-styling~="HI"] {visibility: hidden}
|
|
.content span[data-styling~="ST"] {text-decoration: line-through}
|
|
/* normal color variants */
|
|
.content span[data-styling~="FC0"] {--ds-fg-color: #111}
|
|
.content span[data-styling~="FC1"] {--ds-fg-color: red}
|
|
.content span[data-styling~="FC2"] {--ds-fg-color: green}
|
|
.content span[data-styling~="FC3"] {--ds-fg-color: yellow}
|
|
.content span[data-styling~="FC4"] {--ds-fg-color: blue}
|
|
.content span[data-styling~="FC5"] {--ds-fg-color: magenta}
|
|
.content span[data-styling~="FC6"] {--ds-fg-color: cyan}
|
|
.content span[data-styling~="FC7"] {--ds-fg-color: #fff}
|
|
/* bright/bold color variants */
|
|
.content span[data-styling~="FC0"][data-styling~="BB"] {--ds-fg-color: black}
|
|
.content span[data-styling~="FC1"][data-styling~="BB"] {--ds-fg-color: red}
|
|
.content span[data-styling~="FC2"][data-styling~="BB"] {--ds-fg-color: lime}
|
|
.content span[data-styling~="FC3"][data-styling~="BB"] {--ds-fg-color: yellow}
|
|
.content span[data-styling~="FC4"][data-styling~="BB"] {--ds-fg-color: deepskyblue}
|
|
.content span[data-styling~="FC5"][data-styling~="BB"] {--ds-fg-color: fuchsia}
|
|
.content span[data-styling~="FC6"][data-styling~="BB"] {--ds-fg-color: cyan}
|
|
.content span[data-styling~="FC7"][data-styling~="BB"] {--ds-fg-color: white}
|
|
|
|
.content span[data-styling~="BC0"] {--ds-bg-color: black}
|
|
.content span[data-styling~="BC1"] {--ds-bg-color: red}
|
|
.content span[data-styling~="BC2"] {--ds-bg-color: green}
|
|
.content span[data-styling~="BC3"] {--ds-bg-color: yellow}
|
|
.content span[data-styling~="BC4"] {--ds-bg-color: blue}
|
|
.content span[data-styling~="BC5"] {--ds-bg-color: magenta}
|
|
.content span[data-styling~="BC6"] {--ds-bg-color: cyan}
|
|
.content span[data-styling~="BC7"] {--ds-bg-color: white}
|
|
|