145 lines
1.8 KiB
CSS
145 lines
1.8 KiB
CSS
html, body {
|
|
margin: 0px;
|
|
padding: 0px;
|
|
overflow: hidden;
|
|
}
|
|
body {
|
|
background-color: var(--onedark-bg);
|
|
padding: 2em;
|
|
}
|
|
|
|
|
|
span.line {
|
|
display: block;
|
|
color: var(--onedark-white);
|
|
}
|
|
span.line.stderr-debug { color: var(--onedark-green); }
|
|
span.line.stderr-info { color: var(--onedark-blue); }
|
|
span.line.stderr-warning { color: var(--onedark-orange); }
|
|
span.line.stderr-error { color: var(--onedark-red); }
|
|
span.line.stderr-javascript { color: var(--onedark-purple); }
|
|
|
|
|
|
|
|
|
|
|
|
div.collection {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 2rem;
|
|
}
|
|
|
|
div.collection div.item {
|
|
flex-basis: 50%;
|
|
flex: 20rem;
|
|
|
|
height: calc(100vh - 4em);
|
|
max-width: 100%;
|
|
|
|
position: relative;
|
|
overflow: hidden;
|
|
|
|
display: flex;
|
|
flex-flow: column nowrap;
|
|
|
|
margin: 0rem;
|
|
padding: 0rem;
|
|
}
|
|
|
|
@media only screen and (max-width: 1200px) {
|
|
html, body {
|
|
overflow-y: visible;
|
|
}
|
|
div.collection div.item {
|
|
flex-basis: 100%;
|
|
height: auto;
|
|
min-height: 8rem;
|
|
}
|
|
#console {
|
|
min-height: 8rem;
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.button {
|
|
align-items: center;
|
|
|
|
padding: 1rem 1.5rem;
|
|
width: fit-content;
|
|
|
|
color: var(--onedark-white);
|
|
|
|
background-color: var(--onedark-bg-light);
|
|
}
|
|
|
|
.button:not(.one-line) {
|
|
display: inline-flex;
|
|
margin: 1rem 1rem 0rem 0rem;
|
|
}
|
|
.button.one-line {
|
|
display: flex;
|
|
margin: 0rem 0rem 1rem 0rem;
|
|
}
|
|
|
|
.button:hover {
|
|
cursor: pointer;
|
|
background-color: var(--onedark-gray-dark-dark);
|
|
}
|
|
|
|
.button .text {
|
|
display: inline-flex;
|
|
flex-flow: column;
|
|
margin-left: 1rem;
|
|
}
|
|
.button img.icon {
|
|
height: 1.5rem;
|
|
}
|
|
.button .extra {
|
|
color: var(--onedark-gray);
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
div.collection div.item.editor > div.prism-live {
|
|
height: 100%;
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
div.collection div.item.console div.controls {
|
|
padding-bottom: 1rem;
|
|
}
|
|
#console {
|
|
margin: 0px;
|
|
padding: 1rem;
|
|
overflow: auto;
|
|
font-size: 1rem;
|
|
|
|
height: 100%;
|
|
|
|
background-color: var(--onedark-bg-light);
|
|
}
|