feat(diarization-ui): improve full-app mobile responsiveness (smartphone layout)

This commit is contained in:
2026-03-22 07:43:09 +01:00
parent 9f2b374df0
commit b20a459972

22
app.py
View File

@@ -158,7 +158,27 @@ pre{{white-space:pre-wrap;background:#0f172a;color:#a7f3d0;padding:12px;border-r
.row{{display:flex;gap:8px;flex-wrap:wrap;align-items:center}}
small{{color:var(--muted)}}
.hint{{color:var(--muted);font-size:13px}}
@media (max-width:900px){{nav{{width:76px;padding:8px}} nav a span{{display:none}} .brand{{font-size:11px}} .topbar h1{{font-size:15px}} main{{padding:10px}}}}
@media (max-width:1100px){{
nav{{width:84px;padding:8px}}
nav a span{{display:none}}
.brand{{font-size:11px}}
.topbar h1{{font-size:15px}}
main{{padding:10px}}
}}
@media (max-width:760px){{
body{{display:block}}
nav{{position:fixed;left:0;right:0;bottom:0;top:auto;height:64px;width:100%;display:flex;align-items:center;overflow:auto;white-space:nowrap;padding:6px 8px;z-index:50}}
.brand,.navsection{{display:none}}
nav a{{margin:0 4px;min-width:auto;padding:8px 10px}}
nav a span{{display:inline}}
nav a span:last-child{{display:none}}
.app{{padding-bottom:72px}}
.topbar{{position:sticky;top:0}}
main{{padding:10px 8px}}
.row{{flex-direction:column;align-items:stretch}}
input,select,textarea,button{{width:100%}}
.grid{{min-width:640px}}
}}
.modal-backdrop{{position:fixed;inset:0;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;z-index:2000}}
.modal{{width:min(92vw,520px);background:#fff;border:1px solid #cbd5e1;border-radius:14px;padding:14px;box-shadow:0 24px 60px rgba(0,0,0,.25)}}
.modal h4{{margin:0 0 8px 0}}