mirror of
https://github.com/betaflight/betaflight-configurator.git
synced 2025-07-19 22:35:17 +03:00
Changed layout of configuration tab
This commit is contained in:
Bas Delfos
parent
12776180b6
commit
0432e7c738
1 changed files with 525 additions and 477 deletions
|
|
@ -9,7 +9,14 @@
|
|||
<p i18n="configurationFeaturesHelp"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="leftWrapper mixer">
|
||||
|
||||
<table style="width:calc(100%);">
|
||||
<tr>
|
||||
<td style="width:calc(50%);vertical-align:top;">
|
||||
<!-- ROW 1 - LEFT PANE -->
|
||||
|
||||
<!-- MIXER -->
|
||||
<div class="mixer">
|
||||
<div class="gui_box grey">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationMixer"></div>
|
||||
|
|
@ -38,7 +45,104 @@
|
|||
|
||||
</div>
|
||||
</div>
|
||||
<div class="rightWrapper motorstop">
|
||||
|
||||
<!-- SYSTEM CONFIGURATION -->
|
||||
<div class="systemconfig">
|
||||
<div class="gui_box grey">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationSystem"></div>
|
||||
</div>
|
||||
<div class="spacer_box">
|
||||
<div class="note">
|
||||
<div class="note_spacer">
|
||||
<p i18n="configurationLoopTimeHelp"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="select gyroUse32kHz">
|
||||
<div style="float: left; height: 20px; margin-right: 15px; margin-left: 3px;">
|
||||
<input type="checkbox" id="gyroUse32kHz" class="toggle" />
|
||||
</div>
|
||||
<label for="gyroUse32kHz"> <span class="freelabel" i18n="configurationGyroUse32kHz"></span>
|
||||
</label>
|
||||
<div class="helpicon cf_tip" i18n_title="configurationGyroUse32kHzHelp"></div>
|
||||
</div>
|
||||
<div class="select">
|
||||
<label>
|
||||
<select class="gyroSyncDenom">
|
||||
<!-- list generated here -->
|
||||
</select>
|
||||
<span i18n="configurationGyroSyncDenom"></span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="select selectPidProcessDenom">
|
||||
<label>
|
||||
<select class="pidProcessDenom">
|
||||
<!-- list generated here -->
|
||||
</select>
|
||||
<span i18n="configurationPidProcessDenom"></span>
|
||||
<div class="helpicon cf_tip" i18n_title="configurationPidProcessDenomHelp"></div>
|
||||
</label>
|
||||
</div>
|
||||
<div class="hardwareSelection">
|
||||
<div class="select">
|
||||
<div style="float: left; height: 20px; margin-right: 15px; margin-left: 3px;">
|
||||
<input type="checkbox" id="accHardwareSwitch" class="toggle" />
|
||||
</div>
|
||||
<label for="accHardwareSwitch"> <span class="freelabel"
|
||||
i18n="configurationAccHardware"></span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="select">
|
||||
<div style="float: left; height: 20px; margin-right: 15px; margin-left: 3px;">
|
||||
<input type="checkbox" id="baroHardwareSwitch" class="toggle" />
|
||||
</div>
|
||||
<label for="baroHardwareSwitch"> <span class="freelabel"
|
||||
i18n="configurationBaroHardware"></span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="select">
|
||||
<div style="float: left; height: 20px; margin-right: 15px; margin-left: 3px;">
|
||||
<input type="checkbox" id="magHardwareSwitch" class="toggle" />
|
||||
</div>
|
||||
<label for="magHardwareSwitch"> <span class="freelabel"
|
||||
i18n="configurationMagHardware"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gui_box grey miscSettings">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationPersonalization"></div>
|
||||
</div>
|
||||
<div class="spacer_box">
|
||||
<div class="number">
|
||||
<label> <input type="text" name="craftName" maxlength="32" style="width:100px;"/> <span
|
||||
i18n="craftName"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gui_box grey miscSettings">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationCamera"></div>
|
||||
</div>
|
||||
<div class="spacer_box">
|
||||
<div class="number fpvCamAngleDegrees">
|
||||
<label> <input type="number" name="fpvCamAngleDegrees" step="1" min="0" max="50" /> <span
|
||||
i18n="configurationFpvCamAngleDegrees"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</td>
|
||||
<td style="width:calc(50%);vertical-align:top;">
|
||||
<!-- ROW 1 - RIGHT PANE -->
|
||||
|
||||
<!-- MOTOR STOP -->
|
||||
<div class="motorstop">
|
||||
<div class="gui_box grey">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationEscFeatures"></div>
|
||||
|
|
@ -132,9 +236,9 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clear-both"></div>
|
||||
|
||||
<div class="leftWrapper board acc">
|
||||
<!-- BOARD ORIENTATION -->
|
||||
<div class="board acc">
|
||||
<div class="gui_box grey">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationBoardAlignment"></div>
|
||||
|
|
@ -210,7 +314,108 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rightWrapper 3d">
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width:calc(50%);vertical-align:top;">
|
||||
<!-- ROW 2 - LEFT PANE -->
|
||||
|
||||
<!-- RECEIVER -->
|
||||
<!-- FIXME move receiver and RSSI to receiver tab -->
|
||||
<div class="receiver">
|
||||
<div class="gui_box grey" style="margin-bottom:10px;">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationReceiver"></div>
|
||||
</div>
|
||||
<div class="spacer_box" style="padding-bottom:15px;">
|
||||
<select class="features rxMode" name="rxMode">
|
||||
<!-- list generated here -->
|
||||
</select>
|
||||
<span i18n="configurationReceiverMode"></span>
|
||||
</div>
|
||||
<div class="serialRXBox spacer_box" style="padding-bottom:10px;">
|
||||
<div class="note spacerbottom">
|
||||
<div class="note_spacer">
|
||||
<p i18n="configurationSerialRXHelp"></p>
|
||||
</div>
|
||||
</div>
|
||||
<select class="serialRX">
|
||||
<!-- list generated here -->
|
||||
</select>
|
||||
<span i18n="configurationSerialRX"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</td>
|
||||
<td style="width:calc(50%);vertical-align:top;">
|
||||
<!-- ROW 2 - RIGHT PANE -->
|
||||
|
||||
<!-- RSSI -->
|
||||
<div class="rssi">
|
||||
<div class="gui_box grey" style="margin-bottom:10px;">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationRSSI"></div>
|
||||
<div class="helpicon cf_tip" i18n_title="configurationRSSIHelp"></div>
|
||||
</div>
|
||||
<div class="spacer_box">
|
||||
<table cellpadding="0" cellspacing="0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th i18n="configurationFeatureEnabled"></th>
|
||||
<th i18n="configurationFeatureDescription"></th>
|
||||
<th i18n="configurationFeatureName"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="features rssi">
|
||||
<!-- table generated here -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width:calc(50%);vertical-align:top;">
|
||||
<!-- ROW 3 - LEFT PANE -->
|
||||
|
||||
<!-- OTHER FEATURES -->
|
||||
<div class="featuresOther">
|
||||
<div class="gui_box grey">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationFeatures"></div>
|
||||
</div>
|
||||
<div class="note" style="float: left; margin-top: 10px; margin-left: 10px; margin-right: 10px">
|
||||
<div class="note_spacer">
|
||||
<p i18n="configurationOtherFeaturesHelp"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="spacer_box">
|
||||
<table cellpadding="0" cellspacing="0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th i18n="configurationFeatureEnabled"></th>
|
||||
<th i18n="configurationFeatureDescription"></th>
|
||||
<th i18n="configurationFeatureName"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="features other" id="noline">
|
||||
<!-- table generated here -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</td>
|
||||
<td style="width:calc(50%);vertical-align:top;">
|
||||
<!-- ROW 3 - RIGHT PANE -->
|
||||
|
||||
<!-- 3D -->
|
||||
<div class="3d">
|
||||
<div class="gui_box grey">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configuration3d"></div>
|
||||
|
|
@ -248,176 +453,9 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clear-both"></div>
|
||||
|
||||
<div class="leftWrapper">
|
||||
<div class="gui_box grey" style="margin-bottom:20px; margin-top:10px;">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationSystem"></div>
|
||||
</div>
|
||||
<div class="spacer_box">
|
||||
<div class="note">
|
||||
<div class="note_spacer">
|
||||
<p i18n="configurationLoopTimeHelp"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="select gyroUse32kHz">
|
||||
<div style="float: left; height: 20px; margin-right: 15px; margin-left: 3px;">
|
||||
<input type="checkbox" id="gyroUse32kHz" class="toggle" />
|
||||
</div>
|
||||
<label for="gyroUse32kHz"> <span class="freelabel" i18n="configurationGyroUse32kHz"></span>
|
||||
</label>
|
||||
<div class="helpicon cf_tip" i18n_title="configurationGyroUse32kHzHelp"></div>
|
||||
</div>
|
||||
<div class="select">
|
||||
<label>
|
||||
<select class="gyroSyncDenom">
|
||||
<!-- list generated here -->
|
||||
</select>
|
||||
<span i18n="configurationGyroSyncDenom"></span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="select selectPidProcessDenom">
|
||||
<label>
|
||||
<select class="pidProcessDenom">
|
||||
<!-- list generated here -->
|
||||
</select>
|
||||
<span i18n="configurationPidProcessDenom"></span>
|
||||
<div class="helpicon cf_tip" i18n_title="configurationPidProcessDenomHelp"></div>
|
||||
</label>
|
||||
</div>
|
||||
<div class="hardwareSelection">
|
||||
<div class="select">
|
||||
<div style="float: left; height: 20px; margin-right: 15px; margin-left: 3px;">
|
||||
<input type="checkbox" id="accHardwareSwitch" class="toggle" />
|
||||
</div>
|
||||
<label for="accHardwareSwitch"> <span class="freelabel"
|
||||
i18n="configurationAccHardware"></span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="select">
|
||||
<div style="float: left; height: 20px; margin-right: 15px; margin-left: 3px;">
|
||||
<input type="checkbox" id="baroHardwareSwitch" class="toggle" />
|
||||
</div>
|
||||
<label for="baroHardwareSwitch"> <span class="freelabel"
|
||||
i18n="configurationBaroHardware"></span>
|
||||
</label>
|
||||
</div>
|
||||
<div class="select">
|
||||
<div style="float: left; height: 20px; margin-right: 15px; margin-left: 3px;">
|
||||
<input type="checkbox" id="magHardwareSwitch" class="toggle" />
|
||||
</div>
|
||||
<label for="magHardwareSwitch"> <span class="freelabel"
|
||||
i18n="configurationMagHardware"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gui_box grey miscSettings">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationPersonalization"></div>
|
||||
</div>
|
||||
<div class="spacer_box">
|
||||
<div class="number">
|
||||
<label> <input type="text" name="craftName" maxlength="32" style="width:100px;"/> <span
|
||||
i18n="craftName"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="gui_box grey miscSettings" style="margin-top:10px;">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationCamera"></div>
|
||||
</div>
|
||||
<div class="spacer_box">
|
||||
<div class="number fpvCamAngleDegrees">
|
||||
<label> <input type="number" name="fpvCamAngleDegrees" step="1" min="0" max="50" /> <span
|
||||
i18n="configurationFpvCamAngleDegrees"></span>
|
||||
</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="rightWrapper featuresOther">
|
||||
<div class="gui_box grey" style="margin-top:10px;">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationFeatures"></div>
|
||||
</div>
|
||||
<div class="note" style="float: left; margin-top: 10px; margin-left: 10px; margin-right: 10px">
|
||||
<div class="note_spacer">
|
||||
<p i18n="configurationOtherFeaturesHelp"></p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="spacer_box">
|
||||
<table cellpadding="0" cellspacing="0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th i18n="configurationFeatureEnabled"></th>
|
||||
<th i18n="configurationFeatureDescription"></th>
|
||||
<th i18n="configurationFeatureName"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="features other" id="noline">
|
||||
<!-- table generated here -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clear-both"></div>
|
||||
|
||||
<!-- FIXME move receiver and RSSI to receiver tab -->
|
||||
<div class="leftWrapper receiver">
|
||||
<div class="gui_box grey" style="margin-bottom:10px;">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationReceiver"></div>
|
||||
</div>
|
||||
<div class="spacer_box" style="padding-bottom:15px;">
|
||||
<select class="features rxMode" name="rxMode">
|
||||
<!-- list generated here -->
|
||||
</select>
|
||||
<span i18n="configurationReceiverMode"></span>
|
||||
</div>
|
||||
<div class="serialRXBox spacer_box" style="padding-bottom:10px;">
|
||||
<div class="note spacerbottom">
|
||||
<div class="note_spacer">
|
||||
<p i18n="configurationSerialRXHelp"></p>
|
||||
</div>
|
||||
</div>
|
||||
<select class="serialRX">
|
||||
<!-- list generated here -->
|
||||
</select>
|
||||
<span i18n="configurationSerialRX"></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="rightWrapper rssi">
|
||||
<div class="gui_box grey" style="margin-bottom:10px;">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationRSSI"></div>
|
||||
<div class="helpicon cf_tip" i18n_title="configurationRSSIHelp"></div>
|
||||
</div>
|
||||
<div class="spacer_box">
|
||||
<table cellpadding="0" cellspacing="0">
|
||||
<thead>
|
||||
<tr>
|
||||
<th i18n="configurationFeatureEnabled"></th>
|
||||
<th i18n="configurationFeatureDescription"></th>
|
||||
<th i18n="configurationFeatureName"></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="features rssi">
|
||||
<!-- table generated here -->
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clear-both"></div>
|
||||
|
||||
<div class="leftWrapper gps">
|
||||
<!-- GPS -->
|
||||
<div class="gps">
|
||||
<div class="gui_box grey gps">
|
||||
<div class="gui_box_titlebar">
|
||||
<div class="spacer_box_title" i18n="configurationGPS"></div>
|
||||
|
|
@ -486,9 +524,15 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clear-both"></div>
|
||||
</div>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td style="width:calc(100%)" colspan="2">
|
||||
<!-- ROW 4 - FULL WIDTH PANE -->
|
||||
|
||||
<!-- BEEPER -->
|
||||
<div class="leftWrapper beepers" style="width: calc(100% - 20px);">
|
||||
<div class="gui_box grey" style="margin-top:10px;">
|
||||
<div class="gui_box_titlebar">
|
||||
|
|
@ -514,7 +558,11 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="clear-both"></div>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
<div class="content_toolbar">
|
||||
<div class="btn save_btn">
|
||||
<a class="save" href="#" i18n="configurationButtonSave"></a>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue