abrban/cloud-host
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source 
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
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/app/[lang]/dashboard/deploy/page.tsx
+8 -6
View File
@@ -1792,9 +1792,9 @@ export default function DeployPage() {
{form.enableRedis && (
<div className="mt-3 pt-3 border-t border-red-200 space-y-2">
<div className="flex items-center gap-2">
<label className="text-xs text-gray-600">{dw.versionColon}</label>
<label className="text-xs font-medium text-gray-600 shrink-0">{dw.versionColon}</label>
<select
className="text-xs border border-red-200 rounded px-2 py-1 bg-white"
className="select-compact flex-1 min-w-0"
value={form.redisVersion || '7.2'}
onChange={(e) => setForm({ ...form, redisVersion: e.target.value })}
onClick={(e) => e.stopPropagation()}
@@ -1850,11 +1850,12 @@ export default function DeployPage() {
{form.enableRabbitmq && (
<div className="mt-3 pt-3 border-t border-orange-200 space-y-2">
<div className="flex items-center gap-2">
<label className="text-xs text-gray-600">{dw.versionColon}</label>
<label className="text-xs font-medium text-gray-600 shrink-0">{dw.versionColon}</label>
<select
className="text-xs border border-orange-200 rounded px-2 py-1 bg-white"
className="select-compact flex-1 min-w-0"
value={form.rabbitmqVersion || '3.13'}
onChange={(e) => setForm({ ...form, rabbitmqVersion: e.target.value })}
onClick={(e) => e.stopPropagation()}
>
<option value="3.13">3.13 (Latest)</option>
<option value="3.12">3.12 (LTS)</option>
@@ -1894,11 +1895,12 @@ export default function DeployPage() {
{form.enableElasticsearch && (
<div className="mt-3 pt-3 border-t border-yellow-200 space-y-2">
<div className="flex items-center gap-2">
<label className="text-xs text-gray-600">{dw.versionColon}</label>
<label className="text-xs font-medium text-gray-600 shrink-0">{dw.versionColon}</label>
<select
className="text-xs border border-yellow-200 rounded px-2 py-1 bg-white"
className="select-compact flex-1 min-w-0"
value={form.elasticsearchVersion || '8.12'}
onChange={(e) => setForm({ ...form, elasticsearchVersion: e.target.value })}
onClick={(e) => e.stopPropagation()}
>
<option value="8.12">8.12 (Latest)</option>
<option value="8.11">8.11</option>