fix(ui/ux): drop the width cap so the tables use the screen

This commit is contained in:
Steppenstreuner
2026-08-31 08:35:13 +02:00
parent 2e84bc8aca
commit b99412737e
+4 -3
View File
@@ -7,7 +7,7 @@
body { background: var(--bg); color: var(--text); font-family: system-ui, sans-serif; } body { background: var(--bg); color: var(--text); font-family: system-ui, sans-serif; }
header { header {
display: flex; align-items: center; gap: 2rem; flex-wrap: wrap; display: flex; align-items: center; gap: 2rem; flex-wrap: wrap;
padding: 0.8rem 1.2rem; background: var(--panel); border-bottom: 1px solid var(--border); padding: 0.8rem; background: var(--panel); border-bottom: 1px solid var(--border);
} }
h1 { font-size: 1.2rem; } h1 { font-size: 1.2rem; }
nav { display: flex; gap: 0.4rem; flex-wrap: wrap; } nav { display: flex; gap: 0.4rem; flex-wrap: wrap; }
@@ -17,7 +17,8 @@ nav button.active, nav button:hover { color: var(--text); background: var(--bg);
background: var(--accent); color: #fff; border-radius: 10px; background: var(--accent); color: #fff; border-radius: 10px;
padding: 0.05rem 0.45rem; font-size: 0.75rem; vertical-align: 0.1em; padding: 0.05rem 0.45rem; font-size: 0.75rem; vertical-align: 0.1em;
} }
main { padding: 1.2rem; max-width: 1100px; margin: 0 auto; } /* no width cap: the import table is the widest thing here and wants the screen */
main { padding: 1rem 0.8rem; }
.bar { display: flex; gap: 0.5rem; align-items: center; margin-bottom: 1rem; } .bar { display: flex; gap: 0.5rem; align-items: center; margin-bottom: 1rem; }
.bar.wrap { flex-wrap: wrap; } .bar.wrap { flex-wrap: wrap; }
input, select { input, select {
@@ -153,7 +154,7 @@ h3, h4 { margin: 0.8rem 0 0.6rem; }
@media (max-width: 700px) { @media (max-width: 700px) {
header { gap: 0.6rem; padding: 0.6rem; } header { gap: 0.6rem; padding: 0.6rem; }
main { padding: 0.8rem; } main { padding: 0.8rem 0.6rem; }
.cards { grid-template-columns: 1fr; } .cards { grid-template-columns: 1fr; }
#quick-dialog { min-width: 0; width: 92vw; } #quick-dialog { min-width: 0; width: 92vw; }
#series-dialog { min-width: 0; width: 92vw; } #series-dialog { min-width: 0; width: 92vw; }