Cleanup of the PID tab layout

10.3.x-maintenance
skaman82 2016-07-31 17:10:53 +02:00
parent 37164a2bba
commit e97f6685d4
2 changed files with 102 additions and 42 deletions

View File

@ -262,6 +262,11 @@
border-right: 0px solid #ccc; border-right: 0px solid #ccc;
} }
.tab-pid_tuning .compensation td {
padding: 5px;
}
.tab-pid_tuning table td { .tab-pid_tuning table td {
padding: 1px; padding: 1px;
width: 14%; width: 14%;
@ -526,7 +531,6 @@
background-color: #f9f9f9; background-color: #f9f9f9;
} }
.tab-pid_tuning .profile { .tab-pid_tuning .profile {
width: 100px; width: 100px;
} }
@ -548,7 +552,6 @@
width: calc(100% - 10px); width: calc(100% - 10px);
} }
.tab-pid_tuning .delta { .tab-pid_tuning .delta {
width: 150px; width: 150px;
} }
@ -559,7 +562,6 @@
width: calc(100% - 10px); width: calc(100% - 10px);
} }
.tab-pid_tuning .bracket { .tab-pid_tuning .bracket {
position: absolute; position: absolute;
background-image: url(/images/icons/icon_bracket.svg); background-image: url(/images/icons/icon_bracket.svg);
@ -590,3 +592,59 @@
border-bottom-left-radius: 5px; border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px; border-bottom-right-radius: 5px;
} }
.tab-pid_tuning .pidTuning td {
padding: 5px;
}
.tab-pid_tuning .pidTuning tr {
width: 100%;
border-bottom: 1px solid #ddd;
padding: 0px;
}
.tab-pid_tuning .pidTuning td:first-child {
width: 10%;
padding-bottom: 6px;
padding-top: 5px;
}
.tab-pid_tuning .pidTuning td:last-child {
width: 40%;
}
.tab-pid_tuning .pidTuning td {
width: 50%;
}
.tab-pid_tuning .new_rates td:first-child {
border-bottom-left-radius: 0px;
padding-left: 10px;
}
.tab-pid_tuning .new_rates td:last-child {
border-bottom-right-radius: 0px;
}
.tab-pid_tuning .rc_curve .cf tr {
border-bottom: 1px solid silver;
}
.tab-pid_tuning .rc_curve .cf tr td {
border: none;
border-bottom-right-radius: 0px;
border-bottom-left-radius: 0px;
padding-bottom: 3px;
}
.tab-pid_tuning .rc_curve_bg {
float: left;
padding-bottom: 20px;
background: #ddd;
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
}
.tab-pid_tuning .new_rates_last-child {
border-bottom: none;
}

View File

@ -58,7 +58,7 @@
<th i18n="pidTuningPidSettings"></th> <th i18n="pidTuningPidSettings"></th>
</tr> </tr>
</table> </table>
<table> <table class="compensation">
<tbody class="features pidTuning"> <tbody class="features pidTuning">
<!-- table generated here --> <!-- table generated here -->
</tbody> </tbody>
@ -69,7 +69,7 @@
<td colspan=2> <td colspan=2>
<div> <div>
<label for="vbatpidcompensation"> <label for="vbatpidcompensation">
<span i18n="pidTuningVbatPidCompensation"></span> <span i18n="pidTuningVbatPidCompensation"></span>
</label> </label>
<div class="helpicon cf_tip" i18n_title="pidTuningVbatPidCompensationHelp"></div> <div class="helpicon cf_tip" i18n_title="pidTuningVbatPidCompensationHelp"></div>
</div> </div>
@ -221,9 +221,9 @@
<tr> <tr>
<th colspan="3"> <th colspan="3">
<div class="pid_mode"> <div class="pid_mode">
<div i18n="pidTuningLevel" style="float:left;"></div> <div i18n="pidTuningLevel" style="float:left;"></div>
<div class="helpicon cf_tip" i18n_title="pidTuningLevelHelp"></div> <div class="helpicon cf_tip" i18n_title="pidTuningLevelHelp"></div>
</div> </div>
</th> </th>
</tr> </tr>
<tr class="ANGLE"> <tr class="ANGLE">
@ -285,41 +285,43 @@
</div> </div>
<div class="cf_column third_right"> <div class="cf_column third_right">
<div class="spacer_left rc_curve"> <div class="spacer_left rc_curve">
<table class="cf"> <div class="rc_curve_bg">
<thead> <table class="cf">
<tr> <thead>
<th colspan=2> <tr>
<div> <th colspan=2>
<div i18n="pidTuningRatesCurve" style="float:left;"></div> <div>
<div class="helpicon cf_tip" i18n_title="pidTuningRatesTip"></div> <div i18n="pidTuningRatesCurve" style="float:left;"></div>
</div> <div class="helpicon cf_tip" i18n_title="pidTuningRatesTip"></div>
</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan=2>
<div class="spacer" style="margin-top: 10px; margin-bottom: 10px;">
<div class="rate_curve">
<canvas height="120px" style="width: 100%; height: 100%"></canvas>
</div> </div>
</div> </th>
</td> </tr>
</tr> </thead>
<tr class="new_rates"> <tbody>
<td i18n="pidTuningMaxAngularVelRoll" style="width: 70%"></td> <tr>
<td class="maxAngularVelRoll"></td> <td colspan=2>
</tr> <div class="spacer" style="margin-top: 10px; margin-bottom: 10px;">
<tr class="new_rates"> <div class="rate_curve">
<td i18n="pidTuningMaxAngularVelPitch"></td> <canvas height="120px" style="width: 100%; height: 100%"></canvas>
<td class="maxAngularVelPitch"></td> </div>
</tr> </div>
<tr class="new_rates"> </td>
<td i18n="pidTuningMaxAngularVelYaw"></td> </tr>
<td class="maxAngularVelYaw"></td> <tr class="new_rates">
</tr> <td i18n="pidTuningMaxAngularVelRoll" style="width: 70%"></td>
</tbody> <td class="maxAngularVelRoll"></td>
</table> </tr>
<tr class="new_rates">
<td i18n="pidTuningMaxAngularVelPitch"></td>
<td class="maxAngularVelPitch"></td>
</tr>
<tr class="new_rates">
<td i18n="pidTuningMaxAngularVelYaw"></td>
<td class="maxAngularVelYaw"></td>
</tr>
</tbody>
</table>
</div>
</div> </div>
<div class="spacer_left topspacer throttle"> <div class="spacer_left topspacer throttle">
<table class="cf"> <table class="cf">