responsive nav buttons #83

Merged
GigiMamaladze merged 2 commits from guga into main 2025-05-10 08:00:12 +00:00
3 changed files with 205 additions and 217 deletions

View File

@ -6,9 +6,9 @@
"$": [ "$": [
"ts", "ts",
192, 192,
1745564494359 1746620492354
], ],
"$ts": 1745564494355 "$ts": 1746620492354
} }
} }
}, },
@ -63,8 +63,8 @@
"name": "Image" "name": "Image"
}, },
"position": { "position": {
"height": 1028, "height": 1,
"width": 1850 "width": 1
}, },
"propConfig": { "propConfig": {
"props.source": { "props.source": {
@ -88,10 +88,10 @@
"name": "MCM01_Button" "name": "MCM01_Button"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 200, "width": 0.1178,
"x": 25.9758, "x": 0.0043,
"y": 629.298 "y": 0.6122
}, },
"props": { "props": {
"params": { "params": {
@ -108,10 +108,10 @@
"name": "MCM02_Button" "name": "MCM02_Button"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 200, "width": 0.1178,
"x": 30.3125, "x": 0.0067,
"y": 121.365 "y": 0.1181
}, },
"props": { "props": {
"params": { "params": {
@ -128,10 +128,10 @@
"name": "MCM03_Button" "name": "MCM03_Button"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 200, "width": 0.1081,
"x": 669.02, "x": 0.3616,
"y": 188.15 "y": 0.183
}, },
"props": { "props": {
"params": { "params": {
@ -148,13 +148,13 @@
"name": "MCM04_Button" "name": "MCM04_Button"
}, },
"position": { "position": {
"height": 53, "height": 0.0516,
"rotate": { "rotate": {
"anchor": "50% -165%" "anchor": "50% -165%"
}, },
"width": 200, "width": 0.1081,
"x": 1172.74, "x": 0.6339,
"y": 158.249 "y": 0.1539
}, },
"props": { "props": {
"params": { "params": {
@ -171,10 +171,10 @@
"name": "MCM04_Chutes_Button" "name": "MCM04_Chutes_Button"
}, },
"position": { "position": {
"height": 53, "height": 0.0516,
"width": 200, "width": 0.1297,
"x": 886.968, "x": 0.4578,
"y": 40.1 "y": 0.039
}, },
"props": { "props": {
"params": { "params": {
@ -191,13 +191,13 @@
"name": "MCM05_Button" "name": "MCM05_Button"
}, },
"position": { "position": {
"height": 53, "height": 0.0516,
"rotate": { "rotate": {
"anchor": "50% 369%" "anchor": "50% 369%"
}, },
"width": 200, "width": 0.1314,
"x": 665.5168237304688, "x": 0.3365,
"y": 710.213294921875 "y": 0.6909
}, },
"props": { "props": {
"params": { "params": {
@ -214,13 +214,13 @@
"name": "MCM05_Chutes_Button" "name": "MCM05_Chutes_Button"
}, },
"position": { "position": {
"height": 53, "height": 0.0516,
"rotate": { "rotate": {
"anchor": "15% 50%" "anchor": "15% 50%"
}, },
"width": 200, "width": 0.1081,
"x": 943.2091186523437, "x": 0.5098,
"y": 959.35 "y": 0.9332
}, },
"props": { "props": {
"params": { "params": {
@ -237,10 +237,10 @@
"name": "MCM06_Button" "name": "MCM06_Button"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 200, "width": 0.1081,
"x": 1411.73, "x": 0.7631,
"y": 439.98 "y": 0.428
}, },
"props": { "props": {
"params": { "params": {
@ -257,10 +257,10 @@
"name": "MCM07_Button" "name": "MCM07_Button"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 200, "width": 0.1081,
"x": 1334.6661230468749, "x": 0.7214,
"y": 685.8091870117187 "y": 0.6671
}, },
"props": { "props": {
"params": { "params": {
@ -277,10 +277,10 @@
"name": "Camera_37" "name": "Camera_37"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 209.08, "x": 0.113,
"y": 30.98 "y": 0.0301
}, },
"props": { "props": {
"params": { "params": {
@ -309,10 +309,10 @@
"name": "Camera_1" "name": "Camera_1"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 330.08, "x": 0.1784,
"y": 69.98 "y": 0.0681
}, },
"props": { "props": {
"params": { "params": {
@ -341,10 +341,10 @@
"name": "Camera_2" "name": "Camera_2"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 267.08, "x": 0.1444,
"y": 358.98 "y": 0.3492
}, },
"props": { "props": {
"params": { "params": {
@ -373,10 +373,10 @@
"name": "Camera_3" "name": "Camera_3"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 227.08, "x": 0.1227,
"y": 879.98 "y": 0.856
}, },
"props": { "props": {
"params": { "params": {
@ -405,10 +405,10 @@
"name": "Camera_4" "name": "Camera_4"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 577.08, "x": 0.3119,
"y": 849.98 "y": 0.8268
}, },
"props": { "props": {
"params": { "params": {
@ -437,10 +437,10 @@
"name": "Camera_5" "name": "Camera_5"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 798.08, "x": 0.4314,
"y": 853.98 "y": 0.8307
}, },
"props": { "props": {
"params": { "params": {
@ -469,10 +469,10 @@
"name": "Camera_6" "name": "Camera_6"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 921.08, "x": 0.4979,
"y": 886.98 "y": 0.8628
}, },
"props": { "props": {
"params": { "params": {
@ -501,10 +501,10 @@
"name": "Camera_7" "name": "Camera_7"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1019.08, "x": 0.5509,
"y": 913.98 "y": 0.8891
}, },
"props": { "props": {
"params": { "params": {
@ -533,10 +533,10 @@
"name": "Camera_8" "name": "Camera_8"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1629.08, "x": 0.8806,
"y": 863.98 "y": 0.8404
}, },
"props": { "props": {
"params": { "params": {
@ -565,10 +565,10 @@
"name": "Camera_9" "name": "Camera_9"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1560.08, "x": 0.8433,
"y": 597.98 "y": 0.5817
}, },
"props": { "props": {
"params": { "params": {
@ -597,10 +597,10 @@
"name": "Camera_10" "name": "Camera_10"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1560.08, "x": 0.8433,
"y": 477.98 "y": 0.465
}, },
"props": { "props": {
"params": { "params": {
@ -629,10 +629,10 @@
"name": "Camera_11" "name": "Camera_11"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1490.08, "x": 0.8054,
"y": 289.98 "y": 0.2821
}, },
"props": { "props": {
"params": { "params": {
@ -661,10 +661,10 @@
"name": "Camera_12" "name": "Camera_12"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1633.08, "x": 0.8827,
"y": 100.98 "y": 0.0982
}, },
"props": { "props": {
"params": { "params": {
@ -693,10 +693,10 @@
"name": "Camera_13" "name": "Camera_13"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1020.0799999999999, "x": 0.5514,
"y": 101.98 "y": 0.0992
}, },
"props": { "props": {
"params": { "params": {
@ -725,10 +725,10 @@
"name": "Camera_14" "name": "Camera_14"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 613.08, "x": 0.3314,
"y": 103.98 "y": 0.1011
}, },
"props": { "props": {
"params": { "params": {
@ -757,10 +757,10 @@
"name": "Camera_15" "name": "Camera_15"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 855.08, "x": 0.4622,
"y": 305.98 "y": 0.2976
}, },
"props": { "props": {
"params": { "params": {
@ -789,10 +789,10 @@
"name": "Camera_16" "name": "Camera_16"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1300.08, "x": 0.7027,
"y": 325.98 "y": 0.3171
}, },
"props": { "props": {
"params": { "params": {
@ -821,10 +821,10 @@
"name": "Camera_17" "name": "Camera_17"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1390.08, "x": 0.7514,
"y": 474.98 "y": 0.462
}, },
"props": { "props": {
"params": { "params": {
@ -853,10 +853,10 @@
"name": "Camera_18" "name": "Camera_18"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 403.08, "x": 0.2179,
"y": 212.98 "y": 0.2072
}, },
"props": { "props": {
"params": { "params": {
@ -885,10 +885,10 @@
"name": "Camera_19" "name": "Camera_19"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 604.08, "x": 0.3265,
"y": 208.98 "y": 0.2033
}, },
"props": { "props": {
"params": { "params": {
@ -917,10 +917,10 @@
"name": "Camera_20" "name": "Camera_20"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 530.08, "x": 0.2865,
"y": 385.98 "y": 0.3755
}, },
"props": { "props": {
"params": { "params": {
@ -949,10 +949,10 @@
"name": "Camera_21" "name": "Camera_21"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 607.08, "x": 0.3282,
"y": 452.98 "y": 0.4406
}, },
"props": { "props": {
"params": { "params": {
@ -981,10 +981,10 @@
"name": "Camera_22" "name": "Camera_22"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 812.08, "x": 0.439,
"y": 413.98 "y": 0.4027
}, },
"props": { "props": {
"params": { "params": {
@ -1013,10 +1013,10 @@
"name": "Camera_23" "name": "Camera_23"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 570.08, "x": 0.3082,
"y": 614.98 "y": 0.5982
}, },
"props": { "props": {
"params": { "params": {
@ -1045,10 +1045,10 @@
"name": "Camera_24" "name": "Camera_24"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 691.08, "x": 0.3736,
"y": 611.98 "y": 0.5953
}, },
"props": { "props": {
"params": { "params": {
@ -1077,10 +1077,10 @@
"name": "Camera_25" "name": "Camera_25"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 582.08, "x": 0.3146,
"y": 718.98 "y": 0.6994
}, },
"props": { "props": {
"params": { "params": {
@ -1109,10 +1109,10 @@
"name": "Camera_26" "name": "Camera_26"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 815.08, "x": 0.4406,
"y": 615.98 "y": 0.5992
}, },
"props": { "props": {
"params": { "params": {
@ -1141,10 +1141,10 @@
"name": "Camera_27" "name": "Camera_27"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 923.08, "x": 0.499,
"y": 542.98 "y": 0.5282
}, },
"props": { "props": {
"params": { "params": {
@ -1173,10 +1173,10 @@
"name": "Camera_28" "name": "Camera_28"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1232.08, "x": 0.666,
"y": 485.98 "y": 0.4727
}, },
"props": { "props": {
"params": { "params": {
@ -1205,10 +1205,10 @@
"name": "Camera_29" "name": "Camera_29"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1295.08, "x": 0.7,
"y": 509.98 "y": 0.4961
}, },
"props": { "props": {
"params": { "params": {
@ -1237,10 +1237,10 @@
"name": "Camera_30" "name": "Camera_30"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1207.08, "x": 0.6525,
"y": 685.98 "y": 0.6673
}, },
"props": { "props": {
"params": { "params": {
@ -1269,10 +1269,10 @@
"name": "Camera_31" "name": "Camera_31"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 667.08, "x": 0.3606,
"y": 480.98 "y": 0.4679
}, },
"props": { "props": {
"params": { "params": {
@ -1301,10 +1301,10 @@
"name": "Camera_32" "name": "Camera_32"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 307.08, "x": 0.166,
"y": 783.98 "y": 0.7626
}, },
"props": { "props": {
"params": { "params": {
@ -1333,10 +1333,10 @@
"name": "Camera_33" "name": "Camera_33"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1119.08, "x": 0.6049,
"y": 883.98 "y": 0.8599
}, },
"props": { "props": {
"params": { "params": {
@ -1365,10 +1365,10 @@
"name": "Camera_34" "name": "Camera_34"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 1235.08, "x": 0.6676,
"y": 357.98 "y": 0.3482
}, },
"props": { "props": {
"params": { "params": {
@ -1397,10 +1397,10 @@
"name": "Camera_35" "name": "Camera_35"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 453.08, "x": 0.2449,
"y": 257.98 "y": 0.251
}, },
"props": { "props": {
"params": { "params": {
@ -1429,10 +1429,10 @@
"name": "Camera_36" "name": "Camera_36"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"width": 35, "width": 0.0189,
"x": 702.08, "x": 0.3795,
"y": 247.98 "y": 0.2412
}, },
"props": { "props": {
"params": { "params": {
@ -1472,13 +1472,13 @@
"name": "BG-Sorter_Button" "name": "BG-Sorter_Button"
}, },
"position": { "position": {
"height": 35, "height": 0.034,
"rotate": { "rotate": {
"anchor": "50% -81%" "anchor": "50% -81%"
}, },
"width": 200, "width": 0.1081,
"x": 62.18806779785156, "x": 0.0336,
"y": 358.677294921875 "y": 0.3489
}, },
"props": { "props": {
"params": { "params": {
@ -1494,6 +1494,7 @@
"name": "root" "name": "root"
}, },
"props": { "props": {
"mode": "percent",
"style": { "style": {
"backgroundColor": "#EEEEEE" "backgroundColor": "#EEEEEE"
} }

View File

@ -43,7 +43,7 @@
"name": "Button" "name": "Button"
}, },
"position": { "position": {
"basis": "120px", "basis": "80%",
"grow": 1 "grow": 1
}, },
"propConfig": { "propConfig": {
@ -59,26 +59,9 @@
"props": { "props": {
"style": { "style": {
"backgroundColor": "#FFFFFF", "backgroundColor": "#FFFFFF",
"borderBottomColor": "#555555", "borderStyle": "solid",
"borderBottomLeftRadius": 8, "borderWidth": "0.5px",
"borderBottomRightRadius": 8, "cursor": "pointer"
"borderBottomStyle": "solid",
"borderBottomWidth": 4,
"borderLeftColor": "#000000",
"borderLeftStyle": "solid",
"borderLeftWidth": 1.5,
"borderRightColor": "#555555",
"borderRightStyle": "solid",
"borderRightWidth": 3,
"borderTopColor": "#000000",
"borderTopLeftRadius": 8,
"borderTopRightRadius": 8,
"borderTopStyle": "solid",
"borderTopWidth": 1.5,
"cursor": "pointer",
"outlineColor": "#000000",
"outlineStyle": "none",
"outlineWidth": "3"
}, },
"textStyle": { "textStyle": {
"color": "#000000", "color": "#000000",
@ -94,8 +77,8 @@
"name": "Main_Panel" "name": "Main_Panel"
}, },
"position": { "position": {
"basis": "35px", "basis": "20%",
"shrink": 0 "grow": 1
}, },
"propConfig": { "propConfig": {
"props.params.tagProps[0]": { "props.params.tagProps[0]": {
@ -131,6 +114,10 @@
"meta": { "meta": {
"name": "root" "name": "root"
}, },
"props": {
"alignContent": "flex-start",
"justify": "center"
},
"type": "ia.container.flex" "type": "ia.container.flex"
} }
} }

View File

@ -10,7 +10,7 @@
"priority": 0, "priority": 0,
"priority_string": "No active alarms", "priority_string": "No active alarms",
"running_status": 0, "running_status": 0,
"searchId": "value", "searchId": "PLC01",
"state": 5, "state": 5,
"state_string": "Unknown" "state_string": "Unknown"
}, },
@ -371,7 +371,7 @@
"path": "material/offline_bolt", "path": "material/offline_bolt",
"style": { "style": {
"borderColor": "#000000", "borderColor": "#000000",
"borderStyle": "solid", "borderStyle": "none",
"borderWidth": "2px" "borderWidth": "2px"
} }
}, },