unplugged-system/packages/services/Car/tools/telemetry/lua-interpreter/static/css/index.css

117 lines
2.1 KiB
CSS

:root {
--mdc-theme-background: #202124;
--mdc-theme-error: #f28b82;
--mdc-theme-on-error: black;
--mdc-theme-on-primary: #202124;
--mdc-theme-on-secondary: #d2e3fc;
--mdc-theme-on-surface: #e8eaed;
--mdc-theme-primary: #8ab4f8;
--mdc-theme-secondary: #8ab4f83d;
--mdc-theme-surface: #202124;
}
.hide {
display: none;
}
.input-container {
display: flex;
flex-direction: row;
height: 600px;
}
.script-container {
display: flex;
flex-direction: column;
height: 100%;
margin: 0 7px 0 0;
width: 50%;
}
.data-container {
display: flex;
flex-direction: column;
height: 100%;
margin: 0 0 0 7px;
width: 50%;
}
.function-name {
background-color: transparent;
border: 1px solid var(--mdc-theme-on-surface);
color: var(--mdc-theme-on-surface);
height: auto;
margin: 10px 0 0;
padding: 10px;
resize: none;
width: auto;
}
.published-data-container {
display: flex;
flex-direction: column;
height: 55%;
margin: 0 0 5px;
width: auto;
}
.published-data-button-group {
height: auto;
overflow-x: auto;
overflow-y: hidden;
padding-bottom: 10px;
white-space: nowrap;
width: 100%;
}
/**
* The CodeMirrors are configured to fill up whatever container they are in so these
* specify the actual size of them.
*/
.script-input-container {
height: 90%;
width: auto;
overflow: auto;
}
.published-data-input-container {
height: 100%;
margin: 5px 0 0;
overflow: auto;
}
.saved-state-input-container {
height: 45%;
width: auto;
}
.submit {
margin: 10px 0 10px;
}
.script-output {
box-sizing: border-box;
font-family: monospace;
height: 300px;
overflow: auto;
}
/** webkit-scrollbar modifies the appearence of the scrollbar. */
::-webkit-scrollbar {
width: 10px;
}
/* Modifies scrollbar track */
::-webkit-scrollbar-track {
background: transparent
}
/* Modifies scrollbar handle */
::-webkit-scrollbar-thumb {
background: #434c5e;
}
/** Modifies the scrollbar for the published data header div ONLY. */
.published-data-header::-webkit-scrollbar {
height: 10px;
}