diff --git a/native/account/registration/keyserver-selection.react.js b/native/account/registration/keyserver-selection.react.js --- a/native/account/registration/keyserver-selection.react.js +++ b/native/account/registration/keyserver-selection.react.js @@ -50,8 +50,15 @@ customKeyserverTextInputRef.current?.focus(); } }, [customKeyserverEmpty]); + + const [customKeyserverInputFocused, setCustomKeyserverInputFocused] = + React.useState(false); const onCustomKeyserverFocus = React.useCallback(() => { setCurrentSelection('custom'); + setCustomKeyserverInputFocused(true); + }, []); + const onCustomKeyserverBlur = React.useCallback(() => { + setCustomKeyserverInputFocused(false); }, []); let keyserverUsername; @@ -77,6 +84,18 @@ }, [navigate, coolOrNerdMode, keyserverUsername]); const styles = useStyles(unboundStyles); + const keyserverInputStyle = React.useMemo( + () => + customKeyserverInputFocused + ? [styles.keyserverInput, styles.focusedKeyserverInput] + : styles.keyserverInput, + [ + customKeyserverInputFocused, + styles.keyserverInput, + styles.focusedKeyserverInput, + ], + ); + const colors = useColors(); return ( @@ -118,10 +137,11 @@ @@ -168,6 +188,9 @@ borderRadius: 4, padding: 12, }, + focusedKeyserverInput: { + borderColor: 'panelForegroundLabel', + }, }; export default KeyserverSelection;