tweaks to dark theme

src/css/tabs-dark/adjustments-dark.css

@@ -15,4 +15,8 @@
     border: 1px solid silver; 
     background-color: #3a3a3a;
     color: white;
-}
+}
+
+.tab-adjustments .noUi-background {
+    background-color: #858585;
+}

src/css/tabs-dark/cli-dark.css

@@ -6,12 +6,18 @@
     border: 1px solid #9c9c9c;
 }
 
+.tab-cli textarea[name='commands']::placeholder {
+    color: silver;
+}
+
 .tab-cli textarea[name='commands'] {
     border: 1px solid #9c9c9c;
+    background: black;
+    color: white;
 }
 
 /* AutoComplete */
 .cli-textcomplete-dropdown {
     border: 1px solid #9c9c9c;
     background-color: #393b3a;
-}
+}

src/css/tabs-dark/firmware_flasher-dark.css

@@ -21,6 +21,10 @@
     border-bottom: 1px solid #9c9c9c;
 }
 
+.tab-firmware_flasher .release_info .target {
+    color: #98ddff;
+}
+
 .tab-firmware_flasher .buttons a {
     border: 1px solid #9c9c9c;
 }

src/css/tabs-dark/motors-dark.css

@@ -16,6 +16,10 @@
     background-color: #393b3a;
 }
 
+.tab-motors .m-block .label {
+    color: white;
+}
+
 .tab-motors .m-block .meter-bar {
     background-color: #393b3a;
     border: 1px solid #9c9c9c;
@@ -24,4 +28,4 @@
 .tab-motors .motor_testing .notice {
     border: 2px solid #9c9c9c;
     background-color: #4e4e4e;
-}
+}

src/css/tabs-dark/pid_tuning-dark.css

@@ -155,6 +155,19 @@
   border-bottom: 1px solid #9c9c9c;
 }
 
+.pid_roll {
+    background-color: #A00000;
+}
+
+.pid_pitch {
+    background-color: #00A000;
+}
+
+.pid_yaw {
+    background-color: #0000A0;
+}
+
+
 .pid_mode {
     background-color: #393b3a;
     border-bottom: 1px solid #9c9c9c;

src/css/tabs/pid_tuning.css

@@ -528,6 +528,19 @@
     height: 20px;
 }
 
+.pid_roll {
+    background-color: #FF8080;
+}
+
+.pid_pitch {
+    background-color: #80FF80;
+}
+
+.pid_yaw {
+    background-color: #8080FF;
+}
+
+
 .pid_titlebar td:first-child {
     text-align: left;
 }

src/js/gui.js

@@ -252,11 +252,19 @@ GUI_control.prototype.tab_switch_cleanup = function (callback) {
 
 GUI_control.prototype.switchery = function() {
     $('.togglesmall').each(function(index, elem) {
-        var switchery = new Switchery(elem, {
+        if(DarkTheme.configEnabled) {
-          size: 'small',
+            var switchery = new Switchery(elem, {
-          color: '#ffbb00',
+              size: 'small',
-          secondaryColor: '#c4c4c4'
+              color: '#ffbb00',
-        });
+              secondaryColor: '#858585'
+            });
+        } else {
+            var switchery = new Switchery(elem, {
+              size: 'small',
+              color: '#ffbb00',
+              secondaryColor: '#c4c4c4'
+            });
+        }
         $(elem).on("change", function (evt) {
             switchery.setPosition();
         });
@@ -264,10 +272,17 @@ GUI_control.prototype.switchery = function() {
     });
 
     $('.toggle').each(function(index, elem) {
-        var switchery = new Switchery(elem, {
+        if(DarkTheme.configEnabled) {
-            color: '#ffbb00',
+            var switchery = new Switchery(elem, {
-            secondaryColor: '#c4c4c4'
+              color: '#ffbb00',
-        });
+              secondaryColor: '#858585'
+            });
+        } else {
+            var switchery = new Switchery(elem, {
+                color: '#ffbb00',
+                secondaryColor: '#c4c4c4'
+            });
+        }
         $(elem).on("change", function (evt) {
             switchery.setPosition();
         });
@@ -275,11 +290,19 @@ GUI_control.prototype.switchery = function() {
     });
 
     $('.togglemedium').each(function(index, elem) {
-        var switchery = new Switchery(elem, {
+        if(DarkTheme.configEnabled) {
-            className: 'switcherymid',
+            var switchery = new Switchery(elem, {
-            color: '#ffbb00',
+                className: 'switcherymid',
-            secondaryColor: '#c4c4c4'
+                color: '#ffbb00',
-         });
+                secondaryColor: '#858585'
+             });
+        } else {
+            var switchery = new Switchery(elem, {
+                className: 'switcherymid',
+                color: '#ffbb00',
+                secondaryColor: '#c4c4c4'
+             });
+        }
          $(elem).on("change", function (evt) {
              switchery.setPosition();
          });

src/tabs/pid_tuning.html

@@ -89,7 +89,7 @@
                             </tr>
                             <tr class="ROLL">
                                 <!-- 0 -->
-                                <td bgcolor="#FF8080"></td>
+                                <td class="pid_roll"></td>
                                 <td class="pid_data"><input type="number" name="p" step="1" min="0" max="200" /></td>
                                 <td class="pid_data"><input type="number" name="i" step="1" min="0" max="200" /></td>
                                 <td class="pid_data"><input type="number" name="d" step="1" min="0" max="200" /></td>
@@ -108,7 +108,7 @@
                             </tr>
                             <tr class="PITCH">
                                 <!-- 1 -->
-                                <td bgcolor="#80FF80"></td>
+                                <td class="pid_pitch"></td>
                                 <td class="pid_data"><input type="number" name="p" step="1" min="0" max="200" /></td>
                                 <td class="pid_data"><input type="number" name="i" step="1" min="0" max="200" /></td>
                                 <td class="pid_data"><input type="number" name="d" step="1" min="0" max="200" /></td>
@@ -120,7 +120,7 @@
                             </tr>
                             <tr class="YAW">
                                 <!-- 2 -->
-                                <td bgcolor="#8080FF"></td>
+                                <td class="pid_yaw"></td>
                                 <td class="pid_data"><input type="number" name="p" step="1" min="0" max="200" /></td>
                                 <td class="pid_data"><input type="number" name="i" step="1" min="0" max="200" /></td>
                                 <td class="pid_data"><input type="number" name="d" step="1" min="0" max="200" /></td>