Add responsive mobile layouts and navigation

This commit is contained in:
2026-09-18 01:09:05 -04:00
parent 453821805a
commit 166f039ae6
21 changed files with 147 additions and 26 deletions
+7 -3
View File
@@ -365,11 +365,11 @@
.picks { display: flex; flex-direction: column; gap: var(--space-2); }
.pick-row {
display: grid;
grid-template-columns: 1fr 1fr auto;
grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto;
gap: var(--space-2);
align-items: center;
}
.pick-select { position: relative; }
.pick-select { position: relative; min-width: 0; }
.native-select {
appearance: none;
width: 100%;
@@ -451,7 +451,7 @@
.chk input { accent-color: var(--accent-primary); cursor: pointer; }
.form-actions { display: flex; align-items: center; gap: var(--space-4); }
.form-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4); }
.flash { color: var(--state-danger); font-family: var(--font-mono); font-size: var(--text-xs); }
.section { display: flex; flex-direction: column; gap: var(--space-3); }
@@ -487,5 +487,9 @@
@media (max-width: 720px) {
.beta-row { grid-template-columns: 1fr; gap: var(--space-2); }
.pick-row { grid-template-columns: minmax(0, 1fr) 44px; }
.pick-select:first-child { grid-column: 1 / -1; }
.chk { min-height: 44px; min-width: 0; }
.chk input { flex-shrink: 0; }
}
</style>