custom.css

.col-sm-5 {
    flex: 0 0 100%;
    max-width: 100%;
}
.v-btn.v-size--default.btncolor.flex-grow-1 {
    border-radius: 6px !important;
}
button.v-btn--has-bg.theme--dark.v-size--default.primary.grey--text.text--darken-3 {
    opacity: 0.8;
}
.theme--dark.v-btn:hover:before {
    opacity: 0.15;
    transition: 1s;
}
.v-text-field--filled>.v-input__control>.v-input__slot, .v-text-field--full-width>.v-input__control>.v-input__slot, .v-text-field--outlined>.v-input__control>.v-input__slot {
    max-height: 500px;
}
.theme--dark.app-btn-group.app-btn-group--divided>.v-btn:first-child {
    border-bottom-left-radius: 6px !important;
    border-top-left-radius: 6px !important;
}
.theme--dark.app-btn-group.app-btn-group--divided>.v-btn:last-child {
    border-bottom-right-radius: 6px !important;
    border-top-right-radius: 6px !important;
}
.console-command .v-text-field__slot input {
    font-family: 'Roboto' !important;
    font-size: 0.95rem;
}
button.px-0.flex-grow-1.v-btn.v-btn--has-bg.theme--dark.v-size--default {
    border-radius: 6px !important;
}
.col-sm-6.col-md-12.col-lg-6.col-12 {
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: space-evenly;
}
.app-setting-control .sc-content {
    flex-wrap: wrap;
    gap: 10px;
}
button.v-btn.v-btn--block.v-btn--is-elevated.v-btn--has-bg.theme--dark.v-size--default.btncolor,
button.v-btn.v-btn--block.v-btn--disabled.v-btn--has-bg.theme--dark.v-size--default {
    font-weight: 300;
    font-size: 0.9em;
    margin-bottom: 6px;
}
.px-2.py-1.text-center.stat-square.justify-center.v-card.v-sheet.v-sheet--outlined.theme--dark {
    box-shadow: 0px 0px 5px -2px black !important;
}
.v-application .btncolor {
    background: #1c1c1c57 !important;
}
.v-text-field.v-input--is-focused>.v-input__control>.v-input__slot:after {
    display: none;
}
.v-ripple__animation--in {
    transition: all 0.2s cubic-bezier(0, 1, 1, 0);
}
.v-ripple__animation {
    border-radius: inherit !important;
    background: #282828 !important;
}
.v-btn--block {
    max-width: 100%;
}
.text-body-1.py-0.col-sm-5.col-12.align-self-center {
    margin-bottom: 5px;
}
.v-card__text.body-1.text-body-1.py-3 {
    text-wrap: pretty;
}
.v-input.v-input--hide-details.v-input--is-label-active.v-input--is-dirty.v-input--is-focused.v-input--dense.theme--dark.v-text-field.v-text-field--single-line.v-text-field--filled.v-text-field--is-booted.v-text-field--enclosed.primary--text {
    border: solid 1px;
    border-radius: 8px;
}
video {
    border-radius: 8px;
}
.preview-options,
.preview-name,
.camera-name, .camera-frames {
    background: #28282895 !important;
}
g#background {
    opacity: 0.4;
}
.v-card.collapsable-card .v-card__title.collapsable-card-title .v-tabs .v-tabs-bar__content>.v-tab:first-child:before {
    border-top-left-radius: 10px !important;
}
.v-toolbar__items {
    padding: 8px;
}
button.v-btn.v-btn--disabled.v-btn--has-bg.theme--dark.v-size--default {
    border: none !important;
}
button.positioning-toggle-button.v-btn.v-item--active.v-btn--active.v-btn--disabled.v-btn--has-bg.theme--dark.v-size--default {
    background: #18171795 !important;
}
.theme--dark.v-btn.v-btn--disabled.v-btn--has-bg {
    background-color: #00000029 !important;
    opacity: 0.8;
}
span.v-icon.notranslate.spool-icon.theme--dark {
    stroke: none !important;
    opacity: 0.7;
    filter: drop-shadow(0px 0px 10px #343434);
}
.fill-height.v-card.v-sheet.theme--dark {
    background: #282828;
}
header.v-sheet.theme--dark.v-toolbar.v-toolbar--dense {
    box-shadow: none;
    border-bottom: solid 1px #564f4f;
}
.v-card.v-card--flat.v-sheet.theme--dark,
.v-btn--is-elevated,
.v-card.collapsable-card:not(.collapsed) .v-card__title.collapsable-card-title{
    box-shadow: none !important;
}
.v-card__title.collapsable-card-title.card-heading.draggable {
    border-radius: 10px;
}
.v-card.collapsed>.card-heading {
    border-radius: 10px !important;
}
.sc-label.text-body-1.pr-0.pr-sm-3.pb-0.pb-sm-3.col-sm-6.col-12.align-self-center {
    white-space: break-spaces;
}
.px-2.py-1.text-center.stat-square.v-card.v-sheet.v-sheet--outlined.theme--dark,
.theme--dark.v-data-table tbody tr.v-data-table__selected,
.theme--dark.v-text-field--solo>.v-input__control>.v-input__slot,
.camera-container.v-sheet.theme--dark.elevation-0,
.mb-4.v-card.v-sheet.theme--dark.elevation-5,
.v-card__text.pa-0 {
    background-color: #28282860;
}
.theme--dark.v-expansion-panels .v-expansion-panel {
    background-color: transparent;
    color: #fffc;
}
.cm-scroller {
    background: #232323 !important;
}
div#card-content {
    background: #28282860 !important;
}
:root {
    --v-warning-base: #c97e20;
    --v-card-heading-base: #28282895;
    --v-btncolor-base: #28282870;
    --v-secondary-base: #c4c3c3;
}
.v-progress-linear__background.primary {
    background-color: #3f3737 !important;
    z-index: 20;
    border-bottom-right-radius: 0.5em;
    border-top-right-radius: 0.5em;
    opacity: 1 !important;
}
.v-progress-linear__buffer {
    border-radius: 0.5em;
    background-color: #cd8301b5;
}
.theme--dark.v-sheet {
    background: none;
}
.theme--dark.v-sheet--outlined {
    border: 0;
}
.focus--text {
    text-wrap: nowrap;
}
main.v-main {
    background-color: hsl(217deg 3.4% 34.41%) !important;
    background-image: 
        radial-gradient(at 3% 24%, hsl(42deg 21.09% 45.64%) 0px, transparent 50%),
        radial-gradient(at 10% 12%, hsla(47, 45%, 43%, 0.19) 0px, transparent 50%),
        radial-gradient(at 12% 62%, hsl(139deg 33.59% 56.35% / 60%) 0px, transparent 50%),
        radial-gradient(at 47% 60%, hsl(24.71deg 100% 20.55% / 75%) 0px, transparent 50%),
        radial-gradient(at 85% 2%, hsl(157.63deg 56.27% 28.31% / 69%) 0px, transparent 50%),
        radial-gradient(at 89% 56%, hsl(50.37deg 31.75% 45.53% / 79%) 0px, transparent 50%) !important;
}
.v-card.v-sheet.theme--dark.panel.settings-menu-dialog,
.v-menu__content.theme--dark.menuable__content__active,
.v-dialog--scrollable>.v-card, .v-dialog--scrollable>form>.v-card,
.v-card.v-sheet.theme--dark.rounded-0,
.v-snack__wrapper.v-sheet.theme--dark.elevation-24 {
    background-color: hsl(60.23deg 1.37% 31.07%) !important;
    background-image:
        radial-gradient(at 3% 24%, hsl(0deg 0% 13.53% / 19%) 0px, transparent 50%),
        radial-gradient(at 10% 12%, hsla(47, 45%, 43%, 0.19) 0px, transparent 50%),
        radial-gradient(at 12% 62%, hsl(39.29deg 66.2% 19.04% / 25%) 0px, transparent 50%),
        radial-gradient(at 47% 60%, hsl(38.08deg 65.27% 22.96% / 5%) 0px, transparent 50%),
        radial-gradient(at 85% 2%, hsl(53.13deg 27.76% 43.26% / 50%) 0px, transparent 50%),
        radial-gradient(at 89% 56%, hsl(50.37deg 19.66% 25.13% / 79%) 0px, transparent 50%) !important;
}
.v-sheet.v-card {
    border-radius: 10px !important;
    box-shadow: 0 0px 10px -2px #0003, 0 0px 2px #00000024, 0 0px 8px #0000001f !important;
}
.theme--dark.v-data-table,
.theme--dark.v-tabs-items {
    background-color: transparent;
}
.theme--dark.v-data-table.v-data-table--fixed-header thead th {
    background-color: #28282870;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.expanded header.v-toolbar {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
.theme--dark.v-app-bar.v-toolbar.v-sheet {
    background-color: #28282880!important;
    box-shadow: 0 3px 10px -2px #0003, 0 2px 2px #00000024, 0 1px 8px #0000001f !important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.theme--dark.v-navigation-drawer {
    background-color: #28282840!important;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.v-navigation-drawer__image {
    display: none;
}
.theme--dark.v-data-table>.v-data-table__wrapper>table>tbody>tr:hover:not(.v-data-table__expanded__content):not(.v-data-table__empty-wrapper) {
    background: #3f3f3f80;
}
.v-list.v-sheet.theme--dark.v-list--dense {
    background-color: #28282840 !important;
}
.theme--dark.v-btn.v-btn--has-bg {
    background-color: #00000040;
}
.theme--dark.v-tabs>.v-tabs-bar {
    background-color: #12121280;
}
.file-system .theme--dark.v-data-table tr>td.actions div {
    background: #28282860;
    border-radius: 5px;
    padding: 8px;
}
.theme--dark.v-btn-toggle:not(.v-btn-toggle--group),
.file-system .theme--dark.v-data-table tr>td.actions div:before {
    background: none !important;
}
.v-menu__content.theme--dark.menuable__content__active,
.v-dialog--scrollable>.v-card, .v-dialog--scrollable>form>.v-card {
    border-radius: 10px !important;
    border: solid 1px;
    border-color: #56565661;
}
.v-sheet.v-list:not(.v-sheet--outlined) {
    box-shadow: 0 0 #000, 0 0 #000000, 0 0 #000000;
}
.theme--dark.v-list {
    background: transparent;
}
.v-btn {
    border-radius: 6px;
}
.row.my-2.mx-0.my-2.mx-0 {
    background-color: #28282880 !important;
    border-radius: 8px;
}
.v-text-field fieldset, .v-text-field .v-input__control, .v-text-field .v-input__slot {
    border-radius: 8px;
}
.v-application .grey.darken-3 {
    background-color: #28282890 !important;
}
.theme--dark.v-data-table>.v-data-table__wrapper>table>tbody>tr:hover:not(.v-data-table__expanded__content):not(.v-data-table__empty-wrapper) {
    background: #28282840;
}
.v-card.v-sheet.theme--dark.panel.status-panel.mb-3.mb-md-6,
.v-list.fill-height.v-sheet.theme--dark.v-list--dense {
    background: transparent !important;
}
.filesGcodeCard.v-card.v-card--flat.v-sheet.theme--dark {
    border-radius: 0 !important;
}
.viewer {
    opacity: 0.7;
    border-radius: 8px;
}
img.webcamImage {
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
}
span.webcamFpsOutput {
    border-bottom-right-radius: 10px;
}
x-vue-echarts.tempchart.echarts {
    width: 95%;
}
.px-2.col-auto.d-flex.flex-column.justify-center.align-center.col {
    padding-left: 20px !important;
}
.px-2.col-auto.d-flex.justify-center.align-center.col {
    padding-left: 20px !important;
}
.v-avatar.v-list-item__avatar.rounded-0.v-avatar--tile {
    filter: drop-shadow(0px 0px 8px #3f3f3f);
}
.cm-gutters {
    border-top-left-radius: 8px;
}
.cm-lineNumbers .cm-gutterElement {
    margin-left: 4px;
}
.cm-gutterElement.cm-activeLineGutter {
    background-color: var(--v-warning-base);
    margin: 0;
    color: white;
    font-weight: 900;
}
.codeview {
    border-radius: 8px;
}
nav.v-navigation-drawer.v-navigation-drawer--clipped.v-navigation-drawer--fixed.v-navigation-drawer--mini-variant.v-navigation-drawer--open.theme--dark {
    box-shadow: 2px 2px 15px 0px rgba(0,0,0,0.65);
}
.theme--dark.v-chip:not(.v-chip--active) {
    background: #28282870;
    margin: 2px 2px 2px 2px;
}
.v-list-item--link:before {
    background-color: #000000fc;
    border-bottom: solid 1px;
    border-top: solid 1px;
    border-color: #818181;
    box-shadow: 0 0 10px -1px #000000;
}
.theme--dark.v-list-item:hover:before {
    opacity: .18;
}
.filesystem-wrapper.v-card.v-card--flat.v-sheet.theme--dark {
    background-color: transparent !important;
}
.console-wrapper.v-card.v-card--flat.v-sheet.theme--dark {
    box-shadow: none !important;
    border-top: solid thin #676060 !important;
    border-radius: 0 !important;
}
.v-application .justify-space-between {
    justify-content: center !important;
}
.controls-wrapper.col {
    max-width: 100% !important;
}
.v-application .elevation-2 {
    box-shadow: 0 0px 6px -2px #0003!important;
}
button.flex-grow-1.v-btn.v-btn--is-elevated.v-btn--has-bg.theme--dark.v-size--default.primary.grey--text.text--darken-3 {
    max-width: 180px;
    border-radius: 8px !important;
    padding-left: 2px;
    padding-right: 2px;
    margin-left: 5px !important;
    margin-right: 5px !important;
}
button.value.v-btn.v-btn--disabled.v-btn--has-bg.theme--dark.v-size--default.grey--text.text--darken-3,
button.value.v-btn.v-btn--is-elevated.v-btn--has-bg.theme--dark.v-size--default.error  {
    max-width: 100%;
    flex-grow: 1;
    border-radius: 6px !important;
    margin: 0 5px 0 5px !important;
}
header.v-sheet.theme--dark.v-toolbar.v-toolbar--dense {
    background: transparent;
}
.v-application .text-body-1 {
    font-size: 0.8rem !important;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: visible;
    width: 100%;
}
.theme--dark .toolbar-logo {
    border: 0 !important;
    background: none !important;
}
a.v-list-item--active.v-list-item.v-list-item--link.theme--dark.secondary--text {
    border-right: solid 3px #c78a1b;
}
.v-text-field>.v-input__control>.v-input__slot:before,
.theme--dark .v-card .v-card__title.collapsable-card-title{
    border: 0 !important;
}
button.value.v-btn.v-btn--is-elevated.v-btn--has-bg.theme--dark.v-size--default.primary.grey--text.text--darken-3 {
    flex-grow: 1;
    border-radius: 6px !important;
    margin: 0 3px !important;
}
button.flex-grow-1.v-btn.v-btn--is-elevated.v-btn--has-bg.theme--dark.v-size--default.btncolor {
    border-radius: 6px;
}
.layout.wrap {
    display: flex;
    flex-wrap: wrap;
    max-width: 600px !important;
    flex-direction: row;
    justify-content: space-evenly;
    gap: 10px;
}
.py-0.col {
    min-width: 100%;
}
.text-body-1.py-0.col-sm-5.col-12.align-self-center,
.theme--dark.v-btn.v-btn--disabled.v-btn--has-bg{
    max-width: 100%;
}
.vue-recycle-scroller.console-scroller.ready.direction-vertical {
    padding: 10px;
}
.v-input--selection-controls__input:hover .v-input--selection-controls__ripple:before {
    display: none;
}
.v-progress-linear__determinate {
    display: none;
}
button.v-btn.v-btn--is-elevated.v-btn--has-bg.theme--dark.v-size--default.btncolor {
    border-radius: 6px;
}
.app-btn-group:not(.app-btn-group--vertical)>.v-btn {
    border-radius: 0 !important;
    margin: 0 !important;
}
header.v-sheet.theme--dark.elevation-6.v-toolbar.v-toolbar--dense {
    background-image: none !important;
    background-color: #4f4f4f60 !important;
}
.col-md-4.col-12 {
    align-content: center;
}
.px-2.py-1.text-center.stat-square.justify-center.v-card.v-sheet.v-sheet--outlined.theme--dark {
    margin-bottom: 6px;
}