Tobias/PiCopy
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Verbessere das Layout der Port- und Explorer-Gitter für eine konsistentere Darstellung

Browse Source
This commit is contained in:
Tobias Leuschner
2026-05-09 01:50:09 +02:00
parent 5f99c53eb6
commit 09209be203
1 changed files with 10 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
app.py
View File

@@ -933,7 +933,8 @@ body{background:var(--bg);color:var(--txt);font-family:-apple-system,BlinkMacSys
.flash.ok{color:var(--grn)}.flash.err{color:var(--red)}
/* ── Port Slots ── */
.port-pair{display:grid;grid-template-columns:1fr 1fr;gap:.85rem}
/* port-pair: immer echtes 1fr 1fr, unabhängig vom Explorer */
.port-pair{display:grid;grid-template-columns:1fr 1fr;gap:.85rem;align-items:start}
@media(max-width:500px){.port-pair{grid-template-columns:1fr}}
.port-slot{border:1.5px solid var(--brd);border-radius:var(--r);padding:.85rem;transition:border-color .2s}
.port-slot.src-on{border-color:var(--grn2)}
@@ -950,12 +951,10 @@ body{background:var(--bg);color:var(--txt);font-family:-apple-system,BlinkMacSys
.hint-box{font-size:.72rem;color:var(--sub);margin-top:.65rem;padding:.45rem .65rem;background:var(--bg2);border-radius:.4rem;border-left:3px solid var(--brd2);line-height:1.5}
/* ── Port+Explorer grid ── */
.pex-grid{display:grid;gap:.85rem;grid-template-columns:1fr 1fr}
@media(max-width:599px){.pex-grid{grid-template-columns:1fr}}
@media(min-width:960px){.pex-grid{grid-template-columns:1fr 1fr 1.35fr}}
/* pex-grid: port-pair links, explorer rechts */
.pex-grid{display:grid;gap:.85rem;grid-template-columns:1fr}
@media(min-width:960px){.pex-grid{grid-template-columns:1fr auto}.pex-grid .expl-wrap{width:320px}}
.expl-wrap{border:1px solid var(--brd);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column}
@media(max-width:959px){.expl-wrap{grid-column:1/-1}}
@media(min-width:960px){.expl-wrap{grid-row:1}}
/* ── File Explorer ── */
.expl-bar{display:flex;align-items:center;gap:.4rem;padding:.55rem .8rem;background:var(--surf2);border-bottom:1px solid var(--brd);flex-shrink:0}
@@ -1083,6 +1082,9 @@ body{background:var(--bg);color:var(--txt);font-family:-apple-system,BlinkMacSys
<div class="card-body">
<div class="pex-grid">
<!-- Quelle + Ziel in eigenem gleichbreiten Grid -->
<div class="port-pair">
<!-- Quelle -->
<div class="port-slot" id="slot-src">
<div class="role-tag src">▲ Quelle</div>
@@ -1133,6 +1135,8 @@ body{background:var(--bg);color:var(--txt);font-family:-apple-system,BlinkMacSys
<div class="hint-box">Gerät in den gewünschten Port → aus Liste wählen → Speichern. Ab dann wird dieser Port immer als Ziel verwendet.</div>
</div>
</div><!-- /port-pair -->
<!-- File Explorer -->
<div class="expl-wrap">
<div class="expl-bar">