Provided clearer separation between LED triplets

This commit is contained in:
Jeff Parsons 2016-10-11 10:28:37 -07:00 committed by Jeff Parsons
commit eac2f56296
2 changed files with 17 additions and 14 deletions

View file

@ -2,85 +2,85 @@
<panel id="panel" width="100%" padding="8px">
<name>Control Panel</name>
<control type="container" class="pcjs-panel-group" width="100%" padbottom="8px">
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right">ADDRESS</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A0" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A1" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A2" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A3" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A4" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A5" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A6" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A7" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A8" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A9" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A10" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A11" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A12" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A13" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A14" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A15" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A16" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A17" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A18" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A19" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A20" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="A21" width="100%" container="center"/></control>
</control>
</control>
<control type="container" class="pcjs-panel-group" width="100%" padbottom="8px">
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right">DATA</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D0" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D1" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D2" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D3" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D4" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D5" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D6" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D7" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D8" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D9" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D10" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D11" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D12" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D13" width="100%" container="center"/></control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D14" width="100%" container="center"/></control>
</control>
<control type="container" class="pcjs-tripled" width="12.5%" pos="right">
<control type="container" class="pcjs-tripled" width="12%" pos="right">
<control type="container" class="pcjs-tripled-label" width="100%" pos="right" style="opacity:0">.</control>
<control type="container" class="pcjs-ledpad" width="33%" pos="right"><control type="rled" binding="D15" width="100%" container="center"/></control>
</control>

View file

@ -105,6 +105,9 @@
color: #ffffff;
background-color: #404040;
}
.pcjs-tripled {
padding: 1px;
}
.pcjs-tripled-label {
text-align: right;
padding: 8px;