kopia lustrzana https://github.com/OpenBuilds/OpenBuilds-CONTROL
Merge pull request #223 from Mumfrey/feature/dark-mode
Dark and high contrast theme supportrevert-223-feature/dark-mode
Peter van der Walt
GitHub
commit
e713ee4592
|
|
@ -0,0 +1,243 @@
|
|||
body.theme_dark, .theme_dark div.window, .theme_dark .card, .theme_dark #splash {
|
||||
background: #333;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_dark .ribbon-menu .content-holder {
|
||||
background: #444;
|
||||
}
|
||||
|
||||
.theme_dark .ribbon-menu .tabs-holder, .theme_dark .ribbon-menu .content-holder .section {
|
||||
border-color: #666;
|
||||
}
|
||||
|
||||
.theme_dark .ribbon-menu .tabs-holder li {
|
||||
background: #222;
|
||||
color: #DDD;
|
||||
}
|
||||
|
||||
.theme_dark .ribbon-menu .tabs-holder li:hover {
|
||||
border-color: #222;
|
||||
}
|
||||
|
||||
.theme_dark .ribbon-menu .tabs-holder .active {
|
||||
background: #444;
|
||||
border-color: #666;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_dark .ribbon-button, .theme_dark .ribbon-button-dropdown, .theme_dark .ribbon-icon-button, .theme_dark .ribbon-tool-button {
|
||||
background-color: #444;
|
||||
color: #DDD;
|
||||
}
|
||||
|
||||
.theme_dark .ribbon-menu .content-holder .group+.group, .theme_dark .ribbon-menu .content-holder .group .title {
|
||||
border-color: #555;
|
||||
}
|
||||
|
||||
.theme_dark .dialog.dark, .theme_dark .dialog {
|
||||
background: #333;
|
||||
color: #FFF;
|
||||
border-color: #666;
|
||||
}
|
||||
|
||||
.theme_dark .dialog.dark .dialog-title, .theme_dark .dialog .dialog-title {
|
||||
background: #CCC;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.theme_dark .dialog-actions {
|
||||
border-color: #666;
|
||||
}
|
||||
|
||||
.theme_dark .button.light, .theme_dark .command-button.light, .theme_dark .image-button.light, .theme_dark .info-button.light, .theme_dark .input .button.light, .theme_dark .notify.light, .theme_dark .select .button.light, .theme_dark .shortcut.light, .theme_dark .spinner .button.light, .theme_dark .split-button .split.light, .theme_dark .tag-input .button.light, .theme_dark .tally.light, .theme_dark .toast.light, .theme_dark .tool-button.light, .theme_dark code.light, .theme_dark tbody td.light, .theme_dark tbody tr.light,
|
||||
.theme_dark .dro {
|
||||
background-color: #555;
|
||||
border-color: #999;
|
||||
}
|
||||
|
||||
.theme_dark .button.light:hover, .theme_dark .command-button.light:hover, .theme_dark .image-button.light:hover, .theme_dark .info-button.light:hover, .theme_dark .input .button.light:hover, .theme_dark .notify.light:hover, .theme_dark .select .button.light:hover, .theme_dark .shortcut.light:hover, .theme_dark .spinner .button.light:hover, .theme_dark .split-button .split.light:hover, .theme_dark .tag-input .button.light:hover, .theme_dark .tally.light:hover, .theme_dark .toast.light:hover, .theme_dark .tool-button.light:hover, .theme_dark code.light:hover, .theme_dark tbody td.light:hover, .theme_dark tbody tr.light:hover {
|
||||
background-color: #333;
|
||||
}
|
||||
|
||||
.theme_dark .button.disabled, .theme_dark .button:disabled, .theme_dark .command-button.disabled, .theme_dark .command-button:disabled, .theme_dark .image-button.disabled, .theme_dark .image-button:disabled, .theme_dark .shortcut.disabled, .theme_dark .shortcut:disabled, .theme_dark .split-button .split.disabled, .theme_dark .split-button .split:disabled, .theme_dark .tool-button.disabled, .theme_dark .tool-button:disabled {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.theme_dark .file, .theme_dark .input, .theme_dark .select, .theme_dark .spinner, .theme_dark .tag-input, .theme_dark .textarea, .theme_dark input[type=datetime-local], .theme_dark input[type=email], .theme_dark input[type=file], .theme_dark input[type=month], .theme_dark input[type=number], .theme_dark input[type=password], .theme_dark input[type=search], .theme_dark input[type=tel], .theme_dark input[type=text], .theme_dark input[type=time], .theme_dark input[type=url], .theme_dark input[type=week], .theme_dark select, .theme_dark textarea {
|
||||
background-color: #222;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_dark .file.disabled .caption, .theme_dark .file.disabled .select-input, .theme_dark .file.disabled .stars li, .theme_dark .file.disabled input, .theme_dark .file.disabled select, .theme_dark .file.disabled textarea, .theme_dark .file:disabled .caption, .theme_dark .file:disabled .select-input, .theme_dark .file:disabled .stars li, .theme_dark .file:disabled input, .theme_dark .file:disabled select, .theme_dark .file:disabled textarea, .theme_dark .input.disabled .caption, .theme_dark .input.disabled .select-input, .theme_dark .input.disabled .stars li, .theme_dark .input.disabled input, .theme_dark .input.disabled select, .theme_dark .input.disabled textarea, .theme_dark .input:disabled .caption, .theme_dark .input:disabled .select-input, .theme_dark .input:disabled .stars li, .theme_dark .input:disabled input, .theme_dark .input:disabled select, .theme_dark .input:disabled textarea, .theme_dark .rating.disabled .caption, .theme_dark .rating.disabled .select-input, .theme_dark .rating.disabled .stars li, .theme_dark .rating.disabled input, .theme_dark .rating.disabled select, .theme_dark .rating.disabled textarea, .theme_dark .rating:disabled .caption, .theme_dark .rating:disabled .select-input, .theme_dark .rating:disabled .stars li, .theme_dark .rating:disabled input, .theme_dark .rating:disabled select, .theme_dark .rating:disabled textarea, .theme_dark .select.disabled .caption, .theme_dark .select.disabled .select-input, .theme_dark .select.disabled .stars li, .theme_dark .select.disabled input, .theme_dark .select.disabled select, .theme_dark .select.disabled textarea, .theme_dark .select:disabled .caption, .theme_dark .select:disabled .select-input, .theme_dark .select:disabled .stars li, .theme_dark .select:disabled input, .theme_dark .select:disabled select, .theme_dark .select:disabled textarea, .theme_dark .spinner.disabled .caption, .theme_dark .spinner.disabled .select-input, .theme_dark .spinner.disabled .stars li, .theme_dark .spinner.disabled input, .theme_dark .spinner.disabled select, .theme_dark .spinner.disabled textarea, .theme_dark .spinner:disabled .caption, .theme_dark .spinner:disabled .select-input, .theme_dark .spinner:disabled .stars li, .theme_dark .spinner:disabled input, .theme_dark .spinner:disabled select, .theme_dark .spinner:disabled textarea, .theme_dark .tag-input.disabled .caption, .theme_dark .tag-input.disabled .select-input, .theme_dark .tag-input.disabled .stars li, .theme_dark .tag-input.disabled input, .theme_dark .tag-input.disabled select, .theme_dark .tag-input.disabled textarea, .theme_dark .tag-input:disabled .caption, .theme_dark .tag-input:disabled .select-input, .theme_dark .tag-input:disabled .stars li, .theme_dark .tag-input:disabled input, .theme_dark .tag-input:disabled select, .theme_dark .tag-input:disabled textarea, .theme_dark .textarea.disabled .caption, .theme_dark .textarea.disabled .select-input, .theme_dark .textarea.disabled .stars li, .theme_dark .textarea.disabled input, .theme_dark .textarea.disabled select, .theme_dark .textarea.disabled textarea, .theme_dark .textarea:disabled .caption, .theme_dark .textarea:disabled .select-input, .theme_dark .textarea:disabled .stars li, .theme_dark .textarea:disabled input, .theme_dark .textarea:disabled select, .theme_dark .textarea:disabled textarea {
|
||||
background-color: #222;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.theme_dark .file.disabled, .theme_dark .file:disabled, .theme_dark .input.disabled, .theme_dark .input:disabled, .theme_dark .select.disabled, .theme_dark .select:disabled, .theme_dark .spinner.disabled, .theme_dark .spinner:disabled, .theme_dark .tag-input.disabled, .theme_dark .tag-input:disabled, .theme_dark .textarea.disabled, .theme_dark .textarea:disabled, .theme_dark input[type=datetime-local].disabled, .theme_dark input[type=datetime-local]:disabled, .theme_dark input[type=email].disabled, .theme_dark input[type=email]:disabled, .theme_dark input[type=file].disabled, .theme_dark input[type=file]:disabled, .theme_dark input[type=month].disabled, .theme_dark input[type=month]:disabled, .theme_dark input[type=number].disabled, .theme_dark input[type=number]:disabled, .theme_dark input[type=password].disabled, .theme_dark input[type=password]:disabled, .theme_dark input[type=search].disabled, .theme_dark input[type=search]:disabled, .theme_dark input[type=tel].disabled, .theme_dark input[type=tel]:disabled, .theme_dark input[type=text].disabled, .theme_dark input[type=text]:disabled, .theme_dark input[type=time].disabled, .theme_dark input[type=time]:disabled, .theme_dark input[type=url].disabled, .theme_dark input[type=url]:disabled, .theme_dark input[type=week].disabled, .theme_dark input[type=week]:disabled, .theme_dark select.disabled, .theme_dark select:disabled, .theme_dark textarea.disabled, .theme_dark textarea:disabled {
|
||||
background: #222;
|
||||
}
|
||||
|
||||
.theme_dark .input .prepend, .theme_dark .select .prepend, .theme_dark .input .append {
|
||||
background: #99999922;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_dark .d-menu, .theme_dark .v-menu, .theme_dark .ribbon-dropdown {
|
||||
background: #222;
|
||||
color: #FFF;
|
||||
border: 1px solid #999;
|
||||
}
|
||||
|
||||
.theme_dark #command {
|
||||
font-family: consolas;
|
||||
}
|
||||
|
||||
.theme_dark .bg-openbuilds {
|
||||
background-color: #666 !important;
|
||||
}
|
||||
|
||||
.theme_dark .fg-openbuilds {
|
||||
color: #DDD !important;
|
||||
}
|
||||
|
||||
.theme_dark .fg-red, .theme_dark #console p.pf span.fg-darkRed {
|
||||
color: #f65 !important;
|
||||
}
|
||||
|
||||
.theme_dark #console p.pf span.fg-darkGreen {
|
||||
color: #091 !important;
|
||||
}
|
||||
|
||||
.theme_dark .fg-green {
|
||||
color: #3f6 !important;
|
||||
}
|
||||
|
||||
.theme_dark .fg-blue {
|
||||
color: #36f !important;
|
||||
}
|
||||
|
||||
.theme_dark #console, .theme_dark #editor, .theme_dark #renderArea, .theme_dark #macros {
|
||||
background-color: #222;
|
||||
box-shadow: none;
|
||||
border: 1px solid #999;
|
||||
}
|
||||
|
||||
.theme_dark #console > p:hover {
|
||||
background-color: #444;
|
||||
}
|
||||
|
||||
.theme_dark #console p.pf span.fg-dark {
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
.theme_dark #macros {
|
||||
background-color: #222;
|
||||
}
|
||||
|
||||
.theme_dark .table .tfoot .td, .theme_dark .table .tfoot .th, .theme_dark .table .tfoot td, .theme_dark .table .tfoot th, .theme_dark .table .thead .td, .theme_dark .table .thead .th, .theme_dark .table .thead td, .theme_dark .table .thead th, .theme_dark .table tfoot .td, .theme_dark .table tfoot .th, .theme_dark .table tfoot td, .theme_dark .table tfoot th, .theme_dark .table thead .td, .theme_dark .table thead .th, .theme_dark .table thead td, .theme_dark .table thead th {
|
||||
color: #DDD;
|
||||
}
|
||||
|
||||
.theme_dark .alt-header>.small, .theme_dark .alt-header>small, .theme_dark .h1>.small, .theme_dark .h1>small, .theme_dark .h2>.small, .theme_dark .h2>small, .theme_dark .h3>.small, .theme_dark .h3>small, .theme_dark .h4>.small, .theme_dark .h4>small, .theme_dark .h5>.small, .theme_dark .h5>small, .theme_dark .h6>.small, .theme_dark .h6>small, .theme_dark .header>.small, .theme_dark .header>small, .theme_dark .leader>.small, .theme_dark .leader>small, .theme_dark .sub-alt-header>.small, .theme_dark .sub-alt-header>small, .theme_dark .sub-header>.small, .theme_dark .sub-header>small, .theme_dark .sub-leader>.small, .theme_dark .sub-leader>small, .theme_dark h1>.small, .theme_dark h1>small, .theme_dark h2>.small, .theme_dark h2>small, .theme_dark h3>.small, .theme_dark h3>small, .theme_dark h4>.small, .theme_dark h4>small, .theme_dark h5>.small, .theme_dark h5>small, .theme_dark h6>.small, .theme_dark h6>small {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_dark .table.striped .tbody .tr:nth-child(odd), .theme_dark .table.striped tbody tr:nth-child(odd),
|
||||
.theme_dark .table.row-hover .tbody .tr:nth-child(odd):hover, .theme_dark .table.row-hover .tbody tr:nth-child(odd):hover, .theme_dark .table.row-hover tbody .tr:nth-child(odd):hover, .theme_dark .table.row-hover tbody tr:nth-child(odd):hover {
|
||||
background-color: #444;
|
||||
}
|
||||
|
||||
.theme_dark .table.row-hover .tbody .tr:hover, .theme_dark .table.row-hover .tbody tr:hover, .theme_dark .table.row-hover tbody .tr:hover, .theme_dark .table.row-hover tbody tr:hover {
|
||||
background-color: unset;
|
||||
}
|
||||
|
||||
.theme_dark .switch .check, .theme_dark .switch .check::after {
|
||||
border-color: #DDD !important;
|
||||
}
|
||||
|
||||
.theme_dark .switch .check::after {
|
||||
color: #DDD !important;
|
||||
background-color: #DDD !important;
|
||||
}
|
||||
|
||||
.theme_dark .action-button, .theme_dark .button, .theme_dark .flat-button {
|
||||
background-color: #666;
|
||||
border-color: #999;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_dark .bd-openbuilds {
|
||||
border-color: #999 !important;
|
||||
}
|
||||
|
||||
.theme_dark .button.primary, .theme_dark .command-button.primary, .theme_dark .image-button.primary, .theme_dark .info-button.primary, .theme_dark .input .button.primary, .theme_dark .notify.primary, .theme_dark .select .button.primary, .theme_dark .shortcut.primary, .theme_dark .spinner .button.primary, .theme_dark .split-button .split.primary, .theme_dark .tag-input .button.primary, .theme_dark .tally.primary, .theme_dark .toast.primary, .theme_dark .tool-button.primary, .theme_dark code.primary, .theme_dark tbody td.primary, .theme_dark tbody tr.primary {
|
||||
border-color: #36F;
|
||||
background-color: #04A;
|
||||
}
|
||||
|
||||
.theme_dark .button.secondary, .theme_dark .command-button.secondary, .theme_dark .image-button.secondary, .theme_dark .info-button.secondary, .theme_dark .input .button.secondary, .theme_dark .notify.secondary, .theme_dark .select .button.secondary, .theme_dark .shortcut.secondary, .theme_dark .spinner .button.secondary, .theme_dark .split-button .split.secondary, .theme_dark .tag-input .button.secondary, .theme_dark .tally.secondary, .theme_dark .toast.secondary, .theme_dark .tool-button.secondary, .theme_dark code.secondary, .theme_dark tbody td.secondary, .theme_dark tbody tr.secondary {
|
||||
border-color: #0F0;
|
||||
}
|
||||
|
||||
.theme_dark .button.success, .theme_dark .command-button.success, .theme_dark .image-button.success, .theme_dark .info-button.success, .theme_dark .input .button.success, .theme_dark .notify.success, .theme_dark .select .button.success, .theme_dark .shortcut.success, .theme_dark .spinner .button.success, .theme_dark .split-button .split.success, .theme_dark .tag-input .button.success, .theme_dark .tally.success, .theme_dark .toast.success, .theme_dark .tool-button.success, .theme_dark code.success, .theme_dark tbody td.success, .theme_dark tbody tr.success {
|
||||
border-color: #3f6;
|
||||
background-color: #073;
|
||||
}
|
||||
|
||||
.theme_dark .button.alert, .theme_dark .command-button.alert, .theme_dark .image-button.alert, .theme_dark .info-button.alert, .theme_dark .input .button.alert, .theme_dark .notify.alert, .theme_dark .select .button.alert, .theme_dark .shortcut.alert, .theme_dark .spinner .button.alert, .theme_dark .split-button .split.alert, .theme_dark .tag-input .button.alert, .theme_dark .tally.alert, .theme_dark .toast.alert, .theme_dark .tool-button.alert, .theme_dark code.alert, .theme_dark tbody td.alert, .theme_dark tbody tr.alert {
|
||||
border-color: #F65;
|
||||
background-color: #A43;
|
||||
}
|
||||
|
||||
.theme_dark .button.outline, .theme_dark .command-button.outline, .theme_dark .image-button.outline, .theme_dark .shortcut.outline, .theme_dark .split-button .split.outline, .theme_dark .tool-button.outline {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_dark .button.primary.outline, .theme_dark .command-button.primary.outline, .theme_dark .image-button.primary.outline, .theme_dark .info-button.primary.outline, .theme_dark .input .button.primary.outline, .theme_dark .notify.primary.outline, .theme_dark .select .button.primary.outline, .theme_dark .shortcut.primary.outline, .theme_dark .spinner .button.primary.outline, .theme_dark .split-button .split.primary.outline, .theme_dark .tag-input .button.primary.outline, .theme_dark .tally.primary.outline, .theme_dark .toast.primary.outline, .theme_dark .tool-button.primary.outline, .theme_dark code.primary.outline, .theme_dark tbody td.primary.outline, .theme_dark tbody tr.primary.outline {
|
||||
border-color: #36F;
|
||||
}
|
||||
|
||||
.theme_dark .button.secondary.outline, .theme_dark .command-button.secondary.outline, .theme_dark .image-button.secondary.outline, .theme_dark .info-button.secondary.outline, .theme_dark .input .button.secondary.outline, .theme_dark .notify.secondary.outline, .theme_dark .select .button.secondary.outline, .theme_dark .shortcut.secondary.outline, .theme_dark .spinner .button.secondary.outline, .theme_dark .split-button .split.secondary.outline, .theme_dark .tag-input .button.secondary.outline, .theme_dark .tally.secondary.outline, .theme_dark .toast.secondary.outline, .theme_dark .tool-button.secondary.outline, .theme_dark code.secondary.outline, .theme_dark tbody td.secondary.outline, .theme_dark tbody tr.secondary.outline {
|
||||
color: #DDD;
|
||||
}
|
||||
|
||||
.theme_dark .button.success.outline, .theme_dark .command-button.success.outline, .theme_dark .image-button.success.outline, .theme_dark .info-button.success.outline, .theme_dark .input .button.success.outline, .theme_dark .notify.success.outline, .theme_dark .select .button.success.outline, .theme_dark .shortcut.success.outline, .theme_dark .spinner .button.success.outline, .theme_dark .split-button .split.success.outline, .theme_dark .tag-input .button.success.outline, .theme_dark .tally.success.outline, .theme_dark .toast.success.outline, .theme_dark .tool-button.success.outline, .theme_dark code.success.outline, .theme_dark tbody td.success.outline, .theme_dark tbody tr.success.outline {
|
||||
border-color: #3f6;
|
||||
}
|
||||
|
||||
.theme_dark .button.alert.outline, .theme_dark .command-button.alert.outline, .theme_dark .image-button.alert.outline, .theme_dark .info-button.alert.outline, .theme_dark .input .button.alert.outline, .theme_dark .notify.alert.outline, .theme_dark .select .button.alert.outline, .theme_dark .shortcut.alert.outline, .theme_dark .spinner .button.alert.outline, .theme_dark .split-button .split.alert.outline, .theme_dark .tag-input .button.alert.outline, .theme_dark .tally.alert.outline, .theme_dark .toast.alert.outline, .theme_dark .tool-button.alert.outline, .theme_dark code.alert.outline, .theme_dark tbody td.alert.outline, .theme_dark tbody tr.alert.outline {
|
||||
border-color: #F65;
|
||||
}
|
||||
|
||||
.theme_dark .button.outline, .theme_dark .command-button.outline, .theme_dark .image-button.outline, .theme_dark .shortcut.outline, .theme_dark .split-button .split.outline, .theme_dark .tool-button.outline {
|
||||
color: #DDD;
|
||||
}
|
||||
|
||||
.theme_dark .command-button .icon, .theme_dark .image-button .icon {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_dark .ace_scroller {
|
||||
background-color: #222 !important;
|
||||
}
|
||||
|
||||
.theme_dark .ace-sqlserver .ace_gutter {
|
||||
background-color: #222 !important;
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
.theme_dark .ace-sqlserver .ace_gutter-active-line {
|
||||
background-color: #444 !important;
|
||||
}
|
||||
|
||||
.theme_dark .ace-sqlserver .ace_marker-layer .ace_active-line {
|
||||
background: #1D1D1D !important;
|
||||
}
|
||||
|
||||
.theme_dark .ace-sqlserver .ace_string { color: #FFF !important; }
|
||||
.theme_dark .ace-sqlserver .ace_comment { color: #6F6 !important; }
|
||||
.theme_dark .ace-sqlserver .ace_numeric { color: #DDD !important; }
|
||||
.theme_dark .ace-sqlserver .ace_identifier { color: #0FF !important; }
|
||||
.theme_dark .ace-sqlserver .ace_keyword { color: #0FF !important; }
|
||||
|
||||
|
|
@ -0,0 +1,251 @@
|
|||
body.theme_hicontrast, .theme_hicontrast div.window, .theme_hicontrast .card, .theme_hicontrast #splash {
|
||||
background: #000;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ribbon-menu .content-holder {
|
||||
background: #222;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ribbon-menu .tabs-holder, .theme_hicontrast .ribbon-menu .content-holder .section {
|
||||
border-color: #FFF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ribbon-menu .tabs-holder li {
|
||||
background: #222;
|
||||
color: #0FF;
|
||||
border: 1px solid #FFF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ribbon-menu .tabs-holder li:hover {
|
||||
border-color: #0FF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ribbon-menu .tabs-holder .active {
|
||||
background: #0FF;
|
||||
border-color: #FFF;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ribbon-button, .theme_hicontrast .ribbon-button-dropdown, .theme_hicontrast .ribbon-icon-button, .theme_hicontrast .ribbon-tool-button {
|
||||
background-color: #222;
|
||||
color: #FFF;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ribbon-button:hover, .theme_hicontrast .ribbon-button-dropdown:hover, .theme_hicontrast .ribbon-icon-button:hover, .theme_hicontrast .ribbon-tool-button:hover {
|
||||
border-color: #0FF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ribbon-menu .content-holder .group+.group, .theme_hicontrast .ribbon-menu .content-holder .group .title {
|
||||
border-color: #FFF;
|
||||
color: #0FF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .dialog.dark, .theme_hicontrast .dialog {
|
||||
background: #000;
|
||||
color: #FFF;
|
||||
border-color: #0FF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .dialog.dark .dialog-title, .theme_hicontrast .dialog .dialog-title {
|
||||
background: #0FF;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.theme_hicontrast .dialog-actions {
|
||||
border-color: #666;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.light, .theme_hicontrast .command-button.light, .theme_hicontrast .image-button.light, .theme_hicontrast .info-button.light, .theme_hicontrast .input .button.light, .theme_hicontrast .notify.light, .theme_hicontrast .select .button.light, .theme_hicontrast .shortcut.light, .theme_hicontrast .spinner .button.light, .theme_hicontrast .split-button .split.light, .theme_hicontrast .tag-input .button.light, .theme_hicontrast .tally.light, .theme_hicontrast .toast.light, .theme_hicontrast .tool-button.light, .theme_hicontrast code.light, .theme_hicontrast tbody td.light, .theme_hicontrast tbody tr.light,
|
||||
.theme_hicontrast .dro {
|
||||
background-color: #000;
|
||||
border-color: #0FF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.light:hover, .theme_hicontrast .command-button.light:hover, .theme_hicontrast .image-button.light:hover, .theme_hicontrast .info-button.light:hover, .theme_hicontrast .input .button.light:hover, .theme_hicontrast .notify.light:hover, .theme_hicontrast .select .button.light:hover, .theme_hicontrast .shortcut.light:hover, .theme_hicontrast .spinner .button.light:hover, .theme_hicontrast .split-button .split.light:hover, .theme_hicontrast .tag-input .button.light:hover, .theme_hicontrast .tally.light:hover, .theme_hicontrast .toast.light:hover, .theme_hicontrast .tool-button.light:hover, .theme_hicontrast code.light:hover, .theme_hicontrast tbody td.light:hover, .theme_hicontrast tbody tr.light:hover {
|
||||
background-color: #099;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.disabled, .theme_hicontrast .button:disabled, .theme_hicontrast .command-button.disabled, .theme_hicontrast .command-button:disabled, .theme_hicontrast .image-button.disabled, .theme_hicontrast .image-button:disabled, .theme_hicontrast .shortcut.disabled, .theme_hicontrast .shortcut:disabled, .theme_hicontrast .split-button .split.disabled, .theme_hicontrast .split-button .split:disabled, .theme_hicontrast .tool-button.disabled, .theme_hicontrast .tool-button:disabled {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.theme_hicontrast .file, .theme_hicontrast .input, .theme_hicontrast .select, .theme_hicontrast .spinner, .theme_hicontrast .tag-input, .theme_hicontrast .textarea, .theme_hicontrast input[type=datetime-local], .theme_hicontrast input[type=email], .theme_hicontrast input[type=file], .theme_hicontrast input[type=month], .theme_hicontrast input[type=number], .theme_hicontrast input[type=password], .theme_hicontrast input[type=search], .theme_hicontrast input[type=tel], .theme_hicontrast input[type=text], .theme_hicontrast input[type=time], .theme_hicontrast input[type=url], .theme_hicontrast input[type=week], .theme_hicontrast select, .theme_hicontrast textarea {
|
||||
background-color: #000;
|
||||
color: #FFF;
|
||||
border-color: #0FF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .file.disabled .caption, .theme_hicontrast .file.disabled .select-input, .theme_hicontrast .file.disabled .stars li, .theme_hicontrast .file.disabled input, .theme_hicontrast .file.disabled select, .theme_hicontrast .file.disabled textarea, .theme_hicontrast .file:disabled .caption, .theme_hicontrast .file:disabled .select-input, .theme_hicontrast .file:disabled .stars li, .theme_hicontrast .file:disabled input, .theme_hicontrast .file:disabled select, .theme_hicontrast .file:disabled textarea, .theme_hicontrast .input.disabled .caption, .theme_hicontrast .input.disabled .select-input, .theme_hicontrast .input.disabled .stars li, .theme_hicontrast .input.disabled input, .theme_hicontrast .input.disabled select, .theme_hicontrast .input.disabled textarea, .theme_hicontrast .input:disabled .caption, .theme_hicontrast .input:disabled .select-input, .theme_hicontrast .input:disabled .stars li, .theme_hicontrast .input:disabled input, .theme_hicontrast .input:disabled select, .theme_hicontrast .input:disabled textarea, .theme_hicontrast .rating.disabled .caption, .theme_hicontrast .rating.disabled .select-input, .theme_hicontrast .rating.disabled .stars li, .theme_hicontrast .rating.disabled input, .theme_hicontrast .rating.disabled select, .theme_hicontrast .rating.disabled textarea, .theme_hicontrast .rating:disabled .caption, .theme_hicontrast .rating:disabled .select-input, .theme_hicontrast .rating:disabled .stars li, .theme_hicontrast .rating:disabled input, .theme_hicontrast .rating:disabled select, .theme_hicontrast .rating:disabled textarea, .theme_hicontrast .select.disabled .caption, .theme_hicontrast .select.disabled .select-input, .theme_hicontrast .select.disabled .stars li, .theme_hicontrast .select.disabled input, .theme_hicontrast .select.disabled select, .theme_hicontrast .select.disabled textarea, .theme_hicontrast .select:disabled .caption, .theme_hicontrast .select:disabled .select-input, .theme_hicontrast .select:disabled .stars li, .theme_hicontrast .select:disabled input, .theme_hicontrast .select:disabled select, .theme_hicontrast .select:disabled textarea, .theme_hicontrast .spinner.disabled .caption, .theme_hicontrast .spinner.disabled .select-input, .theme_hicontrast .spinner.disabled .stars li, .theme_hicontrast .spinner.disabled input, .theme_hicontrast .spinner.disabled select, .theme_hicontrast .spinner.disabled textarea, .theme_hicontrast .spinner:disabled .caption, .theme_hicontrast .spinner:disabled .select-input, .theme_hicontrast .spinner:disabled .stars li, .theme_hicontrast .spinner:disabled input, .theme_hicontrast .spinner:disabled select, .theme_hicontrast .spinner:disabled textarea, .theme_hicontrast .tag-input.disabled .caption, .theme_hicontrast .tag-input.disabled .select-input, .theme_hicontrast .tag-input.disabled .stars li, .theme_hicontrast .tag-input.disabled input, .theme_hicontrast .tag-input.disabled select, .theme_hicontrast .tag-input.disabled textarea, .theme_hicontrast .tag-input:disabled .caption, .theme_hicontrast .tag-input:disabled .select-input, .theme_hicontrast .tag-input:disabled .stars li, .theme_hicontrast .tag-input:disabled input, .theme_hicontrast .tag-input:disabled select, .theme_hicontrast .tag-input:disabled textarea, .theme_hicontrast .textarea.disabled .caption, .theme_hicontrast .textarea.disabled .select-input, .theme_hicontrast .textarea.disabled .stars li, .theme_hicontrast .textarea.disabled input, .theme_hicontrast .textarea.disabled select, .theme_hicontrast .textarea.disabled textarea, .theme_hicontrast .textarea:disabled .caption, .theme_hicontrast .textarea:disabled .select-input, .theme_hicontrast .textarea:disabled .stars li, .theme_hicontrast .textarea:disabled input, .theme_hicontrast .textarea:disabled select, .theme_hicontrast .textarea:disabled textarea {
|
||||
background-color: #000;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.theme_hicontrast .file.disabled, .theme_hicontrast .file:disabled, .theme_hicontrast .input.disabled, .theme_hicontrast .input:disabled, .theme_hicontrast .select.disabled, .theme_hicontrast .select:disabled, .theme_hicontrast .spinner.disabled, .theme_hicontrast .spinner:disabled, .theme_hicontrast .tag-input.disabled, .theme_hicontrast .tag-input:disabled, .theme_hicontrast .textarea.disabled, .theme_hicontrast .textarea:disabled, .theme_hicontrast input[type=datetime-local].disabled, .theme_hicontrast input[type=datetime-local]:disabled, .theme_hicontrast input[type=email].disabled, .theme_hicontrast input[type=email]:disabled, .theme_hicontrast input[type=file].disabled, .theme_hicontrast input[type=file]:disabled, .theme_hicontrast input[type=month].disabled, .theme_hicontrast input[type=month]:disabled, .theme_hicontrast input[type=number].disabled, .theme_hicontrast input[type=number]:disabled, .theme_hicontrast input[type=password].disabled, .theme_hicontrast input[type=password]:disabled, .theme_hicontrast input[type=search].disabled, .theme_hicontrast input[type=search]:disabled, .theme_hicontrast input[type=tel].disabled, .theme_hicontrast input[type=tel]:disabled, .theme_hicontrast input[type=text].disabled, .theme_hicontrast input[type=text]:disabled, .theme_hicontrast input[type=time].disabled, .theme_hicontrast input[type=time]:disabled, .theme_hicontrast input[type=url].disabled, .theme_hicontrast input[type=url]:disabled, .theme_hicontrast input[type=week].disabled, .theme_hicontrast input[type=week]:disabled, .theme_hicontrast select.disabled, .theme_hicontrast select:disabled, .theme_hicontrast textarea.disabled, .theme_hicontrast textarea:disabled {
|
||||
background: #000;
|
||||
}
|
||||
|
||||
.theme_hicontrast .input .prepend, .theme_hicontrast .select .prepend, .theme_hicontrast .input .append {
|
||||
background: #99999922;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .d-menu, .theme_hicontrast .v-menu, .theme_hicontrast .ribbon-dropdown {
|
||||
background: #000;
|
||||
color: #FFF;
|
||||
border: 1px solid #999;
|
||||
}
|
||||
|
||||
.theme_hicontrast #command {
|
||||
font-family: consolas;
|
||||
}
|
||||
|
||||
.theme_hicontrast .bg-openbuilds {
|
||||
background-color: #666 !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast .fg-openbuilds {
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast .fg-red, .theme_hicontrast #console p.pf span.fg-darkRed {
|
||||
color: #F60 !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast #console p.pf span.fg-darkGreen {
|
||||
color: #0FF !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast .fg-green {
|
||||
color: #0F0 !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast .fg-blue {
|
||||
color: #0FF !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast #console, .theme_hicontrast #editor, .theme_hicontrast #renderArea, .theme_hicontrast #macros {
|
||||
background-color: #000;
|
||||
box-shadow: none;
|
||||
border: 1px solid #999;
|
||||
}
|
||||
|
||||
.theme_hicontrast #console > p:hover {
|
||||
background-color: #444;
|
||||
}
|
||||
|
||||
.theme_hicontrast #console p.pf span.fg-dark {
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast #macros {
|
||||
background-color: #000;
|
||||
}
|
||||
|
||||
.theme_hicontrast .table .tfoot .td, .theme_hicontrast .table .tfoot .th, .theme_hicontrast .table .tfoot td, .theme_hicontrast .table .tfoot th, .theme_hicontrast .table .thead .td, .theme_hicontrast .table .thead .th, .theme_hicontrast .table .thead td, .theme_hicontrast .table .thead th, .theme_hicontrast .table tfoot .td, .theme_hicontrast .table tfoot .th, .theme_hicontrast .table tfoot td, .theme_hicontrast .table tfoot th, .theme_hicontrast .table thead .td, .theme_hicontrast .table thead .th, .theme_hicontrast .table thead td, .theme_hicontrast .table thead th {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .alt-header>.small, .theme_hicontrast .alt-header>small, .theme_hicontrast .h1>.small, .theme_hicontrast .h1>small, .theme_hicontrast .h2>.small, .theme_hicontrast .h2>small, .theme_hicontrast .h3>.small, .theme_hicontrast .h3>small, .theme_hicontrast .h4>.small, .theme_hicontrast .h4>small, .theme_hicontrast .h5>.small, .theme_hicontrast .h5>small, .theme_hicontrast .h6>.small, .theme_hicontrast .h6>small, .theme_hicontrast .header>.small, .theme_hicontrast .header>small, .theme_hicontrast .leader>.small, .theme_hicontrast .leader>small, .theme_hicontrast .sub-alt-header>.small, .theme_hicontrast .sub-alt-header>small, .theme_hicontrast .sub-header>.small, .theme_hicontrast .sub-header>small, .theme_hicontrast .sub-leader>.small, .theme_hicontrast .sub-leader>small, .theme_hicontrast h1>.small, .theme_hicontrast h1>small, .theme_hicontrast h2>.small, .theme_hicontrast h2>small, .theme_hicontrast h3>.small, .theme_hicontrast h3>small, .theme_hicontrast h4>.small, .theme_hicontrast h4>small, .theme_hicontrast h5>.small, .theme_hicontrast h5>small, .theme_hicontrast h6>.small, .theme_hicontrast h6>small {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .table.striped .tbody .tr:nth-child(odd), .theme_hicontrast .table.striped tbody tr:nth-child(odd),
|
||||
.theme_hicontrast .table.row-hover .tbody .tr:nth-child(odd):hover, .theme_hicontrast .table.row-hover .tbody tr:nth-child(odd):hover, .theme_hicontrast .table.row-hover tbody .tr:nth-child(odd):hover, .theme_hicontrast .table.row-hover tbody tr:nth-child(odd):hover {
|
||||
background-color: #000;
|
||||
border-top: 1px dashed #999;
|
||||
border-bottom: 1px dashed #999;
|
||||
}
|
||||
|
||||
.theme_hicontrast .table.row-hover .tbody .tr:hover, .theme_hicontrast .table.row-hover .tbody tr:hover, .theme_hicontrast .table.row-hover tbody .tr:hover, .theme_hicontrast .table.row-hover tbody tr:hover {
|
||||
background-color: unset;
|
||||
}
|
||||
|
||||
.theme_hicontrast .table.row-border .tr+.tr, .theme_hicontrast .table.row-border tr+tr {
|
||||
border-top: 1px dashed #999;
|
||||
border-bottom: 1px dashed #999;
|
||||
}
|
||||
|
||||
.theme_hicontrast .switch .check, .theme_hicontrast .switch .check::after {
|
||||
border-color: #0FF !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast .switch .check::after {
|
||||
color: #0FF !important;
|
||||
background-color: #0FF !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast .action-button, .theme_hicontrast .button, .theme_hicontrast .flat-button {
|
||||
background-color: #000;
|
||||
border-color: #0FF;
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .bd-openbuilds {
|
||||
border-color: #FFF !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.primary, .theme_hicontrast .command-button.primary, .theme_hicontrast .image-button.primary, .theme_hicontrast .info-button.primary, .theme_hicontrast .input .button.primary, .theme_hicontrast .notify.primary, .theme_hicontrast .select .button.primary, .theme_hicontrast .shortcut.primary, .theme_hicontrast .spinner .button.primary, .theme_hicontrast .split-button .split.primary, .theme_hicontrast .tag-input .button.primary, .theme_hicontrast .tally.primary, .theme_hicontrast .toast.primary, .theme_hicontrast .tool-button.primary, .theme_hicontrast code.primary, .theme_hicontrast tbody td.primary, .theme_hicontrast tbody tr.primary {
|
||||
border-color: #09F;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.secondary, .theme_hicontrast .command-button.secondary, .theme_hicontrast .image-button.secondary, .theme_hicontrast .info-button.secondary, .theme_hicontrast .input .button.secondary, .theme_hicontrast .notify.secondary, .theme_hicontrast .select .button.secondary, .theme_hicontrast .shortcut.secondary, .theme_hicontrast .spinner .button.secondary, .theme_hicontrast .split-button .split.secondary, .theme_hicontrast .tag-input .button.secondary, .theme_hicontrast .tally.secondary, .theme_hicontrast .toast.secondary, .theme_hicontrast .tool-button.secondary, .theme_hicontrast code.secondary, .theme_hicontrast tbody td.secondary, .theme_hicontrast tbody tr.secondary {
|
||||
border-color: #0F0;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.success, .theme_hicontrast .command-button.success, .theme_hicontrast .image-button.success, .theme_hicontrast .info-button.success, .theme_hicontrast .input .button.success, .theme_hicontrast .notify.success, .theme_hicontrast .select .button.success, .theme_hicontrast .shortcut.success, .theme_hicontrast .spinner .button.success, .theme_hicontrast .split-button .split.success, .theme_hicontrast .tag-input .button.success, .theme_hicontrast .tally.success, .theme_hicontrast .toast.success, .theme_hicontrast .tool-button.success, .theme_hicontrast code.success, .theme_hicontrast tbody td.success, .theme_hicontrast tbody tr.success {
|
||||
border-color: #0F0;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.alert, .theme_hicontrast .command-button.alert, .theme_hicontrast .image-button.alert, .theme_hicontrast .info-button.alert, .theme_hicontrast .input .button.alert, .theme_hicontrast .notify.alert, .theme_hicontrast .select .button.alert, .theme_hicontrast .shortcut.alert, .theme_hicontrast .spinner .button.alert, .theme_hicontrast .split-button .split.alert, .theme_hicontrast .tag-input .button.alert, .theme_hicontrast .tally.alert, .theme_hicontrast .toast.alert, .theme_hicontrast .tool-button.alert, .theme_hicontrast code.alert, .theme_hicontrast tbody td.alert, .theme_hicontrast tbody tr.alert {
|
||||
border-color: #F60;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.outline, .theme_hicontrast .command-button.outline, .theme_hicontrast .image-button.outline, .theme_hicontrast .shortcut.outline, .theme_hicontrast .split-button .split.outline, .theme_hicontrast .tool-button.outline {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.primary.outline, .theme_hicontrast .command-button.primary.outline, .theme_hicontrast .image-button.primary.outline, .theme_hicontrast .info-button.primary.outline, .theme_hicontrast .input .button.primary.outline, .theme_hicontrast .notify.primary.outline, .theme_hicontrast .select .button.primary.outline, .theme_hicontrast .shortcut.primary.outline, .theme_hicontrast .spinner .button.primary.outline, .theme_hicontrast .split-button .split.primary.outline, .theme_hicontrast .tag-input .button.primary.outline, .theme_hicontrast .tally.primary.outline, .theme_hicontrast .toast.primary.outline, .theme_hicontrast .tool-button.primary.outline, .theme_hicontrast code.primary.outline, .theme_hicontrast tbody td.primary.outline, .theme_hicontrast tbody tr.primary.outline {
|
||||
border-color: #09F;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.secondary.outline, .theme_hicontrast .command-button.secondary.outline, .theme_hicontrast .image-button.secondary.outline, .theme_hicontrast .info-button.secondary.outline, .theme_hicontrast .input .button.secondary.outline, .theme_hicontrast .notify.secondary.outline, .theme_hicontrast .select .button.secondary.outline, .theme_hicontrast .shortcut.secondary.outline, .theme_hicontrast .spinner .button.secondary.outline, .theme_hicontrast .split-button .split.secondary.outline, .theme_hicontrast .tag-input .button.secondary.outline, .theme_hicontrast .tally.secondary.outline, .theme_hicontrast .toast.secondary.outline, .theme_hicontrast .tool-button.secondary.outline, .theme_hicontrast code.secondary.outline, .theme_hicontrast tbody td.secondary.outline, .theme_hicontrast tbody tr.secondary.outline {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.success.outline, .theme_hicontrast .command-button.success.outline, .theme_hicontrast .image-button.success.outline, .theme_hicontrast .info-button.success.outline, .theme_hicontrast .input .button.success.outline, .theme_hicontrast .notify.success.outline, .theme_hicontrast .select .button.success.outline, .theme_hicontrast .shortcut.success.outline, .theme_hicontrast .spinner .button.success.outline, .theme_hicontrast .split-button .split.success.outline, .theme_hicontrast .tag-input .button.success.outline, .theme_hicontrast .tally.success.outline, .theme_hicontrast .toast.success.outline, .theme_hicontrast .tool-button.success.outline, .theme_hicontrast code.success.outline, .theme_hicontrast tbody td.success.outline, .theme_hicontrast tbody tr.success.outline {
|
||||
border-color: #0F0;
|
||||
}
|
||||
|
||||
.theme_hicontrast .button.alert.outline, .theme_hicontrast .command-button.alert.outline, .theme_hicontrast .image-button.alert.outline, .theme_hicontrast .info-button.alert.outline, .theme_hicontrast .input .button.alert.outline, .theme_hicontrast .notify.alert.outline, .theme_hicontrast .select .button.alert.outline, .theme_hicontrast .shortcut.alert.outline, .theme_hicontrast .spinner .button.alert.outline, .theme_hicontrast .split-button .split.alert.outline, .theme_hicontrast .tag-input .button.alert.outline, .theme_hicontrast .tally.alert.outline, .theme_hicontrast .toast.alert.outline, .theme_hicontrast .tool-button.alert.outline, .theme_hicontrast code.alert.outline, .theme_hicontrast tbody td.alert.outline, .theme_hicontrast tbody tr.alert.outline {
|
||||
border-color: #F60;
|
||||
}
|
||||
|
||||
.theme_hicontrast .command-button .icon, .theme_hicontrast .image-button .icon {
|
||||
color: #FFF;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ace_scroller {
|
||||
background-color: #000 !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ace-sqlserver .ace_gutter {
|
||||
background-color: #000 !important;
|
||||
color: #FFF !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ace-sqlserver .ace_gutter-active-line {
|
||||
background-color: #444 !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ace-sqlserver .ace_marker-layer .ace_active-line {
|
||||
background: #1D1D1D !important;
|
||||
}
|
||||
|
||||
.theme_hicontrast .ace-sqlserver .ace_string { color: #FFF !important; }
|
||||
.theme_hicontrast .ace-sqlserver .ace_comment { color: #0F0 !important; }
|
||||
.theme_hicontrast .ace-sqlserver .ace_numeric { color: #FFF !important; }
|
||||
.theme_hicontrast .ace-sqlserver .ace_identifier { color: #0FF !important; }
|
||||
.theme_hicontrast .ace-sqlserver .ace_keyword { color: #0FF !important; }
|
||||
|
||||
|
|
@ -432,6 +432,18 @@
|
|||
<li onclick="disableSerialLog =! disableSerialLog; saveDiagnostics(); location.reload();" id="disableSerialLogTick"><a href="#"><i class="fas fa-fw fa-terminal"></i> Disable Serial Log</a></li>
|
||||
<li onclick="disableDROupdates = !disableDROupdates; saveDiagnostics(); location.reload();" id="disableDROupdatesTick"><a href="#"><i class="fas fa-fw fa-list-ol"></i> Disable DRO/Status Updates</a></li>
|
||||
</div>
|
||||
<div id="ddThemeButton" style="display: none">
|
||||
<button id="btnTheme" class="ribbon-button dropdown-toggle">
|
||||
<span class="icon">
|
||||
<span class="fa-layers fa-fw">
|
||||
<i class="fas fa-paint-brush"></i>
|
||||
</span>
|
||||
</span>
|
||||
<span class="caption">UI Theme</span>
|
||||
</button>
|
||||
<ul class="ribbon-dropdown grblmode" data-role="dropdown" data-duration="100" id="ddTheme">
|
||||
</ul>
|
||||
</div>
|
||||
<span class="title">Settings</span>
|
||||
</div>
|
||||
<div class="group" style="width: 100px;">
|
||||
|
|
@ -1756,6 +1768,7 @@
|
|||
<script type="text/javascript" src="js/viewer.js"></script>
|
||||
<script type="text/javascript" src="js/viewer-ruler.js"></script>
|
||||
|
||||
<script type="text/javascript" src="js/theme.js"></script>
|
||||
<script type="text/javascript" src="js/main.js"></script>
|
||||
<script type="text/javascript" src="js/updates.js"></script>
|
||||
<script type="text/javascript" src="js/ui.js"></script>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,151 @@
|
|||
let ThemeData = {
|
||||
THEMES: {
|
||||
"light": {
|
||||
DESCRIPTION: 'Light Theme (Default)',
|
||||
ICON: 'lightbulb',
|
||||
SPRITE_OPACITY: 0.6,
|
||||
SKY_TOP_COLOR: 0x0077ff,
|
||||
SKY_BOTTOM_COLOR: 0xffffff,
|
||||
HEMI_LIGHT_COLOR: { 'H': 0.6, 'S': 1.0, 'L': 0.6 },
|
||||
GRID_STEP_10_COLOR: 0x888888,
|
||||
GRID_STEP_10_OPACITY: 0.15,
|
||||
GRID_STEP_100_COLOR: 0x666666,
|
||||
GRID_STEP_100_OPACITY: 0.15,
|
||||
RULER_COLOR: 0x888888,
|
||||
RULER_OPACITY: 0.15,
|
||||
X_RULER_NUMBER_COLOR: "#cc0000",
|
||||
X_RULER_LABEL_COLOR: "#ff0000",
|
||||
X_AXIS_LINE_COLOR: 0xcc0000,
|
||||
Y_RULER_NUMBER_COLOR: "#006600",
|
||||
Y_RULER_LABEL_COLOR: "#006600",
|
||||
Y_AXIS_LINE_COLOR: 0x00cc00,
|
||||
LINE_COLOURS: [
|
||||
{ 'R': 0, 'G': 200, 'B': 0},
|
||||
{ 'R': 200, 'G': 0, 'B': 0},
|
||||
{ 'R': 0, 'G': 0, 'B': 200},
|
||||
{ 'R': 200, 'G': 0, 'B': 200}
|
||||
]
|
||||
},
|
||||
"dark": {
|
||||
DESCRIPTION: 'Dark Theme',
|
||||
ICON: 'moon',
|
||||
SPRITE_OPACITY: 0.8,
|
||||
SKY_TOP_COLOR: 0x333333,
|
||||
SKY_BOTTOM_COLOR: 0x222222,
|
||||
HEMI_LIGHT_COLOR: { 'H': 0.6, 'S': 0.0, 'L': 0.1 },
|
||||
GRID_STEP_10_COLOR: 0xFFFFFF,
|
||||
GRID_STEP_10_OPACITY: 0.15,
|
||||
GRID_STEP_100_COLOR: 0xFFFFFF,
|
||||
GRID_STEP_100_OPACITY: 0.15,
|
||||
RULER_COLOR: 0xFFFFFF,
|
||||
RULER_OPACITY: 0.30,
|
||||
X_RULER_NUMBER_COLOR: "#ffaa00",
|
||||
X_RULER_LABEL_COLOR: "#ffaa00",
|
||||
X_AXIS_LINE_COLOR: 0xFFaa00,
|
||||
Y_RULER_NUMBER_COLOR: "#00ff00",
|
||||
Y_RULER_LABEL_COLOR: "#00ff00",
|
||||
Y_AXIS_LINE_COLOR: 0x66FF66,
|
||||
LINE_COLOURS: [
|
||||
{ 'R': 0, 'G': 255, 'B': 0},
|
||||
{ 'R': 255, 'G': 80, 'B': 0},
|
||||
{ 'R': 0, 'G': 0, 'B': 255},
|
||||
{ 'R': 255, 'G': 0, 'B': 255}
|
||||
]
|
||||
},
|
||||
"hicontrast": {
|
||||
DESCRIPTION: 'High Contrast Theme',
|
||||
ICON: 'dot-circle',
|
||||
SPRITE_OPACITY: 1.0,
|
||||
SKY_TOP_COLOR: 0x000000,
|
||||
SKY_BOTTOM_COLOR: 0x000000,
|
||||
HEMI_LIGHT_COLOR: { 'H': 0.6, 'S': 0.0, 'L': 0.0 },
|
||||
GRID_STEP_10_COLOR: 0xFFFFFF,
|
||||
GRID_STEP_10_OPACITY: 0.15,
|
||||
GRID_STEP_100_COLOR: 0xFFFFFF,
|
||||
GRID_STEP_100_OPACITY: 0.15,
|
||||
RULER_COLOR: 0xFFFFFF,
|
||||
RULER_OPACITY: 1.0,
|
||||
X_RULER_NUMBER_COLOR: "#ffff00",
|
||||
X_RULER_LABEL_COLOR: "#ffff00",
|
||||
X_AXIS_LINE_COLOR: 0xFFFF00,
|
||||
Y_RULER_NUMBER_COLOR: "#00ffff",
|
||||
Y_RULER_LABEL_COLOR: "#00ffff",
|
||||
Y_AXIS_LINE_COLOR: 0x00FFFF,
|
||||
LINE_COLOURS: [
|
||||
{ 'R': 0, 'G': 255, 'B': 0},
|
||||
{ 'R': 255, 'G': 255, 'B': 0},
|
||||
{ 'R': 0, 'G': 255, 'B': 255},
|
||||
{ 'R': 255, 'G': 0, 'B': 255}
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
currentThemeId: "light",
|
||||
|
||||
init: function init() {
|
||||
let themeId = localStorage.getItem('themeId');
|
||||
if (themeId && ThemeData.THEMES[themeId]) {
|
||||
ThemeData.currentThemeId = themeId;
|
||||
for (let key in ThemeData.THEMES) {
|
||||
$("body").removeClass('theme_' + key);
|
||||
};
|
||||
$("body").addClass('theme_' + themeId);
|
||||
} else {
|
||||
localStorage.setItem("themeId", ThemeData.currentThemeId);
|
||||
}
|
||||
|
||||
$('.theme_btn').removeClass("checked");
|
||||
$('.theme_btn_' + themeId).addClass("checked");
|
||||
},
|
||||
|
||||
getColor: function getColor(key) {
|
||||
return ThemeData.THEMES[ThemeData.currentThemeId][key];
|
||||
},
|
||||
|
||||
get: function get() {
|
||||
return ThemeData.currentThemeId;
|
||||
},
|
||||
|
||||
set: function set(themeId) {
|
||||
if (themeId && ThemeData.THEMES[themeId]) {
|
||||
localStorage.setItem("themeId", themeId);
|
||||
ThemeData.init();
|
||||
|
||||
// Update the 3D view (mostly, gcode movements will keep old colours until gcode is reloaded)
|
||||
pauseAnimation = true;
|
||||
while (scene.children.length > 0) {
|
||||
scene.remove(scene.children[0])
|
||||
}
|
||||
drawWorkspace(xmin, sizexmax, ymin, sizeymax);
|
||||
clearSceneFlag = true;
|
||||
pauseAnimation = false;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
const Theme = new Proxy(ThemeData, {
|
||||
get: function(theme, key) {
|
||||
if (key == "getColor") {
|
||||
return ThemeData.getColor;
|
||||
} else if (key == "lines") {
|
||||
return theme.getColor("LINE_COLOURS");
|
||||
} else if (key == "get") {
|
||||
return theme.get;
|
||||
} else if (key == "set") {
|
||||
return theme.set;
|
||||
}
|
||||
return theme.getColor(key);
|
||||
}
|
||||
});
|
||||
ThemeData.init();
|
||||
|
||||
$(document).ready(function() {
|
||||
for (let themeId in ThemeData.THEMES) {
|
||||
let theme = ThemeData.THEMES[themeId];
|
||||
let menuItem = $('<li><a href="#"><i class="fas fa-fw fa-' + theme.ICON + '"></i> ' + theme.DESCRIPTION + '</a></li>');
|
||||
$("#ddThemeButton").show();
|
||||
$("#ddTheme").append($(menuItem).addClass(['theme_btn','theme_btn_' + themeId]).click(() => Theme.set(themeId)));
|
||||
$('head').append('<link rel="stylesheet" type="text/css" href="css/themes/' + themeId + '.css">');
|
||||
}
|
||||
ThemeData.init();
|
||||
});
|
||||
|
|
@ -7,10 +7,10 @@ function drawRuler(xmin, xmax, ymin, ymax) {
|
|||
// console.log(xmin, xmax, ymin, ymax)
|
||||
var ruler = new THREE.Group();
|
||||
var material = new THREE.LineBasicMaterial({
|
||||
color: 0x888888
|
||||
color: Theme.RULER_COLOR
|
||||
});
|
||||
|
||||
material.opacity = 0.15;
|
||||
material.opacity = Theme.RULER_OPACITY;
|
||||
|
||||
// x axis
|
||||
for (i = xmin; i <= xmax; i++) {
|
||||
|
|
@ -94,7 +94,7 @@ function drawRuler(xmin, xmax, ymin, ymax) {
|
|||
y: spacing,
|
||||
z: 0,
|
||||
text: i + unitsval,
|
||||
color: "#cc0000",
|
||||
color: Theme.X_RULER_NUMBER_COLOR,
|
||||
size: fontsize
|
||||
});
|
||||
ruler.add(x[i]);
|
||||
|
|
@ -110,7 +110,7 @@ function drawRuler(xmin, xmax, ymin, ymax) {
|
|||
y: i,
|
||||
z: 0,
|
||||
text: i + unitsval,
|
||||
color: "#006600",
|
||||
color: Theme.Y_RULER_NUMBER_COLOR,
|
||||
size: fontsize
|
||||
});
|
||||
ruler.add(y[i]);
|
||||
|
|
@ -143,10 +143,10 @@ function drawRulerInches(xmin, xmax, ymin, ymax) {
|
|||
|
||||
var ruler = new THREE.Group();
|
||||
var material = new THREE.LineBasicMaterial({
|
||||
color: 0x888888
|
||||
color: Theme.RULER_COLOR
|
||||
});
|
||||
|
||||
material.opacity = 0.15;
|
||||
material.opacity = Theme.RULER_OPACITY;
|
||||
|
||||
// x axis
|
||||
for (i = xmin; i <= xmax; i++) {
|
||||
|
|
@ -236,7 +236,7 @@ function drawRulerInches(xmin, xmax, ymin, ymax) {
|
|||
y: spacing,
|
||||
z: 0,
|
||||
text: i + unitsval,
|
||||
color: "#cc0000",
|
||||
color: Theme.X_RULER_NUMBER_COLOR,
|
||||
size: fontsize / 2.54
|
||||
});
|
||||
ruler.add(x[i]);
|
||||
|
|
@ -250,7 +250,7 @@ function drawRulerInches(xmin, xmax, ymin, ymax) {
|
|||
y: i * 25.4,
|
||||
z: 0,
|
||||
text: i + unitsval,
|
||||
color: "#006600",
|
||||
color: Theme.Y_RULER_NUMBER_COLOR,
|
||||
size: fontsize / 2.54
|
||||
});
|
||||
ruler.add(y[i]);
|
||||
|
|
|
|||
|
|
@ -79,7 +79,7 @@ function drawWorkspace(xmin, xmax, ymin, ymax) {
|
|||
sceneLights.add(dirLight);
|
||||
|
||||
hemiLight = new THREE.HemisphereLight(0xffffff, 0xffffff, 0.6);
|
||||
hemiLight.color.setHSL(0.6, 1, 0.6);
|
||||
hemiLight.color.setHSL(Theme.HEMI_LIGHT_COLOR.H, Theme.HEMI_LIGHT_COLOR.S, Theme.HEMI_LIGHT_COLOR.L);
|
||||
hemiLight.groundColor.setHSL(0.095, 1, 0.75);
|
||||
hemiLight.position.set(0, 50, 0);
|
||||
hemiLight.visible = false;
|
||||
|
|
@ -97,10 +97,10 @@ function drawWorkspace(xmin, xmax, ymin, ymax) {
|
|||
if (!disable3Dskybox) {
|
||||
var uniforms = {
|
||||
topColor: {
|
||||
value: new THREE.Color(0x0077ff)
|
||||
value: new THREE.Color(Theme.SKY_TOP_COLOR)
|
||||
},
|
||||
bottomColor: {
|
||||
value: new THREE.Color(0xffffff)
|
||||
value: new THREE.Color(Theme.SKY_BOTTOM_COLOR)
|
||||
},
|
||||
offset: {
|
||||
value: -63
|
||||
|
|
@ -205,7 +205,7 @@ function redrawGrid(xmin, xmax, ymin, ymax, inches) {
|
|||
y: 0,
|
||||
z: 0,
|
||||
text: "X",
|
||||
color: "#ff0000",
|
||||
color: Theme.X_RULER_LABEL_COLOR,
|
||||
size: size
|
||||
});
|
||||
var ylbl = this.makeSprite(this.scene, "webgl", {
|
||||
|
|
@ -213,7 +213,7 @@ function redrawGrid(xmin, xmax, ymin, ymax, inches) {
|
|||
y: parseInt(ymax) + offset,
|
||||
z: 0,
|
||||
text: "Y",
|
||||
color: "#006600",
|
||||
color: Theme.Y_RULER_LABEL_COLOR,
|
||||
size: size
|
||||
});
|
||||
|
||||
|
|
@ -222,11 +222,11 @@ function redrawGrid(xmin, xmax, ymin, ymax, inches) {
|
|||
axesgrp.add(ylbl);
|
||||
|
||||
var materialX = new THREE.LineBasicMaterial({
|
||||
color: 0xcc0000
|
||||
color: Theme.X_AXIS_LINE_COLOR
|
||||
});
|
||||
|
||||
var materialY = new THREE.LineBasicMaterial({
|
||||
color: 0x00cc00
|
||||
color: Theme.Y_AXIS_LINE_COLOR
|
||||
});
|
||||
|
||||
var geometryX = new THREE.Geometry();
|
||||
|
|
@ -258,20 +258,20 @@ function redrawGrid(xmin, xmax, ymin, ymax, inches) {
|
|||
step10 = 2.54;
|
||||
step100 = 25.4;
|
||||
}
|
||||
helper = new THREE.GridHelper(xmin, xmax, ymin, ymax, step10, 0x888888);
|
||||
helper = new THREE.GridHelper(xmin, xmax, ymin, ymax, step10, Theme.GRID_STEP_10_COLOR);
|
||||
helper.position.y = 0;
|
||||
helper.position.x = 0;
|
||||
helper.position.z = 0;
|
||||
helper.material.opacity = 0.15;
|
||||
helper.material.opacity = Theme.GRID_STEP_10_OPACITY;
|
||||
helper.material.transparent = true;
|
||||
helper.receiveShadow = false;
|
||||
helper.name = "GridHelper10mm"
|
||||
grid.add(helper);
|
||||
helper = new THREE.GridHelper(xmin, xmax, ymin, ymax, step100, 0x666666);
|
||||
helper = new THREE.GridHelper(xmin, xmax, ymin, ymax, step100, Theme.GRID_STEP_100_COLOR);
|
||||
helper.position.y = 0;
|
||||
helper.position.x = 0;
|
||||
helper.position.z = 0;
|
||||
helper.material.opacity = 0.15;
|
||||
helper.material.opacity = Theme.GRID_STEP_100_OPACITY;
|
||||
helper.material.transparent = true;
|
||||
helper.receiveShadow = false;
|
||||
helper.name = "GridHelper50mm"
|
||||
|
|
@ -509,7 +509,7 @@ function makeSprite(scene, rendererType, vals) {
|
|||
map: texture,
|
||||
// useScreenCoordinates: false,
|
||||
transparent: true,
|
||||
opacity: 0.6
|
||||
opacity: Theme.SPRITE_OPACITY
|
||||
});
|
||||
material.transparent = true;
|
||||
//var textObject = new THREE.Sprite(material);
|
||||
|
|
|
|||
|
|
@ -35,21 +35,21 @@ function convertParsedDataToObject(jsonData) {
|
|||
positions.push(x, y, z);
|
||||
|
||||
if (parsedData.linePoints[i].g == 0) {
|
||||
colors.push(0);
|
||||
colors.push(200);
|
||||
colors.push(0);
|
||||
colors.push(Theme.lines[0].R);
|
||||
colors.push(Theme.lines[0].G);
|
||||
colors.push(Theme.lines[0].B);
|
||||
} else if (parsedData.linePoints[i].g == 1) {
|
||||
colors.push(200);
|
||||
colors.push(0);
|
||||
colors.push(0);
|
||||
colors.push(Theme.lines[1].R);
|
||||
colors.push(Theme.lines[1].G);
|
||||
colors.push(Theme.lines[1].B);
|
||||
} else if (parsedData.linePoints[i].g == 2) {
|
||||
colors.push(0);
|
||||
colors.push(0);
|
||||
colors.push(200);
|
||||
colors.push(Theme.lines[2].R);
|
||||
colors.push(Theme.lines[2].G);
|
||||
colors.push(Theme.lines[2].B);
|
||||
} else {
|
||||
colors.push(200);
|
||||
colors.push(0);
|
||||
colors.push(200);
|
||||
colors.push(Theme.lines[3].R);
|
||||
colors.push(Theme.lines[3].G);
|
||||
colors.push(Theme.lines[3].B);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
Ładowanie…
Reference in New Issue