jobe/wago-modbustcp-simulator-py
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

🚧 WIP

Browse Source
This commit is contained in:
Jonas Bengtsson
2026-10-04 10:01:49 +02:00
parent 4adbb4171e
commit c1d232581f
15 changed files with 649 additions and 39 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/wago_sim/webui/static/style.css
+71 -7
View File
@@ -87,11 +87,23 @@ h2 { margin: 4px 0 14px; }
position: relative;
padding-top: 16px;
}
.module {
/* label stacks (LED + code, or code + lim LEDs + bar + num) are
taller than the bare indicators; keep the rail visually even */
min-height: 124px;
}
.mod-head {
position: absolute; top: 2px; left: 5px;
font-size: 0.62rem; color: #33414f; font-weight: 600;
letter-spacing: 0.02em; white-space: nowrap;
}
.mod-designation {
/* kind+slot designation (DI0, DO2, AI4) — upper right corner,
same size and vertical alignment as the article number */
position: absolute; top: 2px; right: 5px;
font-size: 0.62rem; color: #33414f; font-weight: 600;
letter-spacing: 0.02em;
}
.coupler { min-width: 96px; background: linear-gradient(#0d5db4, #003a7a); }
.coupler .mod-head { color: #fff; font-size: 0.75rem; }
.coupler-leds { display: flex; gap: 7px; padding: 42px 10px 0; }
@@ -109,6 +121,17 @@ h2 { margin: 4px 0 14px; }
padding: 8px 6px 8px;
}
/* DI/DO LED cells with channel-number labels (FR-10.2.2) */
.led-cell {
display: inline-flex; flex-direction: column;
align-items: center; gap: 2px; cursor: pointer;
}
.led-label {
font-size: 0.55rem; color: #33414f;
font-family: Consolas, monospace;
white-space: nowrap; line-height: 1;
}
/* channel LEDs */
.led {
width: 12px; height: 12px; border-radius: 50%;
@@ -123,24 +146,54 @@ h2 { margin: 4px 0 14px; }
box-shadow: 0 0 9px 2px rgba(70, 230, 80, 0.8);
}
/* analog bars */
/* analog bars (FR-10.2.14: range-scaled vertical fill + limit LEDs) */
.abar-cell {
position: relative;
display: inline-flex;
flex-direction: column;
align-items: center;
gap: 1px;
cursor: pointer;
}
.abar-label {
font-size: 0.55rem; color: #33414f;
font-family: Consolas, monospace;
white-space: nowrap; line-height: 1;
}
.abar {
position: relative;
width: 16px; height: 48px;
background: #232c36;
border-radius: 3px;
overflow: hidden;
cursor: pointer;
overflow: hidden; /* clip the fill inside the rounded bar */
display: inline-block;
}
.abar-fill {
position: absolute; bottom: 0; left: 0; right: 0; height: 0;
position: absolute; bottom: 0; left: 0; right: 0; height: 0%;
background: linear-gradient(#4db6ff, #0d6eb4);
border-radius: 0 0 3px 3px;
transition: height 0.15s;
}
.abar-fill.limit { /* under/overflow: red limit fill */
background: linear-gradient(#ff6b5e, #c62828);
}
.lim-led {
width: 8px; height: 4px;
border-radius: 2px;
background: #3a2b2b;
}
.lim-led.lim-over { order: 0; } /* directly above the bar */
.lim-led.lim-under { order: 2; } /* directly below the bar */
.abar-label.top-label { order: -1; } /* I/O code above the overflow LED */
.abar-label.bottom-label { order: 3; } /* I/O code below the underflow LED */
.abar { order: 1; }
.abar-num {
position: absolute; top: 50px; left: 50%;
transform: translateX(-50%);
font-size: 0.55rem; color: #33414f;
order: 4;
font-size: 0.55rem; color: #33414f; white-space: nowrap;
}
.lim-led.on {
background: #ff3b30;
box-shadow: 0 0 6px 1px rgba(255, 59, 48, 0.8);
}
.rail-detail { margin-top: 10px; font-size: 0.8rem; color: #55606c; }
@@ -248,5 +301,16 @@ button.primary:hover { background: #1b5e20; }
padding: 5px 8px; border: 1px solid #c5ccd4; border-radius: 4px;
font-size: 0.85rem; width: 100%;
}
.range-row {
display: grid; grid-template-columns: 70px 1fr; gap: 8px;
align-items: center; padding: 2px 0;
}
.range-fields { display: flex; align-items: center; gap: 6px; }
.range-fields input {
width: 90px; padding: 5px 8px; border: 1px solid #c5ccd4;
border-radius: 4px; font-size: 0.85rem;
font-family: Consolas, monospace;
}
.range-sep { color: #6b7684; }
.hidden-file { display: none; }
#cfg-io-buttons { display: flex; gap: 8px; margin-top: 8px; }