open.source/manifold
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Turn off autofocus for amount input. (Fixes FR answer bug; IMO better UX)

Browse Source
This commit is contained in:
James Grugett 2022-10-01 13:48:13 -05:00
parent b53e4acea6
commit 759685258a
1 changed files with 1 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
web/components/amount-input.tsx
View File

@ -5,7 +5,6 @@ import { formatMoney } from 'common/util/format'
import { Col } from './layout/col' import { Col } from './layout/col'
import { SiteLink } from './site-link' import { SiteLink } from './site-link'
import { ENV_CONFIG } from 'common/envs/constants' import { ENV_CONFIG } from 'common/envs/constants'
import { useIsMobile } from 'web/hooks/use-is-mobile'
import { Row } from './layout/row' import { Row } from './layout/row'
export function AmountInput(props: { export function AmountInput(props: {
@ -36,8 +35,6 @@ export function AmountInput(props: {
onChange(isInvalid ? undefined : amount) onChange(isInvalid ? undefined : amount)
} }
const isMobile = useIsMobile(768)
return ( return (
<> <>
<Col className={className}> <Col className={className}>
@ -49,7 +46,7 @@ export function AmountInput(props: {
className={clsx( className={clsx(
'placeholder:text-greyscale-4 border-greyscale-2 rounded-md pl-9', 'placeholder:text-greyscale-4 border-greyscale-2 rounded-md pl-9',
error && 'input-error', error && 'input-error',
isMobile ? 'w-24' : '', 'w-24 md:w-auto',
inputClassName inputClassName
)} )}
ref={inputRef} ref={inputRef}
@ -58,7 +55,6 @@ export function AmountInput(props: {
inputMode="numeric" inputMode="numeric"
placeholder="0" placeholder="0"
maxLength={6} maxLength={6}
autoFocus={!isMobile}
value={amount ?? ''} value={amount ?? ''}
disabled={disabled} disabled={disabled}
onChange={(e) => onAmountChange(e.target.value)} onChange={(e) => onAmountChange(e.target.value)}