Skip to content

Commit 6b45cb7

Browse files
committed
Fix: Prevent mobile auto-zoom on input focus by setting font-size to 16px (text-base)
1 parent af667ba commit 6b45cb7

5 files changed

Lines changed: 14 additions & 14 deletions

File tree

web/src/app/(main)/ask/page.tsx

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -252,7 +252,7 @@ export default function AskPage() {
252252
value={newTicketSubject}
253253
onChange={(e) => setNewTicketSubject(e.target.value)}
254254
placeholder="e.g., Guidance on Meditation Practice"
255-
className="w-full bg-gray-50 border border-gray-100 rounded-2xl p-2.5 focus:ring-4 focus:ring-ochre/10 focus:border-ochre outline-none transition-all text-sm font-medium"
255+
className="w-full bg-gray-50 border border-gray-100 rounded-2xl p-2.5 focus:ring-4 focus:ring-ochre/10 focus:border-ochre outline-none transition-all text-base font-medium"
256256
/>
257257
</div>
258258
<div className="space-y-1.5">
@@ -263,7 +263,7 @@ export default function AskPage() {
263263
value={newTicketMessage}
264264
onChange={(e) => setNewTicketMessage(e.target.value)}
265265
placeholder="Please share your spiritual question or request for guidance in detail..."
266-
className="w-full bg-gray-50 border border-gray-100 rounded-2xl p-3.5 focus:ring-4 focus:ring-ochre/10 focus:border-ochre outline-none transition-all text-sm leading-relaxed resize-none font-medium"
266+
className="w-full bg-gray-50 border border-gray-100 rounded-2xl p-3.5 focus:ring-4 focus:ring-ochre/10 focus:border-ochre outline-none transition-all text-base leading-relaxed resize-none font-medium"
267267
/>
268268
</div>
269269
<button
@@ -314,15 +314,15 @@ export default function AskPage() {
314314
value={newTicketSubject}
315315
onChange={(e) => setNewTicketSubject(e.target.value)}
316316
placeholder="Topic of Spiritual Inquiry..."
317-
className="w-full bg-white border border-gray-100 rounded-xl px-3 py-2 text-sm focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none font-medium"
317+
className="w-full bg-white border border-gray-100 rounded-xl px-3 py-2 text-base focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none font-medium"
318318
/>
319319
<textarea
320320
required
321321
rows={3}
322322
value={newTicketMessage}
323323
onChange={(e) => setNewTicketMessage(e.target.value)}
324324
placeholder="Share your spiritual query or request guidance..."
325-
className="w-full bg-white border border-gray-100 rounded-xl px-3 py-2 text-sm focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none font-medium resize-none"
325+
className="w-full bg-white border border-gray-100 rounded-xl px-3 py-2 text-base focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none font-medium resize-none"
326326
/>
327327
<button
328328
type="submit"
@@ -506,7 +506,7 @@ export default function AskPage() {
506506
onChange={(e) => setFollowUpText(prev => ({ ...prev, [expandedTicketId!]: e.target.value }))}
507507
placeholder="Type your clarifying question here..."
508508
rows={2}
509-
className="w-full border-none bg-gray-50 rounded-xl p-3 text-sm font-medium focus:ring-2 focus:ring-ochre/20 outline-none resize-none mb-3"
509+
className="w-full border-none bg-gray-50 rounded-xl p-3 text-base font-medium focus:ring-2 focus:ring-ochre/20 outline-none resize-none mb-3"
510510
/>
511511
<div className="flex items-center justify-between gap-3">
512512
<button

web/src/components/admin/BodhakathaForm.tsx

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -135,7 +135,7 @@ export default function BodhakathaForm({ bodhakatha }: BodhakathaFormProps) {
135135
<label className="text-[10px] md:text-xs font-black text-gray-400 uppercase tracking-widest">Theme</label>
136136
<input
137137
required
138-
className="w-full px-3 py-2.5 md:p-2 border border-gray-100 bg-gray-50/50 rounded-xl focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none text-sm md:text-base transition-all"
138+
className="w-full px-3 py-2.5 md:p-2 border border-gray-100 bg-gray-50/50 rounded-xl focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none text-base transition-all"
139139
value={formData.theme}
140140
onChange={(e) => setFormData({ ...formData, theme: e.target.value })}
141141
/>
@@ -145,7 +145,7 @@ export default function BodhakathaForm({ bodhakatha }: BodhakathaFormProps) {
145145
<label className="text-[10px] md:text-xs font-black text-gray-400 uppercase tracking-widest">Title (English)</label>
146146
<input
147147
required
148-
className="w-full px-3 py-2.5 md:p-2 border border-gray-100 bg-gray-50/50 rounded-xl focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none text-sm md:text-base transition-all"
148+
className="w-full px-3 py-2.5 md:p-2 border border-gray-100 bg-gray-50/50 rounded-xl focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none text-base transition-all"
149149
value={formData.title_english}
150150
onChange={(e) => setFormData({ ...formData, title_english: e.target.value })}
151151
/>
@@ -154,7 +154,7 @@ export default function BodhakathaForm({ bodhakatha }: BodhakathaFormProps) {
154154
<label className="text-[10px] md:text-xs font-black text-gray-400 uppercase tracking-widest">Title (Hindi)</label>
155155
<input
156156
required
157-
className="w-full px-3 py-2.5 md:p-2 border border-gray-100 bg-gray-50/50 rounded-xl focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none font-serif text-sm md:text-base transition-all"
157+
className="w-full px-3 py-2.5 md:p-2 border border-gray-100 bg-gray-50/50 rounded-xl focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none font-serif text-base transition-all"
158158
value={formData.title_hindi}
159159
onChange={(e) => setFormData({ ...formData, title_hindi: e.target.value })}
160160
/>
@@ -198,7 +198,7 @@ export default function BodhakathaForm({ bodhakatha }: BodhakathaFormProps) {
198198
id="description-textarea"
199199
required
200200
rows={14}
201-
className="w-full px-3 py-4 md:p-3 border-none bg-gray-50/30 rounded-xl focus:ring-0 outline-none text-sm leading-relaxed transition-all resize-none font-mono"
201+
className="w-full px-3 py-4 md:p-3 border-none bg-gray-50/30 rounded-xl focus:ring-0 outline-none text-base leading-relaxed transition-all resize-none font-mono"
202202
placeholder="Type the spiritual story here... Use Markdown for styling."
203203
value={formData.description}
204204
onChange={(e) => setFormData({ ...formData, description: e.target.value })}

web/src/components/admin/GlossaryForm.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -97,7 +97,7 @@ export default function GlossaryForm({ glossary }: GlossaryFormProps) {
9797
required
9898
rows={6}
9999
placeholder="Enter the spiritual meaning or context..."
100-
className="w-full px-4 py-4 border border-gray-100 bg-gray-50/30 rounded-2xl focus:ring-4 focus:ring-ochre/10 focus:border-ochre outline-none text-[15px] leading-relaxed font-medium transition-all resize-none shadow-inner"
100+
className="w-full px-4 py-4 border border-gray-100 bg-gray-50/30 rounded-2xl focus:ring-4 focus:ring-ochre/10 focus:border-ochre outline-none text-base leading-relaxed font-medium transition-all resize-none shadow-inner"
101101
value={formData.definition_en}
102102
onChange={(e) => setFormData({ ...formData, definition_en: e.target.value })}
103103
/>

web/src/components/admin/LeelaForm.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -136,7 +136,7 @@ export default function LeelaForm({ leela }: LeelaFormProps) {
136136
<label className="text-[10px] md:text-xs font-black text-gray-400 uppercase tracking-widest">Title (English)</label>
137137
<input
138138
required
139-
className="w-full px-3 py-2.5 md:p-2 border border-gray-100 bg-gray-50/50 rounded-xl focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none text-sm md:text-base transition-all"
139+
className="w-full px-3 py-2.5 md:p-2 border border-gray-100 bg-gray-50/50 rounded-xl focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none text-base transition-all"
140140
value={formData.title_english}
141141
onChange={(e) => setFormData({ ...formData, title_english: e.target.value })}
142142
/>
@@ -145,7 +145,7 @@ export default function LeelaForm({ leela }: LeelaFormProps) {
145145
<label className="text-[10px] md:text-xs font-black text-gray-400 uppercase tracking-widest">Title (Hindi)</label>
146146
<input
147147
required
148-
className="w-full px-3 py-2.5 md:p-2 border border-gray-100 bg-gray-50/50 rounded-xl focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none font-serif text-sm md:text-base transition-all"
148+
className="w-full px-3 py-2.5 md:p-2 border border-gray-100 bg-gray-50/50 rounded-xl focus:ring-2 focus:ring-ochre/20 focus:border-ochre outline-none font-serif text-base transition-all"
149149
value={formData.title_hindi}
150150
onChange={(e) => setFormData({ ...formData, title_hindi: e.target.value })}
151151
/>
@@ -189,7 +189,7 @@ export default function LeelaForm({ leela }: LeelaFormProps) {
189189
id="description-textarea"
190190
required
191191
rows={14}
192-
className="w-full px-3 py-4 md:p-3 border-none bg-gray-50/30 rounded-xl focus:ring-0 outline-none text-sm leading-relaxed transition-all resize-none font-mono"
192+
className="w-full px-3 py-4 md:p-3 border-none bg-gray-50/30 rounded-xl focus:ring-0 outline-none text-base leading-relaxed transition-all resize-none font-mono"
193193
placeholder="Type the leela content here... Use Markdown for styling."
194194
value={formData.description}
195195
onChange={(e) => setFormData({ ...formData, description: e.target.value })}

web/src/components/features/SearchBar.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,7 @@ export default function SearchBar({ value, onChange, placeholder = 'Search...' }
1616
value={value}
1717
onChange={(e) => onChange(e.target.value)}
1818
placeholder={placeholder}
19-
className="w-full pl-10 pr-10 py-2 border border-gray-200 rounded-full focus:outline-none focus:ring-2 focus:ring-ochre focus:border-transparent transition-all"
19+
className="w-full pl-10 pr-10 py-2 border border-gray-200 rounded-full focus:outline-none focus:ring-2 focus:ring-ochre focus:border-transparent transition-all text-base"
2020
/>
2121
<Search className="absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-gray-400" />
2222
{value && (

0 commit comments

Comments
 (0)