Version 1.22

Web interface minor redesign.
Main code minor changes.
This commit is contained in:
2023-01-12 12:24:53 +03:00
parent 7b60f9efb3
commit 8c3b51304e
4 changed files with 56 additions and 18 deletions

View File

@ -31,20 +31,20 @@
<p class="text">WiFi settings</p>
<div class="wrapper">
<input id="ssid" value="{{ssid}}" placeholder="SSID" label title="WiFi network name" />
<input class="text-inp" id="ssid" value="{{ssid}}" placeholder="SSID" label title="WiFi network name" />
<input id="password" value="{{password}}" onfocus="this.type='text'" type="password" placeholder="Password"
autocomplete="off" label title="WiFi password" />
</div>
<p class="text">MQTT settings</p>
<div class="wrapper">
<input id="mqttHostName" value="{{mqttHostName}}" placeholder="URL or IP" label
<input class="text-inp" id="mqttHostName" value="{{mqttHostName}}" placeholder="URL or IP" label
title="MQTT server URL or IP" />
<input id="mqttHostPort" value="{{mqttHostPort}}" placeholder="Port" label title="MQTT server port" />
</div>
<div class="wrapper">
<input id="mqttUserLogin" value="{{mqttUserLogin}}" placeholder="Login" label
<input class="text-inp" id="mqttUserLogin" value="{{mqttUserLogin}}" placeholder="Login" label
title="MQTT server user login" />
<input id="mqttUserPassword" value="{{mqttUserPassword}}" onfocus="this.type='text'" type="password"
placeholder="Password" autocomplete="off" label title="MQTT server user password" />

View File

@ -1,3 +1,7 @@
p{
margin: 0 0;
}
body {
font-family: "Gill Sans", sans-serif;
background: rgb(255, 255, 255);
@ -21,6 +25,21 @@ h1 {
font-weight: 600;
flex-shrink: 0;
margin-right: 10px;
margin-left: 10px;
margin: 10px 0;
}
.text-inp {
width: 48%;
min-height: 30px;
border-radius: 5px;
border: none;
margin-bottom: 10px;
padding: 0 10px;
color: rgb(0, 0, 0);
background: #a3e0f1;
transition: .5s;
margin-left: 0;
}
.wrapper {
@ -39,6 +58,7 @@ input {
color: rgb(0, 0, 0);
background: #a3e0f1;
transition: .5s;
margin-left: 10px;
}
input:hover {
@ -51,6 +71,8 @@ input:hover {
background: rgb(65, 125, 238);
color: white;
transition: .5s;
margin-left: 0;
margin-top: 8px;
}
.btn:hover {
@ -65,6 +87,10 @@ input:hover {
width: 100%;
}
#espnowNetName {
margin-bottom: 10px;
}
.wrapper.wrapper--end {
align-items: baseline;
}