mirror of
https://github.com/betaflight/betaflight-configurator.git
synced 2025-07-17 21:35:33 +03:00
Add switchable dark mode
This commit is contained in:
parent
dbb7769184
commit
5a5715fa7f
34 changed files with 1524 additions and 1 deletions
12
libraries/jbox/jbox-dark.css
Normal file
12
libraries/jbox/jbox-dark.css
Normal file
|
@ -0,0 +1,12 @@
|
||||||
|
.jBox-container {
|
||||||
|
background: #393b3a;
|
||||||
|
color:white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.jBox-Modal .jBox-title,
|
||||||
|
.jBox-Confirm .jBox-title {
|
||||||
|
background: #393b3a;
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
text-shadow: 0 1px 1px #fff;
|
||||||
|
color: white;
|
||||||
|
}
|
|
@ -4318,5 +4318,8 @@
|
||||||
},
|
},
|
||||||
"cliAutoComplete": {
|
"cliAutoComplete": {
|
||||||
"message": "Advanced CLI AutoComplete"
|
"message": "Advanced CLI AutoComplete"
|
||||||
|
},
|
||||||
|
"darkTheme": {
|
||||||
|
"message": "Enable dark theme"
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
108
src/css/main-dark.css
Normal file
108
src/css/main-dark.css
Normal file
|
@ -0,0 +1,108 @@
|
||||||
|
body {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #ffc549;
|
||||||
|
}
|
||||||
|
|
||||||
|
#options-window {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
#content {
|
||||||
|
background-color:#393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
#content.logopen {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
#status-bar {
|
||||||
|
background-color: #414443;
|
||||||
|
}
|
||||||
|
|
||||||
|
#status-bar div {
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
dialog {
|
||||||
|
background-color: #3a3d3c;
|
||||||
|
color:white;
|
||||||
|
border: 1px solid #ffbb2a;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* Note */
|
||||||
|
.note {
|
||||||
|
background-color: #656565;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_toolbar {
|
||||||
|
background-color: #555857;
|
||||||
|
border-top: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_toolbar .btn a {
|
||||||
|
border: 1px solid #ffbb2a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_toolbar .btn a.disabled {
|
||||||
|
border: 1px solid #ffbb2a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gui_box {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gui_warning {
|
||||||
|
background: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gui_note {
|
||||||
|
background: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grey {
|
||||||
|
background-color: #414443
|
||||||
|
}
|
||||||
|
|
||||||
|
.gui_box_titlebar {
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gui_box_bottombar {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fixed_band {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.default_btn a.disabled {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border: 1px solid #ffbb2a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.small a {
|
||||||
|
border: 1px solid #ffbb2a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cf_table td {
|
||||||
|
border-bottom: solid 1px #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.dataflash-contents_global {
|
||||||
|
border: 1px solid #ffbb2a;
|
||||||
|
}
|
||||||
|
|
||||||
|
#quad-status_wrapper {
|
||||||
|
color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
button {
|
||||||
|
border: 1px solid #ffbb2a;
|
||||||
|
}
|
18
src/css/tabs-dark/adjustments-dark.css
Normal file
18
src/css/tabs-dark/adjustments-dark.css
Normal file
|
@ -0,0 +1,18 @@
|
||||||
|
.tab-adjustments .adjustments thead td {
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-adjustments .adjustment:nth-child(odd) {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-adjustments .adjustments {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-adjustments .adjustment select {
|
||||||
|
border: 1px solid silver;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
40
src/css/tabs-dark/auxiliary-dark.css
Normal file
40
src/css/tabs-dark/auxiliary-dark.css
Normal file
|
@ -0,0 +1,40 @@
|
||||||
|
.tab-auxiliary .toolbox {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-auxiliary .mode {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-auxiliary .mode .info {
|
||||||
|
background-color: #9e9e9e;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-auxiliary .ranges {
|
||||||
|
border-bottom: 5px solid #8a8a8a;
|
||||||
|
background-color: #676767;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-auxiliary .range {
|
||||||
|
background-color: #484848;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-auxiliary .link {
|
||||||
|
background-color: #484848;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-auxiliary .range .channel {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-auxiliary .buttons a {
|
||||||
|
background-color: #333333;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-auxiliary .buttons a:hover {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
17
src/css/tabs-dark/cli-dark.css
Normal file
17
src/css/tabs-dark/cli-dark.css
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
.tab-cli p {
|
||||||
|
border: 0px dotted #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-cli .backdrop {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-cli textarea[name='commands'] {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* AutoComplete */
|
||||||
|
.cli-textcomplete-dropdown {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
123
src/css/tabs-dark/configuration-dark.css
Normal file
123
src/css/tabs-dark/configuration-dark.css
Normal file
|
@ -0,0 +1,123 @@
|
||||||
|
.tab-configuration table th {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration table td {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .groupTitle {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .mixerList {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .number input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .gps select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .disarm .checkbox {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .disarm {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.disarmdelay {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .number,
|
||||||
|
.tab-configuration .select
|
||||||
|
{
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .board_align_inputs input {
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .selectProtocol
|
||||||
|
{
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration select.batterymetertype {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .currentmetertype {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .serialRX, .spiRx, .rxMode {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .mixerPreview {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .gui_box span {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .board select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mixercontent select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mixercontent input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mixercontent .mixerletter {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mixercontent .number {
|
||||||
|
border-top: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
#mixercontent .mixercanvas {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .board_align_content,
|
||||||
|
.tab-configuration .gyro_align_content {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .escprotocol {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-configuration .gyroSyncDenom, .tab-configuration .pidProcessDenom {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
47
src/css/tabs-dark/failsafe-dark.css
Normal file
47
src/css/tabs-dark/failsafe-dark.css
Normal file
|
@ -0,0 +1,47 @@
|
||||||
|
.tab-failsafe .number input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-failsafe .number input:disabled {
|
||||||
|
background-color: #393b3a;
|
||||||
|
color: grey;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-failsafe .checkbox {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-failsafe .radioarea {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-failsafe .number {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-failsafe .gui_box span {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-failsafe .stage1 select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-failsafe .modename {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-failsafe .featuresNew tr {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-failsafe .switchMode {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
30
src/css/tabs-dark/firmware_flasher-dark.css
Normal file
30
src/css/tabs-dark/firmware_flasher-dark.css
Normal file
|
@ -0,0 +1,30 @@
|
||||||
|
.tab-firmware_flasher .info .progress {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-firmware_flasher .options select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-firmware_flasher .options .description {
|
||||||
|
color: #b9b9b9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-firmware_flasher .options .manual_baud_rate select {
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-firmware_flasher .release_info .title {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-firmware_flasher .buttons a {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn .disabled {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
25
src/css/tabs-dark/gps-dark.css
Normal file
25
src/css/tabs-dark/gps-dark.css
Normal file
|
@ -0,0 +1,25 @@
|
||||||
|
.tab-gps .GPS_info .head, .tab-gps .GPS_signal_strength .head {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-gps #loadmap .controls {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-gps #loadmap .controls a {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border: 1px #9c9c9c solid;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-gps #loadmap .controls a:hover {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-gps #loadmap .controls a:active {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
progress[value]::-webkit-progress-bar {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
36
src/css/tabs-dark/help-dark.css
Normal file
36
src/css/tabs-dark/help-dark.css
Normal file
|
@ -0,0 +1,36 @@
|
||||||
|
.tab-help .twothird {
|
||||||
|
width: calc(67% - 15px);
|
||||||
|
margin-right: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-help .gui_box {
|
||||||
|
min-height: 500px;
|
||||||
|
margin-bottom: 0px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-help ul {
|
||||||
|
margin-bottom:15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-help li {
|
||||||
|
border-top: 1px dotted silver;
|
||||||
|
padding-top: 5px;
|
||||||
|
padding-bottom: 5px;
|
||||||
|
background-image: url(../../images/arrow.svg);
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-position: 0px 8px;
|
||||||
|
background-size: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-help li span {
|
||||||
|
margin-left: 17px;
|
||||||
|
display:block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-help li span a {
|
||||||
|
color: #ffbb00;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-help .subline {
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
37
src/css/tabs-dark/landing-dark.css
Normal file
37
src/css/tabs-dark/landing-dark.css
Normal file
|
@ -0,0 +1,37 @@
|
||||||
|
.tab-landing .content_top {
|
||||||
|
height: 140px;
|
||||||
|
padding: 20px;
|
||||||
|
background-color: #0000;
|
||||||
|
background-image: url(../../images/pattern.png);
|
||||||
|
background-size: 300px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-landing .content_mid {
|
||||||
|
background-color: #3e3e3e;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* hero block */
|
||||||
|
.tab-landing .logowrapper {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-landing .logowrapper img {
|
||||||
|
background: #f3f3f357;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sponsors li a:hover {
|
||||||
|
color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-landing .content_mid .text3 .wrap2 {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background: #5f5f5f;
|
||||||
|
}
|
||||||
|
|
||||||
|
#content.log_open #changelog {
|
||||||
|
background: #404040;
|
||||||
|
}
|
||||||
|
|
||||||
|
#content.policy_open #privacy_policy {
|
||||||
|
background: #404040;
|
||||||
|
}
|
26
src/css/tabs-dark/led_strip-dark.css
Normal file
26
src/css/tabs-dark/led_strip-dark.css
Normal file
|
@ -0,0 +1,26 @@
|
||||||
|
.tab-led-strip .section {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-led-strip .mainGrid {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border: #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-led-strip .mainGrid .gPoint {
|
||||||
|
border: solid 1px #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-led-strip button {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-led-strip button:hover {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-led-strip .colorDefineSliders {
|
||||||
|
border-color: #9c9c9c;
|
||||||
|
}
|
||||||
|
|
9
src/css/tabs-dark/logging-dark.css
Normal file
9
src/css/tabs-dark/logging-dark.css
Normal file
|
@ -0,0 +1,9 @@
|
||||||
|
.tab-logging .properties dd {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-logging .speed {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
27
src/css/tabs-dark/motors-dark.css
Normal file
27
src/css/tabs-dark/motors-dark.css
Normal file
|
@ -0,0 +1,27 @@
|
||||||
|
.tab-motors .plot_control {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-motors .plot_control select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-motors .motorblock {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-motors .m-block {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-motors .m-block .meter-bar {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-motors .motor_testing .notice {
|
||||||
|
border: 2px solid #9c9c9c;
|
||||||
|
background-color: #4e4e4e;
|
||||||
|
}
|
39
src/css/tabs-dark/onboard_logging-dark.css
Normal file
39
src/css/tabs-dark/onboard_logging-dark.css
Normal file
|
@ -0,0 +1,39 @@
|
||||||
|
.tab-onboard_logging .regular-button {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-onboard_logging .regular-button.disabled {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-onboard_logging .speed {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-onboard_logging .dataflash-contents,
|
||||||
|
.tab-onboard_logging .sdcard-contents {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-onboard_logging .dataflash-used,
|
||||||
|
.tab-onboard_logging .sdcard-other {
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-onboard_logging progress::-webkit-progress-bar {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-onboard_logging .blackboxRate select,
|
||||||
|
.tab-onboard_logging .blackboxDevice select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-onboard_logging .sdcard-icon {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
98
src/css/tabs-dark/osd-dark.css
Normal file
98
src/css/tabs-dark/osd-dark.css
Normal file
|
@ -0,0 +1,98 @@
|
||||||
|
.info .progress {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .options select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .release_info .title {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .git_info {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .git_info .title {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .buttons a {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .buttons a:hover {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .buttons a.flash_font.locked {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .buttons a.flash_font.locked:hover {
|
||||||
|
cursor: default;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .buttons a.load_remote_file.locked {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .buttons a.load_remote_file.locked:hover {
|
||||||
|
cursor: default;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .display-layout input.position{
|
||||||
|
border-bottom: 1px solid #9c9c9c
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .preview .gui_box_titlebar select {
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fontpresets {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3c3c3c;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .switchable-field {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .switchable-field.mouseover {
|
||||||
|
background: #3a3a3a;
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .switchable-field input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .alarms label {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
padding-bottom: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-osd .alarms input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.timer-option {
|
||||||
|
margin-bottom: 2px;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.osdprofile-active {
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
243
src/css/tabs-dark/pid_tuning-dark.css
Normal file
243
src/css/tabs-dark/pid_tuning-dark.css
Normal file
|
@ -0,0 +1,243 @@
|
||||||
|
.tab-pid_tuning .tpa th {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border-left: 0px solid #9c9c9c;
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .throttle_limit th {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border-left: 0px solid #9c9c9c;
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .cf tr {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .cf th {
|
||||||
|
border-right: solid 1px #9c9c9c;
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .cf input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .cf select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .throttle_curve {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-image: url(../../images/paper-dark.jpg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .throttle table th {
|
||||||
|
background: #ffbb2a;
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .throttle table th:first-child {
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .throttle table td {
|
||||||
|
background: #414443;
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .throttle table th {
|
||||||
|
background: #ffbb2a;
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .throttle table td {
|
||||||
|
background: #414443;
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .throttle table tr:nth-child(odd) {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .throttle table input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .rc_curve th {
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
border-left: 0px solid #9c9c9c;
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .rate_curve {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-image: url(../../images/paper-dark.jpg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning table, .tab-pid_tuning table td {
|
||||||
|
border-bottom: 0px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .pid_titlebar th {
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
background: #ffbb2a;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning table tr td:last-child {
|
||||||
|
border-right: 0px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning table.compensation .suboption select{
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning table td {
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning table input {
|
||||||
|
border: 0px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning table select {
|
||||||
|
text-align-last: right;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .tab_container {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .tab_container td {
|
||||||
|
background-color: #535655;
|
||||||
|
border-right: 1px solid #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .tab_container td:last-child {
|
||||||
|
background-color: #535655;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .tab_container td.active {
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .tab_container td.active a {
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .single-field .head {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.fancy.header {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pid_mode {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pid_titlebar {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .number {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .number input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .gui_box span {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .bottomarea {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
border-left: 1px solid #9c9c9c;
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .profile select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .rate_profile select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .controller select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .delta select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .rates_preview {
|
||||||
|
background-image: url(../../images/paper-dark.jpg);
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .pidTuning tr {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .rc_curve .cf tr {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .rc_curve_bg {
|
||||||
|
background: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabarea {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
border-top: 0px solid #9c9c9c;
|
||||||
|
background: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .regular-button {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning .regular-button.disabled {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-pid_tuning dialog select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
27
src/css/tabs-dark/ports-dark.css
Normal file
27
src/css/tabs-dark/ports-dark.css
Normal file
|
@ -0,0 +1,27 @@
|
||||||
|
.tab-ports table td {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
border-left: 1px solid #9c9c9c;
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-ports table thead tr:first-child, .tab-ports table tr:nth-child(even) {
|
||||||
|
background-color: #4e4e4e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-ports table thead tr:first-child {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-ports select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-ports .ports select {
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-ports .ports thead td {
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
color: black;
|
||||||
|
}
|
17
src/css/tabs-dark/power-dark.css
Normal file
17
src/css/tabs-dark/power-dark.css
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
.tab-power .number input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-power .number,
|
||||||
|
.tab-power .select
|
||||||
|
{
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-power .battery-configuration select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
168
src/css/tabs-dark/receiver-dark.css
Normal file
168
src/css/tabs-dark/receiver-dark.css
Normal file
|
@ -0,0 +1,168 @@
|
||||||
|
.tab-receiver .help {
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .bars .meter-bar {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .bars .meter-bar .label {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .tunings {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .tunings .head {
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .tunings table th {
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .tunings table td {
|
||||||
|
background: #414443;
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .tunings table tr:nth-child(odd) {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .tunings table input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rssi_channel_wrapper {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rssi_channel_wrapper select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rssi_channel_wrapper .head {
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rssi_channel_wrapper select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rcmap_wrapper {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rcmap_wrapper .head {
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .hybrid_element {
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
border-left: 1px solid #9c9c9c;
|
||||||
|
border-top-left-radius: 5px;
|
||||||
|
border-bottom-left-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .hybrid_element input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .hybrid_element select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rcSmoothing-derivative-manual select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rcSmoothing-input-manual select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rcSmoothing-input-manual select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rc-smoothing-channels {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rc-smoothing-type select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rc-smoothing-channels select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rcSmoothing-input-type select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rcSmoothing-input-type select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
width: calc(100% - 8px);
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rcInterpolation select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rcInterpolation-label {
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .rcSmoothing-derivative-type select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .throttle_curve {
|
||||||
|
background-image: url(../../images/paper-dark.jpg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver select[name="rx_refresh_rate"] {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-receiver .model_preview {
|
||||||
|
background-image: url(../../images/paper-dark.jpg);
|
||||||
|
}
|
148
src/css/tabs-dark/receiver_msp-dark.css
Normal file
148
src/css/tabs-dark/receiver_msp-dark.css
Normal file
|
@ -0,0 +1,148 @@
|
||||||
|
body {
|
||||||
|
font-family: 'Segoe UI', Tahoma, sans-serif;
|
||||||
|
font-size: 12px;
|
||||||
|
color: #303030;
|
||||||
|
margin: 10px;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control-gimbals {
|
||||||
|
/* A generous padding around the window edges ensures that we continue to receive mousemove events (since
|
||||||
|
* cursor stays in the window for longer)
|
||||||
|
*/
|
||||||
|
padding: 25px;
|
||||||
|
padding-bottom: 0;
|
||||||
|
text-align: center;
|
||||||
|
display: inline-flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control-gimbal {
|
||||||
|
position: relative;
|
||||||
|
width: 120px;
|
||||||
|
height: 120px;
|
||||||
|
background-color: #393b3a;
|
||||||
|
margin-left: 1em;
|
||||||
|
margin-right: 1em;
|
||||||
|
margin-bottom: 2em;
|
||||||
|
display: inline-block;
|
||||||
|
border-radius: 5px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.crosshair {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.crosshair-vert {
|
||||||
|
width: 1px;
|
||||||
|
height: 100%;
|
||||||
|
left: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.crosshair-horz {
|
||||||
|
height: 1px;
|
||||||
|
width: 100%;
|
||||||
|
top: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gimbal-label {
|
||||||
|
display: block;
|
||||||
|
position: absolute;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gimbal-label-horz {
|
||||||
|
top: calc(100% + 0.5em);
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gimbal-label-vert {
|
||||||
|
transform: rotate(-90deg);
|
||||||
|
/*transform-origin:0% 100%;*/
|
||||||
|
top: calc(50% - 0.5em);
|
||||||
|
width: 100%;
|
||||||
|
left: calc(-50% - 1em);
|
||||||
|
}
|
||||||
|
|
||||||
|
.control-stick {
|
||||||
|
background-color: rgba(255, 50, 50, 1.0);
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin-left: -10px;
|
||||||
|
margin-top: -10px;
|
||||||
|
display: block;
|
||||||
|
border-radius: 100%;
|
||||||
|
position: absolute;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control-slider {
|
||||||
|
margin: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tooltip {
|
||||||
|
position: absolute;
|
||||||
|
left: calc(100% + 24px);
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.control-slider .slider {
|
||||||
|
margin-left: 50px;
|
||||||
|
margin-right: 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.slider-label {
|
||||||
|
position: absolute;
|
||||||
|
text-align: right;
|
||||||
|
width: 40px;
|
||||||
|
left: -65px;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
color: #000;
|
||||||
|
font-family: 'open_sanssemibold', Arial;
|
||||||
|
}
|
||||||
|
|
||||||
|
a:hover {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button-enable a {
|
||||||
|
/* Center the button */
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%);
|
||||||
|
|
||||||
|
/* common styles for content toolbar buttons */
|
||||||
|
margin-top: 0px;
|
||||||
|
margin-bottom: 0px;
|
||||||
|
margin-left: 0px;
|
||||||
|
background-color: #ffbb00;
|
||||||
|
border-radius: 3px;
|
||||||
|
border: 1px solid #4c8829;
|
||||||
|
color: #fff;
|
||||||
|
float: left;
|
||||||
|
font-family: 'open_sansbold', Arial;
|
||||||
|
font-size: 12px;
|
||||||
|
text-shadow: 0px 1px rgba(0, 0, 0, 0.25);
|
||||||
|
display: block;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: all ease 0.2s;
|
||||||
|
padding: 0px;
|
||||||
|
padding-left: 9px;
|
||||||
|
padding-right: 9px;
|
||||||
|
line-height: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.button-enable a:hover {
|
||||||
|
background-color: #6ac435;
|
||||||
|
transition: all ease 0.2s;
|
||||||
|
}
|
||||||
|
.button-enable a:active {
|
||||||
|
background-color: #4d9324;
|
||||||
|
transition: all ease 0.0s;
|
||||||
|
box-shadow: inset 0px 1px 5px rgba(0, 0, 0, 0.35);
|
||||||
|
}
|
13
src/css/tabs-dark/sensors-dark.css
Normal file
13
src/css/tabs-dark/sensors-dark.css
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
.tab-sensors .plot_control {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-sensors .plot_control select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-sensors text {
|
||||||
|
fill: white;
|
||||||
|
}
|
47
src/css/tabs-dark/servos-dark.css
Normal file
47
src/css/tabs-dark/servos-dark.css
Normal file
|
@ -0,0 +1,47 @@
|
||||||
|
.tab-servos .title {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
color: black;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-servos table th {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-servos table td {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
border-left: 1px solid #9c9c9c;
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-servos table tr:nth-child(even) {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-servos table tr:first-child {
|
||||||
|
border-left: 1px solid #9c9c9c;
|
||||||
|
border-right: 1px solid #9c9c9c;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-servos table .main {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-servos table input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-servos table select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-servos table input[type="number"] {
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-servos .direction .rate {
|
||||||
|
background-color: #3a3a3a;
|
||||||
|
color: white;
|
||||||
|
}
|
43
src/css/tabs-dark/setup-dark.css
Normal file
43
src/css/tabs-dark/setup-dark.css
Normal file
|
@ -0,0 +1,43 @@
|
||||||
|
#interactive_block {
|
||||||
|
background-color: #393b3a;
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.attitude_info {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
#interactive_block a.reset {
|
||||||
|
color: black;
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
background-color: #ffbb2a;
|
||||||
|
}
|
||||||
|
|
||||||
|
#interactive_block a.reset:hover {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
#canvas_wrapper {
|
||||||
|
background-image: url(../../images/paper-dark.jpg);
|
||||||
|
}
|
||||||
|
|
||||||
|
.gui_box grey .block {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gui_box grey .block .head {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gui_box grey .block.info {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cell_setup {
|
||||||
|
border-bottom: solid 1px #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-setup .regular-button.disabled {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
0
src/css/tabs-dark/setup_osd-dark.css
Normal file
0
src/css/tabs-dark/setup_osd-dark.css
Normal file
19
src/css/tabs-dark/transponder-dark.css
Normal file
19
src/css/tabs-dark/transponder-dark.css
Normal file
|
@ -0,0 +1,19 @@
|
||||||
|
.tab-transponder .text input {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-transponder .text .disabled {
|
||||||
|
background-color: #393b3a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-transponder .text {
|
||||||
|
border-bottom: 1px solid #9c9c9c;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-transponder .gui_box span {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tab-transponder select {
|
||||||
|
border: 1px solid #9c9c9c;
|
||||||
|
}
|
|
@ -394,6 +394,7 @@
|
||||||
width: 396px;
|
width: 396px;
|
||||||
height: 29px;
|
height: 29px;
|
||||||
border-right-width: 0px;
|
border-right-width: 0px;
|
||||||
|
background: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.tab-pid_tuning .tab_container td {
|
.tab-pid_tuning .tab_container td {
|
||||||
|
|
BIN
src/images/paper-dark.jpg
Normal file
BIN
src/images/paper-dark.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 433 KiB |
57
src/js/DarkTheme.js
Normal file
57
src/js/DarkTheme.js
Normal file
|
@ -0,0 +1,57 @@
|
||||||
|
'use strict';
|
||||||
|
|
||||||
|
var css_dark = [
|
||||||
|
'./css/main-dark.css',
|
||||||
|
'./css/tabs-dark/landing-dark.css',
|
||||||
|
'./css/tabs-dark/setup-dark.css',
|
||||||
|
'./css/tabs-dark/setup_osd-dark.css',
|
||||||
|
'./css/tabs-dark/help-dark.css',
|
||||||
|
'./css/tabs-dark/ports-dark.css',
|
||||||
|
'./css/tabs-dark/configuration-dark.css',
|
||||||
|
'./css/tabs-dark/pid_tuning-dark.css',
|
||||||
|
'./css/tabs-dark/receiver-dark.css',
|
||||||
|
'./css/tabs-dark/servos-dark.css',
|
||||||
|
'./css/tabs-dark/gps-dark.css',
|
||||||
|
'./css/tabs-dark/motors-dark.css',
|
||||||
|
'./css/tabs-dark/led_strip-dark.css',
|
||||||
|
'./css/tabs-dark/sensors-dark.css',
|
||||||
|
'./css/tabs-dark/cli-dark.css',
|
||||||
|
'./css/tabs-dark/logging-dark.css',
|
||||||
|
'./css/tabs-dark/onboard_logging-dark.css',
|
||||||
|
'./css/tabs-dark/firmware_flasher-dark.css',
|
||||||
|
'./css/tabs-dark/adjustments-dark.css',
|
||||||
|
'./css/tabs-dark/auxiliary-dark.css',
|
||||||
|
'./css/tabs-dark/failsafe-dark.css',
|
||||||
|
'./css/tabs-dark/osd-dark.css',
|
||||||
|
'./css/tabs-dark/power-dark.css',
|
||||||
|
'./css/tabs-dark/transponder-dark.css',
|
||||||
|
'./js/libraries/jbox/jBox-dark.css',
|
||||||
|
]
|
||||||
|
|
||||||
|
var DarkTheme = {
|
||||||
|
configEnabled: false,
|
||||||
|
};
|
||||||
|
|
||||||
|
DarkTheme.setConfig = function(result) {
|
||||||
|
if (this.configEnabled != result) {
|
||||||
|
this.configEnabled = result;
|
||||||
|
|
||||||
|
if (this.configEnabled) {
|
||||||
|
this.applyDark();
|
||||||
|
} else {
|
||||||
|
this.applyNormal();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
DarkTheme.applyDark = function() {
|
||||||
|
for (var i = 0; i < css_dark.length; i++) {
|
||||||
|
$('link[href="' + css_dark[i] + '"]').prop('disabled', false);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
DarkTheme.applyNormal = function() {
|
||||||
|
for (var i = 0; i < css_dark.length; i++) {
|
||||||
|
$('link[href="' + css_dark[i] + '"]').prop('disabled', true);
|
||||||
|
}
|
||||||
|
};
|
|
@ -379,6 +379,15 @@ function startProcess() {
|
||||||
CliAutoComplete.setEnabled(checked);
|
CliAutoComplete.setEnabled(checked);
|
||||||
}).change();
|
}).change();
|
||||||
|
|
||||||
|
$('div.darkTheme input')
|
||||||
|
.prop('checked', DarkTheme.configEnabled)
|
||||||
|
.change(function () {
|
||||||
|
var checked = $(this).is(':checked');
|
||||||
|
|
||||||
|
chrome.storage.local.set({'darkTheme': checked});
|
||||||
|
DarkTheme.setConfig(checked);
|
||||||
|
}).change();
|
||||||
|
|
||||||
chrome.storage.local.get('userLanguageSelect', function (result) {
|
chrome.storage.local.get('userLanguageSelect', function (result) {
|
||||||
|
|
||||||
var userLanguage_e = $('div.userLanguage select');
|
var userLanguage_e = $('div.userLanguage select');
|
||||||
|
@ -543,6 +552,10 @@ function startProcess() {
|
||||||
chrome.storage.local.get('cliAutoComplete', function (result) {
|
chrome.storage.local.get('cliAutoComplete', function (result) {
|
||||||
CliAutoComplete.setEnabled(typeof result.cliAutoComplete == 'undefined' || result.cliAutoComplete); // On by default
|
CliAutoComplete.setEnabled(typeof result.cliAutoComplete == 'undefined' || result.cliAutoComplete); // On by default
|
||||||
});
|
});
|
||||||
|
|
||||||
|
chrome.storage.local.get('darkTheme', function (result) {
|
||||||
|
DarkTheme.setConfig(result.darkTheme);
|
||||||
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
function checkForConfiguratorUpdates() {
|
function checkForConfiguratorUpdates() {
|
||||||
|
|
|
@ -35,6 +35,34 @@
|
||||||
<link type="text/css" rel="stylesheet" href="./css/dropdown-lists/css/style_lists.css" media="all"/>
|
<link type="text/css" rel="stylesheet" href="./css/dropdown-lists/css/style_lists.css" media="all"/>
|
||||||
<link type="text/css" rel="stylesheet" href="./js/libraries/switchery/switchery.css" media="all"/>
|
<link type="text/css" rel="stylesheet" href="./js/libraries/switchery/switchery.css" media="all"/>
|
||||||
<link rel="stylesheet" type="text/css" href="./js/libraries/jbox/jBox.css"/>
|
<link rel="stylesheet" type="text/css" href="./js/libraries/jbox/jBox.css"/>
|
||||||
|
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/main-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/landing-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/setup-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/setup_osd-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/help-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/ports-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/configuration-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/pid_tuning-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/receiver-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/servos-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/gps-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/motors-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/led_strip-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/sensors-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/cli-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/logging-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/onboard_logging-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/firmware_flasher-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/adjustments-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/auxiliary-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/failsafe-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/osd-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/power-dark.css" media="all" disabled/>
|
||||||
|
<link type="text/css" rel="stylesheet" href="./css/tabs-dark/transponder-dark.css" media="all" disabled/>
|
||||||
|
<link rel="stylesheet" type="text/css" href="./js/libraries/jbox/jBox-dark.css" disabled/>
|
||||||
|
|
||||||
|
|
||||||
<script type="text/javascript" src="./node_modules/lru_map/lru.js"></script>
|
<script type="text/javascript" src="./node_modules/lru_map/lru.js"></script>
|
||||||
<script type="text/javascript" src="./node_modules/i18next/i18next.min.js"></script>
|
<script type="text/javascript" src="./node_modules/i18next/i18next.min.js"></script>
|
||||||
<script type="text/javascript" src="./node_modules/i18next-xhr-backend/i18nextXHRBackend.min.js"></script>
|
<script type="text/javascript" src="./node_modules/i18next-xhr-backend/i18nextXHRBackend.min.js"></script>
|
||||||
|
@ -112,6 +140,7 @@
|
||||||
<script type="text/javascript" src="./js/tabs/transponder.js"></script>
|
<script type="text/javascript" src="./js/tabs/transponder.js"></script>
|
||||||
<script type="text/javascript" src="./node_modules/jquery-textcomplete/dist/jquery.textcomplete.min.js"></script>
|
<script type="text/javascript" src="./node_modules/jquery-textcomplete/dist/jquery.textcomplete.min.js"></script>
|
||||||
<script type="text/javascript" src="./js/CliAutoComplete.js"></script>
|
<script type="text/javascript" src="./js/CliAutoComplete.js"></script>
|
||||||
|
<script type="text/javascript" src="./js/DarkTheme.js"></script>
|
||||||
<title i18n="windowTitle"></title>
|
<title i18n="windowTitle"></title>
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
|
|
|
@ -13,6 +13,9 @@
|
||||||
<div class="cliAutoComplete">
|
<div class="cliAutoComplete">
|
||||||
<label><input type="checkbox" /><span i18n="cliAutoComplete"></span></label>
|
<label><input type="checkbox" /><span i18n="cliAutoComplete"></span></label>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="darkTheme">
|
||||||
|
<label><input type="checkbox" /><span i18n="darkTheme"></span></label>
|
||||||
|
</div>
|
||||||
<div class="separator"></div>
|
<div class="separator"></div>
|
||||||
<div class="userLanguage">
|
<div class="userLanguage">
|
||||||
<label>
|
<label>
|
||||||
|
|
|
@ -47,7 +47,7 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="tab_container" style="background-color: #fff;">
|
<div class="tab_container">
|
||||||
<table>
|
<table>
|
||||||
<tr>
|
<tr>
|
||||||
<td class="pid active">
|
<td class="pid active">
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue