ctucx.git: smartie-pwa

temperature: make table nicer

diff --git a/src/state.js b/src/state.js
@@ -51,7 +51,8 @@ class State {
 	}
 
 	_initWS() {
-		this.ws = new WebSocket(`${window.location.protocol === "https:" ? "wss" : "ws"}://${window.location.hostname}/${window.location.pathname.split("/").slice(0, -1).join("/")}/ws`);
+//		this.ws = new WebSocket(`${window.location.protocol === "https:" ? "wss" : "ws"}://${window.location.hostname}/${window.location.pathname.split("/").slice(0, -1).join("/")}/ws`);
+		this.ws = new WebSocket('wss://home.ctu.cx/ws');
 		this.ws.onclose = () => {
 			this.connected = false;
 			this._initWS();

diff --git a/src/temperature/live.js b/src/temperature/live.js
@@ -32,15 +32,15 @@ class TemperatureLive extends LitElement {
 				<smarthome-card>
 					<div class="table">
 						<div class="table-row table-head">
-							<div class="table-column">Name</div>
-							<div class="table-column">Temperature</div>
-							<div class="table-column">Humidity</div>
+							<div class="table-column" style="width: 50%;">Name</div>
+							<div class="table-column" style="width: 29%;">Temperature</div>
+							<div class="table-column" style="width: 21%;">Humidity</div>
 						</div>
 						${config.sensors.map(d => html`
 							<div class="table-row">
-								<div class="table-column">${d.name}${state.data[d.device].weakBattery ? html` <mwc-icon>battery_alert</mwc-icon>` : html``}</div>
-								<div class="table-column">${round(state.data[d.device].temperature, 2)}°C</div>
-								<div class="table-column">${round(state.data[d.device].humidity, 2)}%</div>
+								<div class="table-column" style="width: 50%;">${d.name}${state.data[d.device].weakBattery ? html` <mwc-icon>battery_alert</mwc-icon>` : html``}</div>
+								<div class="table-column" style="width: 29%;">${round(state.data[d.device].temperature, 2)}°C</div>
+								<div class="table-column" style="width: 21%;">${(state.data[d.device].humidity != -1 ) ? html`${round(state.data[d.device].humidity, 2)}%` : html`-` }</div>
 							</div>
 						`)}
 					</div>

@@ -81,11 +81,11 @@ class TemperatureLive extends LitElement {
 			}
 			.table {
 				display: flex;
-				flex-direction: row;
+				flex-direction: column;
 			}
 			.table-row {
 				display: flex;
-				flex-direction: column;
+				flex-direction: row;
 				width: 100%;
 			}
 			.table-column {

@@ -95,11 +95,10 @@ class TemperatureLive extends LitElement {
 				flex-direction: column;
 				justify-content: center;
 			}
-
-			.table-column {
+			.table-row {
 				background-color: #ddd;
 			}
-			.table-column:nth-child(2n) {
+			.table-row:nth-child(2n) {
 				background-color: #fff;
 			}
 			@media (min-width: 600px) {