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;
}
.tab-pid_tuning .compensation td {
padding: 5px;
}
.tab-pid_tuning table td {
padding: 1px;
width: 14%;
@ -526,7 +531,6 @@
background-color: #f9f9f9;
}
.tab-pid_tuning .profile {
width: 100px;
}
@ -548,7 +552,6 @@
width: calc(100% - 10px);
}
.tab-pid_tuning .delta {
width: 150px;
}
@ -559,7 +562,6 @@
width: calc(100% - 10px);
}
.tab-pid_tuning .bracket {
position: absolute;
background-image: url(/images/icons/icon_bracket.svg);
@ -590,3 +592,59 @@
border-bottom-left-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>
</tr>
</table>
<table>
<table class="compensation">
<tbody class="features pidTuning">
<!-- table generated here -->
</tbody>
@ -69,7 +69,7 @@
<td colspan=2>
<div>
<label for="vbatpidcompensation">
<span i18n="pidTuningVbatPidCompensation"></span>
<span i18n="pidTuningVbatPidCompensation"></span>
</label>
<div class="helpicon cf_tip" i18n_title="pidTuningVbatPidCompensationHelp"></div>
</div>
@ -221,9 +221,9 @@
<tr>
<th colspan="3">
<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>
</div>
</th>
</tr>
<tr class="ANGLE">
@ -285,41 +285,43 @@
</div>
<div class="cf_column third_right">
<div class="spacer_left rc_curve">
<table class="cf">
<thead>
<tr>
<th colspan=2>
<div>
<div i18n="pidTuningRatesCurve" style="float:left;"></div>
<div class="helpicon cf_tip" i18n_title="pidTuningRatesTip"></div>
</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 class="rc_curve_bg">
<table class="cf">
<thead>
<tr>
<th colspan=2>
<div>
<div i18n="pidTuningRatesCurve" style="float:left;"></div>
<div class="helpicon cf_tip" i18n_title="pidTuningRatesTip"></div>
</div>
</div>
</td>
</tr>
<tr class="new_rates">
<td i18n="pidTuningMaxAngularVelRoll" style="width: 70%"></td>
<td class="maxAngularVelRoll"></td>
</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>
</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>
</td>
</tr>
<tr class="new_rates">
<td i18n="pidTuningMaxAngularVelRoll" style="width: 70%"></td>
<td class="maxAngularVelRoll"></td>
</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 class="spacer_left topspacer throttle">
<table class="cf">