Format-Tweaks on WebUI

This commit is contained in:
Marcel Peterkau 2022-08-23 00:50:52 +02:00
parent da19ebcc09
commit f67817adb5
2 changed files with 68 additions and 70 deletions

View File

@ -20,7 +20,7 @@
<nav class="navbar fixed-top navbar-dark bg-primary" id="navbar1">
<a class="navbar-brand" href="#">
<img src="static/img/logo.png" width="30" height="30" class="d-inline-block align-top" alt="">
<img src="static/img/logo.png" width="30" height="30" class="d-inline-block align-top mr-1" alt="">
KTM CAN ChainLube
</a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsingNavbar"
@ -51,7 +51,7 @@
<div class="col text-center">
<div class="jumbotron">
<img src="static/img/logo.png" width="120" height="120" class="img-fluid" alt="">
<h3>KTM CAN Chain Lube</h3>
<h3 class="pt-3">KTM CAN Chain Lube</h3>
</div>
</div>
<hr />
@ -85,8 +85,8 @@
</tbody>
</table>
<p>
<button class="btn btn-primary" type="button" data-toggle="collapse" data-target="#collapseDTCDescription"
aria-expanded="false" aria-controls="collapseDTCDescription">
<button class="btn btn-outline-primary" type="button" data-toggle="collapse"
data-target="#collapseDTCDescription" aria-expanded="false" aria-controls="collapseDTCDescription">
DTC Beschreibung
</button>
</p>
@ -102,37 +102,40 @@
<!-- Div Tab Home-->
<!-- Div Tab Source Settings-->
<div id="tab_source" class="tab-pane fade" role="tabpanel">
<h3>Erfassung Wegstrecke</h3>
<h3>Wegstreckenerfassung</h3>
<hr />
<p>
<h4>Signalquelle</h4>
<form action="\post.htm" method="POST" class="form-horizontal">
<form action="post.htm" method="POST" class="form-horizontal">
<div class="form-group row">
<label for="sourceselect" class="control-label col-4">Wegstrecke Quelle</label>
<label for="sourceselect" class="control-label col-4">Schnittstelle</label>
<div class="col-8">
<select id="sourceselect" name="sourceselect" class="select form-control">
%SOURCE_SELECT_OPTIONS%
</select>
</div>
</div>
<div class="alert alert-primary alert-dismissable show fade" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<strong>Achtung!</strong><br>
Bei Änderung der Signalquelle wird der CAN-Oiler neu gestartet.
Dadurch wird die WiFi-Verbindung getrennt und muss neu aufgebaut werden.
</div>
<div class="form-group row">
<div class="offset-4 col-8">
<button name="sourcesave" type="submit" class="btn btn-primary">&Uuml;bernehmen</button>
<button name="sourcesave" type="submit" class="btn btn-outline-primary">&Uuml;bernehmen</button>
</div>
</div>
</form>
<div class="alert alert-warning">
<strong>Achtung!</strong><br>
Bei Änderung der Wegstrecken-Quelle wird der CAN-Oiler neu gestartet.
Dadurch wird die WiFi-Verbindung getrennt und muss neu aufgebaut werden.
</div>
</p>
<!-- Div Source:Impulse Settings-->
<div %SHOW_IMPULSE_SETTINGS%>
<hr />
<p>
<h4>Einstellungen Impuls</h4>
<form action="\post.htm" method="POST" class="form-horizontal">
<h4>Einstellungen Impulseingang</h4>
<form action="post.htm" method="POST" class="form-horizontal">
<div class="form-group row">
<label for="tirewidth" class="control-label col-4">Reifenbreite</label>
@ -153,9 +156,9 @@
<div class="input-group">
<input id="tireratio" name="tireratio" type="text" required="required" class="form-control"
value="%TIRE_RATIO%">
<div class="input-group-append">
<span class="input-group-text">mm</span>
</div>
<div class="input-group-append">
<span class="input-group-text">mm</span>
</div>
</div>
</div>
</div>
@ -165,9 +168,9 @@
<div class="input-group">
<input id="tiredia" name="tiredia" type="text" required="required" class="form-control"
value="%RIM_DIAMETER%">
<div class="input-group-append">
<span class="input-group-text">"</span>
</div>
<div class="input-group-append">
<span class="input-group-text">"</span>
</div>
</div>
</div>
</div>
@ -183,7 +186,7 @@
</div>
<div class="form-group row">
<div class="offset-4 col-8">
<button name="pulsesave" type="submit" class="btn btn-primary">Speichern</button>
<button name="pulsesave" type="submit" class="btn btn-outline-primary">Speichern</button>
</div>
</div>
</form>
@ -195,7 +198,7 @@
<hr />
<p>
<h4>Einstellungen CAN-Bus</h4>
<form action="\post.htm" method="POST" class="form-horizontal">
<form action="post.htm" method="POST" class="form-horizontal">
<div class="form-group row">
<label for="cansource" class="control-label col-4">Model</label>
<div class="col-8">
@ -206,7 +209,7 @@
</div>
<div class="form-group row">
<div class="offset-4 col-8">
<button name="cansave" type="submit" class="btn btn-primary">Speichern</button>
<button name="cansave" type="submit" class="btn btn-outline-primary">Speichern</button>
</div>
</div>
</form>
@ -218,7 +221,7 @@
<hr />
<p>
<h4>Einstellungen GPS</h4>
<form action="\post.htm" method="POST" class="form-horizontal">
<form action="post.htm" method="POST" class="form-horizontal">
<div class="form-group row">
<label for="gpsbaud" class="control-label col-4">Baudrate</label>
<div class="col-8">
@ -229,7 +232,7 @@
</div>
<div class="form-group row">
<div class="offset-4 col-8">
<button name="gpssave" type="submit" class="btn btn-primary">Speichern</button>
<button name="gpssave" type="submit" class="btn btn-outline-primary">Speichern</button>
</div>
</div>
</form>
@ -246,32 +249,32 @@
<p>
<form action="post.htm" method="POST" class="form-horizontal">
<div class="form-group row">
<label for="lubedistancenormal" class="control-label col-4">Modus:normal</label>
<label for="lubedistancenormal" class="control-label col-4">Normal (gr&uuml;n)</label>
<div class="col-8">
<div class="input-group">
<input id="lubedistancenormal" name="lubedistancenormal" value="%LUBE_DISTANCE_NORMAL%" type="text"
class="form-control" required="required">
<div class="input-group-append">
<span class="input-group-text">m</span>
</div>
<div class="input-group-append">
<span class="input-group-text">m</span>
</div>
</div>
</div>
</div>
<div class="form-group row">
<label for="lubedistancerain" class="control-label col-4">Modus:rain</label>
<label for="lubedistancerain" class="control-label col-4">Regen (blau)</label>
<div class="col-8">
<div class="input-group">
<input id="lubedistancerain" name="lubedistancerain" value="%LUBE_DISTANCE_RAIN%" type="text"
class="form-control" required="required">
<div class="input-group-append">
<span class="input-group-text">m</span>
</div>
<div class="input-group-append">
<span class="input-group-text">m</span>
</div>
</div>
</div>
</div>
<div class="form-group row">
<div class="offset-4 col-8">
<button name="oilsave" type="submit" class="btn btn-primary">Speichern</button>
<button name="oilsave" type="submit" class="btn btn-outline-primary">Speichern</button>
</div>
</div>
</form>
@ -285,16 +288,16 @@
<hr />
<p>
<h4>&Ouml;lvorrat</h4>
<form action="\post.htm" method="POST" class="form-horizontal">
<form action="post.htm" method="POST" class="form-horizontal">
<div class="form-group row">
<label for="tankcap" class="control-label col-4">Tankkapazität</label>
<div class="col-8">
<div class="input-group">
<input id="tankcap" name="tankcap" value="%TANK_CAPACITY%" type="text" class="form-control"
required="required">
<div class="input-group-append">
<span class="input-group-text">ml</span>
</div>
<div class="input-group-append">
<span class="input-group-text">ml</span>
</div>
</div>
</div>
</div>
@ -304,9 +307,9 @@
<div class="input-group">
<input id="tankwarn" name="tankwarn" value="%TANK_REMIND%" type="text" class="form-control"
required="required">
<div class="input-group-append">
<span class="input-group-text">&#37;</span>
</div>
<div class="input-group-append">
<span class="input-group-text">&#37;</span>
</div>
</div>
</div>
</div>
@ -316,9 +319,9 @@
<div class="input-group">
<input id="pumppulse" name="pumppulse" value="%AMOUNT_PER_DOSE%" type="text" class="form-control"
required="required">
<div class="input-group-append">
<span class="input-group-text">µl</span>
</div>
<div class="input-group-append">
<span class="input-group-text">µl</span>
</div>
</div>
</div>
</div>
@ -336,8 +339,8 @@
</div>
<div class="form-group row">
<div class="offset-4 col-8 row">
<button name="oilsave" type="submit" class="btn btn-primary">Speichern</button>
<button name="resettank" type="submit" class="btn btn-primary">Tank zurücksetzen</button>
<button name="oilsave" type="submit" class="btn btn-outline-primary">Speichern</button>
<button name="resettank" type="submit" class="btn btn-outline-primary ml-2">Tank zurücksetzen</button>
</div>
</div>
</form>
@ -345,7 +348,7 @@
<hr />
<p>
<h4>Entl&uuml;ftung</h4>
<form action="\post.htm" method="POST" class="form-horizontal">
<form action="post.htm" method="POST" class="form-horizontal">
<div class="form-group row">
<label for="purgepulse" class="control-label col-4">Entl&uuml;ftung Dosierung</label>
<div class="col-8">
@ -359,8 +362,8 @@
</div>
<div class="form-group row">
<div class="offset-4 col-8 row">
<button name="maintsave" type="submit" class="btn btn-primary">Speichern</button>
<button name="purgenow" type="submit" class="btn btn-primary">Entlüftung starten</button>
<button name="maintsave" type="submit" class="btn btn-outline-primary">Speichern</button>
<button name="purgenow" type="submit" class="btn btn-outline-primary ml-2">Entlüftung starten</button>
</div>
</div>
</form>
@ -368,7 +371,10 @@
<hr />
<h4>EEPROM formatieren</h4>
<p>
<div class="alert alert-warning">
<div class="alert alert-primary alert-dismissable show fade" role="alert">
<button type="button" class="close" data-dismiss="alert" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
<strong>Achtung!</strong><br>
Das Formatieren der EEPROM-Bereiche sollte nur ausgeführt werden wenn es unbedingt erforderlich ist!
Hierdurch werden alle Einstellungen zurück gesetzt bzw. alle Betriebsdaten gehen verloren.
@ -395,7 +401,7 @@
</div>
<div class="form-group row">
<div class="offset-4 col-8">
<button name="reset_ee_btn" type="submit" class="btn btn-primary">EEPROM formatieren</button>
<button name="reset_ee_btn" type="submit" class="btn btn-outline-primary">EEPROM formatieren</button>
</div>
</div>
</form>
@ -536,10 +542,6 @@
<p>
<h4>Firmware-Update</h4>
<form method='POST' action='/doUpdate' enctype='multipart/form-data'>
<div class="input-group">
<div class="input-group-prepend">
<span class="input-group-text" id="inputGroupFileAddon01">Upload</span>
@ -549,12 +551,6 @@
<label class="custom-file-label" for="fw-update-file">Choose file</label>
</div>
</div>
</form>
</p>
</div>
@ -564,16 +560,16 @@
</main>
<!-- Footer -->
<footer class="navbar-default navbar-fixed-bottom">
<div class="container-fluid">
<!-- Copyright -->
<div class="col text-center">
© 2022 Copyright:
<a class="text-reset fw-bold" href="https://eventronics.de/">Marcel Peterkau</a>
<footer class="page-footer navbar-dark bg-primary font-small fixed-bottom">
<div class="container-fluid text-center">
<div class="footer-copyright text-center py-3">
<span class="text-muted">© 2022 -
<a class="text-reset fw-bold" href="https://eventronics.de/">Marcel Peterkau</a></span>
</div>
<!-- Copyright -->
</div>
</footer>
<!-- Footer -->
<script>

View File

@ -8,6 +8,7 @@
body {
padding-top: 70px;
margin-bottom: 56px;
}
hr {
@ -15,4 +16,5 @@ hr {
border-width: 0;
color: gray;
background-color: gray
}
}