Fix mobile select zoom and unify optional-service version pickers.

Form controls smaller than 16px made iOS Safari auto-zoom on focus,
shifting page content upward. Enforce a 16px minimum font-size on
inputs/selects/textareas at mobile widths. Also replace the three tiny,
inconsistently-styled (colored-border, text-xs) version pickers in the
deploy wizard's optional-services cards with a shared .select-compact
style so they match the rest of the form.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
keyhan
2026-06-12 12:33:41 +03:30
parent aa3e62d0ff
commit aa7ff3d26d
2 changed files with 25 additions and 6 deletions
+17
View File
@@ -68,6 +68,13 @@
focus:outline-none focus:ring-2 focus:ring-primary-500/20 focus:border-primary-500
transition-all duration-150;
}
/* Compact, design-consistent select for inline rows (e.g. version pickers). */
.select-compact {
@apply rounded-lg border border-gray-300 bg-white px-2.5 py-1.5 text-sm shadow-sm
text-gray-800 cursor-pointer
focus:outline-none focus:ring-2 focus:ring-primary-500/20 focus:border-primary-500
transition-all duration-150;
}
/* ─── Cards ──────────────────────────────────────────── */
.card {
@@ -220,3 +227,13 @@ html.lenis body {
animation: none;
}
}
/* Mobile: keep form controls at a 16px minimum so iOS Safari doesn't auto-zoom
(and shift the page contents up) when a field/select is focused. */
@media (max-width: 640px) {
input:not([type='checkbox']):not([type='radio']):not([type='range']),
select,
textarea {
font-size: 16px !important;
}
}