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:
@@ -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;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user