diff --git a/app/src/atoms/InputField/index.tsx b/app/src/atoms/InputField/index.tsx index 330bb566ba9..20bd950a3ae 100644 --- a/app/src/atoms/InputField/index.tsx +++ b/app/src/atoms/InputField/index.tsx @@ -73,7 +73,7 @@ export interface InputFieldProps { | typeof TYPOGRAPHY.textAlignCenter /** small or medium input field height, relevant only */ size?: 'medium' | 'small' - /** react useRef for controlling focus on ODD */ + /** react useRef to control input field instead of react event */ ref?: React.MutableRefObject } @@ -175,8 +175,17 @@ export const InputField = React.forwardRef( flex: 1 1 auto; width: 100%; height: 100%; - font-size: ${TYPOGRAPHY.fontSize28}; - line-height: ${TYPOGRAPHY.lineHeight36}; + font-size: ${size === 'small' + ? TYPOGRAPHY.fontSize28 + : TYPOGRAPHY.fontSize38}; + line-height: ${size === 'small' + ? TYPOGRAPHY.lineHeight36 + : TYPOGRAPHY.lineHeight48}; + } + + /* the size of dot for password is handled by font-size */ + input[type='password'] { + font-size: ${size === 'small' ? '71px' : '77px'}; } } `