RnD/dashboardAPI
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

chore(dashboardAPI): Tank Layout card width matches its visual

Browse Source 
Canvas frame logical width: 480 → 400 px (was leaving ~104 px of empty
space on the right inside the card). Panel grid width: 8 → 6 cols so the
card pixel width matches the frame logical width and content fills it
without horizontal padding, instead of letterboxing in the centre.

Bottom readouts repositioned to fit within 400 px (level/volume/fill all
inside the new frame width) and per-field decimal overrides added so unit
formatting doesn't truncate ('100.00 mm' fits in the value label width).

Freed grid cols flow to the Level + Volume timeseries on the right
(w:12 → 14 each, x:12 → 10) so the right half consumes the rest of the
row without a gap.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
znetsixe
2026-05-28 10:53:08 +02:00
parent b3972d4a2f
commit 70151e52ec
1 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

28
config/pumpingStation.json
View File

@@ -205,19 +205,19 @@
"overrides": [ "overrides": [
{ {
"matcher": { "id": "byRegexp", "options": "^(outflowLevel|inflowLevel|overflowLevel|heightBasin|dryRunLevel|highVolumeSafetyLevel|level)$" }, "matcher": { "id": "byRegexp", "options": "^(outflowLevel|inflowLevel|overflowLevel|heightBasin|dryRunLevel|highVolumeSafetyLevel|level)$" },
"properties": [{ "id": "unit", "value": "lengthm" }] "properties": [{ "id": "unit", "value": "lengthm" }, { "id": "decimals", "value": 2 }]
}, },
{ {
"matcher": { "id": "byRegexp", "options": "^(volume|maxVol|minVol|maxVolAtOverflow|minVolAtOutflow|minVolAtInflow)$" }, "matcher": { "id": "byRegexp", "options": "^(volume|maxVol|minVol|maxVolAtOverflow|minVolAtOutflow|minVolAtInflow)$" },
"properties": [{ "id": "unit", "value": "m3" }] "properties": [{ "id": "unit", "value": "m3" }, { "id": "decimals", "value": 2 }]
}, },
{ {
"matcher": { "id": "byRegexp", "options": "Percent$" }, "matcher": { "id": "byRegexp", "options": "^volumePercent$" },
"properties": [{ "id": "unit", "value": "percent" }] "properties": [{ "id": "unit", "value": "percent" }, { "id": "decimals", "value": 1 }]
} }
] ]
}, },
"gridPos": { "h": 20, "w": 8, "x": 4, "y": 6 }, "gridPos": { "h": 20, "w": 6, "x": 4, "y": 6 },
"id": 17, "id": 17,
"options": { "options": {
"inlineEditing": false, "inlineEditing": false,
@@ -227,7 +227,7 @@
"root": { "root": {
"name": "Basin", "name": "Basin",
"type": "frame", "type": "frame",
"placement": { "left": 0, "top": 0, "width": 480, "height": 600 }, "placement": { "left": 0, "top": 0, "width": 400, "height": 600 },
"background": { "color": { "fixed": "transparent" } }, "background": { "color": { "fixed": "transparent" } },
"border": { "color": { "fixed": "dark-green" } }, "border": { "color": { "fixed": "dark-green" } },
"elements": [ "elements": [
@@ -405,7 +405,7 @@
{ {
"name": "Readout Level Label", "name": "Readout Level Label",
"type": "text", "type": "text",
"placement": { "top": 562, "left": 8, "width": 70, "height": 16 }, "placement": { "top": 562, "left": 4, "width": 50, "height": 16 },
"background": { "color": { "fixed": "transparent" } }, "background": { "color": { "fixed": "transparent" } },
"border": { "color": { "fixed": "transparent" }, "width": 0 }, "border": { "color": { "fixed": "transparent" }, "width": 0 },
"config": { "text": { "mode": "fixed", "fixed": "level" }, "color": { "fixed": "#888888" }, "size": 10, "align": "right", "valign": "middle" } "config": { "text": { "mode": "fixed", "fixed": "level" }, "color": { "fixed": "#888888" }, "size": 10, "align": "right", "valign": "middle" }
@@ -413,7 +413,7 @@
{ {
"name": "Readout Level", "name": "Readout Level",
"type": "metric-value", "type": "metric-value",
"placement": { "top": 562, "left": 82, "width": 86, "height": 16 }, "placement": { "top": 562, "left": 56, "width": 80, "height": 16 },
"background": { "color": { "fixed": "transparent" } }, "background": { "color": { "fixed": "transparent" } },
"border": { "color": { "fixed": "transparent" }, "width": 0 }, "border": { "color": { "fixed": "transparent" }, "width": 0 },
"config": { "text": { "mode": "field", "fixed": "", "field": "level" }, "color": { "fixed": "#1a1a1a" }, "size": 12, "align": "left", "valign": "middle" } "config": { "text": { "mode": "field", "fixed": "", "field": "level" }, "color": { "fixed": "#1a1a1a" }, "size": 12, "align": "left", "valign": "middle" }
@@ -421,7 +421,7 @@
{ {
"name": "Readout Volume Label", "name": "Readout Volume Label",
"type": "text", "type": "text",
"placement": { "top": 562, "left": 168, "width": 60, "height": 16 }, "placement": { "top": 562, "left": 140, "width": 50, "height": 16 },
"background": { "color": { "fixed": "transparent" } }, "background": { "color": { "fixed": "transparent" } },
"border": { "color": { "fixed": "transparent" }, "width": 0 }, "border": { "color": { "fixed": "transparent" }, "width": 0 },
"config": { "text": { "mode": "fixed", "fixed": "volume" }, "color": { "fixed": "#888888" }, "size": 10, "align": "right", "valign": "middle" } "config": { "text": { "mode": "fixed", "fixed": "volume" }, "color": { "fixed": "#888888" }, "size": 10, "align": "right", "valign": "middle" }
@@ -429,7 +429,7 @@
{ {
"name": "Readout Volume", "name": "Readout Volume",
"type": "metric-value", "type": "metric-value",
"placement": { "top": 562, "left": 232, "width": 70, "height": 16 }, "placement": { "top": 562, "left": 192, "width": 80, "height": 16 },
"background": { "color": { "fixed": "transparent" } }, "background": { "color": { "fixed": "transparent" } },
"border": { "color": { "fixed": "transparent" }, "width": 0 }, "border": { "color": { "fixed": "transparent" }, "width": 0 },
"config": { "text": { "mode": "field", "fixed": "", "field": "volume" }, "color": { "fixed": "#1a1a1a" }, "size": 12, "align": "left", "valign": "middle" } "config": { "text": { "mode": "field", "fixed": "", "field": "volume" }, "color": { "fixed": "#1a1a1a" }, "size": 12, "align": "left", "valign": "middle" }
@@ -437,7 +437,7 @@
{ {
"name": "Readout Fill Label", "name": "Readout Fill Label",
"type": "text", "type": "text",
"placement": { "top": 562, "left": 302, "width": 50, "height": 16 }, "placement": { "top": 562, "left": 276, "width": 40, "height": 16 },
"background": { "color": { "fixed": "transparent" } }, "background": { "color": { "fixed": "transparent" } },
"border": { "color": { "fixed": "transparent" }, "width": 0 }, "border": { "color": { "fixed": "transparent" }, "width": 0 },
"config": { "text": { "mode": "fixed", "fixed": "fill" }, "color": { "fixed": "#888888" }, "size": 10, "align": "right", "valign": "middle" } "config": { "text": { "mode": "fixed", "fixed": "fill" }, "color": { "fixed": "#888888" }, "size": 10, "align": "right", "valign": "middle" }
@@ -445,7 +445,7 @@
{ {
"name": "Readout Fill", "name": "Readout Fill",
"type": "metric-value", "type": "metric-value",
"placement": { "top": 562, "left": 356, "width": 70, "height": 16 }, "placement": { "top": 562, "left": 318, "width": 70, "height": 16 },
"background": { "color": { "fixed": "transparent" } }, "background": { "color": { "fixed": "transparent" } },
"border": { "color": { "fixed": "transparent" }, "width": 0 }, "border": { "color": { "fixed": "transparent" }, "width": 0 },
"config": { "text": { "mode": "field", "fixed": "", "field": "volumePercent" }, "color": { "fixed": "#1a1a1a" }, "size": 12, "align": "left", "valign": "middle" } "config": { "text": { "mode": "field", "fixed": "", "field": "volumePercent" }, "color": { "fixed": "#1a1a1a" }, "size": 12, "align": "left", "valign": "middle" }
@@ -472,7 +472,7 @@
}, },
"overrides": [] "overrides": []
}, },
"gridPos": { "h": 10, "w": 12, "x": 12, "y": 6 }, "gridPos": { "h": 10, "w": 14, "x": 10, "y": 6 },
"id": 8, "id": 8,
"options": { "options": {
"legend": { "displayMode": "list", "placement": "bottom" }, "legend": { "displayMode": "list", "placement": "bottom" },
@@ -497,7 +497,7 @@
}, },
"overrides": [] "overrides": []
}, },
"gridPos": { "h": 10, "w": 12, "x": 12, "y": 16 }, "gridPos": { "h": 10, "w": 14, "x": 10, "y": 16 },
"id": 9, "id": 9,
"options": { "options": {
"legend": { "displayMode": "list", "placement": "bottom" }, "legend": { "displayMode": "list", "placement": "bottom" },