Merge pull request #272 from mikeller/more_spacing_fixes

Fixed more spacing issues on the PID tab.

Author: borisbstyle

tabs/pid_tuning.css

@@ -243,7 +243,6 @@
     text-align: left;
     border-right: 1px solid #ccc;
     width: 12.5%;
-
 }
 
 .tab-pid_tuning .pid_titlebar th:first-child {
@@ -264,6 +263,36 @@
     border-right: 0px solid #ccc;
 }
 
+.tab-pid_tuning #pid_optional table th {
+    width: 25%;
+}
+
+.tab-pid_tuning #pid_optional table td {
+    width: 25%;
+}
+
+.tab-pid_tuning #pid_accel table th {
+    width: 33%;
+}
+
+.tab-pid_tuning #pid_accel table td {
+    width: 33%;
+}
+
+.tab-pid_tuning table.compensation td {
+    width: 60%;
+    padding-left: 5px;
+    padding-right: 5px;
+}
+
+.tab-pid_tuning table.compensation td:first-child {
+    width: 10%;
+}
+
+.tab-pid_tuning table.compensation td:last-child {
+    width: 30%;
+}
+
 .tab-pid_tuning .pidTuningFeatures td {
    padding: 5px;
 }
@@ -288,6 +317,7 @@
 
 .tab-pid_tuning table td {
     padding: 1px;
+    padding-left: 5px;
     width: 12.5%;
     border-right: 1px solid #ccc;
 }
@@ -708,18 +738,6 @@ width: 40%;
     margin-bottom: 10px;
 }
 
-.tab-pid_tuning #pid_level th:first-child {
-    width: 7%;
-}
-
-.tab-pid_tuning #pid_level td:first-child {
-    width: 7%;
-}
-
-.tab-pid_tuning .slider {
-    width: 40% !important;
-}
-
 .tabarea {
     float: left;
     width: calc(100% - 22px);

tabs/pid_tuning.html

@@ -212,7 +212,7 @@
                     <div id="pid_accel" class="gui_box grey topspacer pid_tuning">
                         <table class="pid_titlebar">
                             <tr>
-                                <th class="third" i18n="pidTuningName" style="width: 19%;"></th>
+                                <th class="third" i18n="pidTuningName"></th>
                                 <th class="third" i18n="pidTuningStrength" style="width: 33%;"></th>
                                 <th class="third" i18n="pidTuningTransition" style="width: 33%;"></th>
                             </tr>
@@ -266,7 +266,7 @@
                                         <option value="1" i18n="pidTuningDeltaMeasurement"/>
                                     </select>
                                 </td>
-                                <td colspan=2>
+                                <td>
                                     <div>
                                         <label for="delta-select">
                                         <span i18n="pidTuningDelta"></span>
@@ -278,19 +278,19 @@
                             <tr class="ptermSetpoint">
                                 <td><input type="number" name="ptermSetpoint-number" step="0.01" min="0.00" max="1.00"/></td>
                                 <td class="slider"><input type="range" name="ptermSetpoint-range" step="0.01" min="0.00" max="1.00"/></td>
-                                 <td colspan=2>
+                                <td>
                                     <div>
                                         <label>
                                         <span i18n="pidTuningPtermSetpoint"></span>
                                         </label>
                                         <div class="helpicon cf_tip" i18n_title="pidTuningPtermSetpointHelp"></div>
-                                </div>
-                            </td>
+                                    </div>
+                                </td>
                             </tr>
                             <tr class="dtermSetpoint">
                                 <td><input type="number" name="dtermSetpoint-number" step="0.01" min="0.00" max="2.55"/></td>
                                 <td class="slider"><input type="range" name="dtermSetpoint-range" step="0.01" min="0.00" max="2.55"/></td>
-                                 <td colspan=2>
+                                <td>
                                     <div>
                                         <label>
                                         <span i18n="pidTuningDtermSetpoint"></span>
@@ -299,8 +299,9 @@
                                     </div>
                                 </td>
                             </tr>
-                            <td><input type="checkbox" id="vbatpidcompensation" class="toggle" /></td>
-                                <td colspan=2>
+                            <tr>
+                                <td><input type="checkbox" id="vbatpidcompensation" class="toggle" /></td>
+                                <td>
                                     <div>
                                         <label for="vbatpidcompensation">
                                         <span i18n="pidTuningVbatPidCompensation"></span>