diff --git a/assets/icons/colorPalette_stroke2_corner0_rounded.svg b/assets/icons/colorPalette_stroke2_corner0_rounded.svg
new file mode 100644
index 0000000000..b1056e1a96
--- /dev/null
+++ b/assets/icons/colorPalette_stroke2_corner0_rounded.svg
@@ -0,0 +1 @@
+
diff --git a/src/components/forms/TextField.tsx b/src/components/forms/TextField.tsx
index 00abc8a5d2..10e0a8a6f5 100644
--- a/src/components/forms/TextField.tsx
+++ b/src/components/forms/TextField.tsx
@@ -10,8 +10,9 @@ import {
AccessibilityProps,
} from 'react-native'
+import {HITSLOP_20} from 'lib/constants'
import {isWeb} from '#/platform/detection'
-import {useTheme, atoms as a, web, tokens} from '#/alf'
+import {useTheme, atoms as a, web, tokens, android} from '#/alf'
import {Text} from '#/components/Typography'
import {useInteractionState} from '#/components/hooks/useInteractionState'
import {Props as SVGIconProps} from '#/components/icons/common'
@@ -95,7 +96,11 @@ export function Root({children, isInvalid = false}: RootProps) {
},
]}
// onPressIn/out don't work on android web
- onPress={() => inputRef.current?.focus()}
+ onPress={e => {
+ e.preventDefault()
+ e.stopPropagation()
+ inputRef.current?.focus()
+ }}
onHoverIn={onHoverIn}
onHoverOut={onHoverOut}>
{children}
@@ -195,6 +200,7 @@ export function createInput(Component: typeof TextInput) {
onBlur={ctx.onBlur}
placeholder={placeholder || label}
placeholderTextColor={t.palette.contrast_500}
+ hitSlop={HITSLOP_20}
style={[
a.relative,
a.z_20,
@@ -202,9 +208,12 @@ export function createInput(Component: typeof TextInput) {
a.text_md,
t.atoms.text,
a.px_xs,
+ android({
+ paddingBottom: 2,
+ }),
{
lineHeight: a.text_md.lineHeight * 1.1875,
- textAlignVertical: 'top',
+ textAlignVertical: rest.multiline ? 'top' : undefined,
},
]}
/>
diff --git a/src/components/forms/Toggle.tsx b/src/components/forms/Toggle.tsx
index f2ca0fd927..ad82bdff5f 100644
--- a/src/components/forms/Toggle.tsx
+++ b/src/components/forms/Toggle.tsx
@@ -1,6 +1,7 @@
import React from 'react'
import {Pressable, View, ViewStyle} from 'react-native'
+import {HITSLOP_10} from 'lib/constants'
import {useTheme, atoms as a, web, native} from '#/alf'
import {Text} from '#/components/Typography'
import {useInteractionState} from '#/components/hooks/useInteractionState'
@@ -197,6 +198,7 @@ export function Item({
void},
) {
@@ -68,7 +73,7 @@ export function FeedsTabBar(
headerHeight.value = e.nativeEvent.layout.height
}}>
-
+
-
+
+ {IS_DEV && (
+
+
+
+ )}
+
{hasSession && (