I spent hours do get a decent looking Dashboard.
The only way was to create a dashboard.esp.
Other names did not work. So i had to get rid of the node selector buttons and the drop down menu .
For people with more knowledge in this field, I’m sure it is easy to do this but for others this could be a starting point.
Here is how it looks:
And here is how i did it:
Code: Select all
<meta name="viewport" content="width=width=device-width, initial-scale=1">
<STYLE>
* {font-family:sans-serif; font-size:14pt; background-color: #2b2a2a; color: #fff}
.button {margin:4px; padding:14px 64px; color:#FFF; text-decoration:none; border-radius:14px}
.wide {display:none}
.button.link {display:none}
</STYLE>
<HTML>
<br><br>
<center>
<table class="center">
<tr><img src="Lamp[Relay#State].png">
<br><br>
<td><a class='button' href="dashboard.esp?cmd=event,toggle">On/Off</a>
</table>
</center>
<br><br>
<center>
<table class="center">
<tr><td><center>Temperature:[sensor#Temperature]°C</center></td>
</tr>
<tr><td><center>Humidity: [sensor#Humidity]%</center></td>
</tr>
</table>
</center>
</HTML>