diff --git a/app.py b/app.py index 214f78c..5f28c2b 100644 --- a/app.py +++ b/app.py @@ -207,10 +207,12 @@ HTML = """ header { display:flex; justify-content:space-between; align-items:center; margin-bottom: .5rem; flex-shrink: 0; } a,button { padding:.35rem 0; text-decoration:none; border:1px solid var(--border); border-radius:4px; background:var(--btn-bg); color:var(--text); cursor:pointer; font-size:.9rem; font-weight:bold; min-width:2rem; text-align:center; display:inline-block; } a:hover,button:hover { background:var(--btn-hover); } - #lock-btn { font-weight:normal; } + /* Icon buttons: inline SVG so glyphs render the same on every platform */ + .ibtn { display:inline-flex; align-items:center; justify-content:center; width:2rem; height:2rem; padding:0; } + .ic { width:1.05rem; height:1.05rem; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; pointer-events:none; } #status { font-size:.9rem; opacity:.7; margin-left:.5rem; } - #status::before { content: "●"; margin-right: .3rem; color: #ef4444; } - #status.connected::before { color: #22c55e; } + #status::before { content:""; display:inline-block; width:.55em; height:.55em; border-radius:50%; margin-right:.35rem; background:#ef4444; } + #status.connected::before { background:#22c55e; } #peers { font-size:.95rem; font-weight:bold; margin-left:.5rem; margin-right:.3rem; color:#22c55e; display:none; } #wrap { display:grid; grid-template-columns: max-content 1fr; border:1px solid var(--border); border-radius:4px; overflow:hidden; flex: 1; } @@ -243,16 +245,25 @@ HTML = """ #auth-submit { width:100%; padding:.45rem; background:#000; color:#fff; border:none; border-radius:4px; font-size:.95rem; cursor:pointer; } +
disconnected
- - + - - - β“˜ + + + + +
@@ -282,6 +293,7 @@ HTML = """