succd: Only show voltage on hover
Another HP HMI thing: "Only show information that is immediately relevant". Let's hide the pirani voltage as it is mostly no longer interesting to the user. For situations where it is, it can be revealed by hovering over the pirani pressure value.
This commit is contained in:
parent
314dd72aa6
commit
e4fa961ef0
1 changed files with 14 additions and 7 deletions
|
@ -70,6 +70,13 @@ td > span {
|
|||
row-gap: 2em;
|
||||
}
|
||||
|
||||
.has-hidden .hidden-text {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.has-hidden:hover .hidden-text {
|
||||
display: block;
|
||||
|
||||
@media only screen and (max-width: 700px) {
|
||||
body {
|
||||
font-size: 6px;
|
||||
|
@ -115,13 +122,13 @@ td > span {
|
|||
|
||||
<table>
|
||||
<tr>
|
||||
<th rowspan="2">Pirani Gauge</th>
|
||||
<th>Voltage</th>
|
||||
<td id="volts">{{ .Pirani.Volts }}</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<th>Pressure</th>
|
||||
<td id="mbar">{{ .Pirani.Mbar }}</td>
|
||||
<th>Pirani Pressure</th>
|
||||
<td class="has-hidden">
|
||||
<div id="mbar">{{ .Pirani.Mbar }}</div>
|
||||
<div class="hidden-text" style="color: #606060;">
|
||||
<span>Voltage: </span><span id="volts">{{ .Pirani.Volts }}</span>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue