From 2a51d0cdf6622dd8343b476bbf63c42437790876 Mon Sep 17 00:00:00 2001
From: Anatole SCHRAMM <schramma@ldlcxl0013.ldl.st.com>
Date: Wed, 5 Oct 2022 17:58:41 +0200
Subject: [PATCH] Visually improving the layout of the dashboard

---
 sdCard_content/WWW/indexV2.htm | 99 ++++++++++++++++------------------
 1 file changed, 46 insertions(+), 53 deletions(-)

diff --git a/sdCard_content/WWW/indexV2.htm b/sdCard_content/WWW/indexV2.htm
index 2530b13..ff387bf 100644
--- a/sdCard_content/WWW/indexV2.htm
+++ b/sdCard_content/WWW/indexV2.htm
@@ -200,7 +200,7 @@
 									</button>
 								</div>
 								<div class="col m6 right-align">	
-									<button class="btn waves-effect waves-light lime darken-3" style="" onclick="scanAvailableNetworks();" type="submit" name="Scan">
+									<button class="btn waves-effect waves-light lime darken-3" onclick="scanAvailableNetworks();" type="submit" name="Scan">
 										Scan
 									</button>
 								</div>
@@ -282,13 +282,13 @@
 								<h5 style="font-weight:bold;" class="center-align">DS3231 RTC</h5>
 							</div>
 							<hr>
-							<div style="font-size:1.2em;">
-								<input type="text" class="datepicker" id="datepicker_id">
-								<input type="text" class="timepicker" id="timepicker_id">
+							<div  style="font-size:1.2em;">
+								<input type="text" class="datepicker white-text" id="datepicker_id">
+								<input type="text" class="timepicker white-text" id="timepicker_id">
 							</div>
 							<hr>
 							<div class="row">
-								<div class="col m6">
+								<div class="col m6 left-align">
 										<button class="btn waves-effect waves-light green darken-3" onclick="setRtcTime();" name="apply">
 											Apply &#10004;
 										</button>
@@ -330,6 +330,44 @@
 								</div>
 							</div>
 						</div>
+
+						<div class="teal darken-1 col m3" style="margin: 7px 22px 7px 22px;border-radius: 5px;padding-bottom: 15px;">
+							<div class="white-text">
+								<h5 style="font-weight:bold;" class="center-align">WEB Server</h5>
+							</div>
+							<hr>
+							<div class="switch center-align">
+								<label class="white-text">
+									Disabled
+									<input type="checkbox">
+									<span class="lever"></span>
+									Enabled
+								</label>
+							</div>
+							<table>
+								<tr>
+									<td><label for="web_port" class="white-text" style="font-size:1em;">Port :</label></td>
+									<td><input class="validate white-text" id="web_port" type="number" min="0" max="65535" ></td>
+								</tr>
+								<tr>
+									<td><label for="web_root" class="white-text" style="font-size:1em;">Server root :</label></td>
+									<td><input class="validate white-text" id="web_root" type="text" ></td>
+								</tr>
+							</table>
+							<hr>
+							<div class="row">
+								<div class="col m6">
+									<button class="btn waves-effect waves-light green darken-3"  type="submit" name="apply">
+										Apply &#10004;
+									</button>
+								</div>
+								<div class="col m6 right-align">
+									<button class="btn waves-effect waves-light  red darken-3"  type="submit" name="cancel">
+										Cancel &#10008;
+									</button>
+								</div>
+							</div>
+						</div>
 					</div>
 				</td>
 			</tr>
@@ -377,52 +415,7 @@
 			</div>
 			<div class="col m6">
 				<div class="col m6">
-					<div class="card teal darken-1">
-						<div class="card-content white-text">
-							<span class="card-title center-align" style="font-weight:bold;">Web Server</span>
-						</div>
-						<div class="card-action white-text center-align" style="font-size:1.2em;">
-							<div class="switch">
-								<label class="white-text">
-									Disabled
-									<input type="checkbox">
-									<span class="lever"></span>
-									Enabled
-								</label>
-							</div>
-							<table>
-								<tr>
-									<td><label for="web_port" class="white-text" style="font-size:1em;">Port :</label></td>
-									<td><input class="validate white-text" id="web_port" type="number" min="0" max="65535" ></td>
-								</tr>
-							</table>
-							<div class="row">
-								<div class="col m6">
-									
-								</div>
-								<div class="col m6">
-									
-								</div>
-								<div class="col m6">
-									
-								</div>
-								<div class="col m6">
-									
-								</div>
-								<div class="col m6">
-									
-								</div>
-							</div>
-						</div>
-						<div class="card-action">
-							<button class="btn waves-effect waves-light green darken-3"  type="submit" name="apply">
-								Apply &#10004;
-							</button>
-							<button class="btn waves-effect waves-light  red darken-3" style=""  type="submit" name="cancel">
-								Cancel &#10008;
-							</button>
-						</div>
-					</div>
+					
 				</div>
 				<div class="col m6">
 					<div class="card teal darken-1">
@@ -448,10 +441,10 @@
 							<input placeholder="Password" id="pwd" type="password" class="validate white-text">
 						</div>
 						<div class="card-action">
-							<button class="btn waves-effect waves-light green darken-3"  type="submit" name="apply">
+							<button class="btn waves-effect waves-light green darken-3" type="submit" name="apply">
 								Apply &#10004;
 							</button>
-							<button class="btn waves-effect waves-light  red darken-3" style=""  type="submit" name="cancel">
+							<button class="btn waves-effect waves-light red darken-3" type="submit" name="cancel">
 								Cancel &#10008;
 							</button>
 						</div>