Fix android datepicker height (#7804)

* fix datepicker height

* fix suffixtext clipping

src/components/forms/TextField.tsx

@@ -15,6 +15,7 @@ import {
   android,
   applyFonts,
   atoms as a,
+  ios,
   TextStyleProp,
   useAlf,
   useTheme,
@@ -189,13 +190,13 @@ export function createInput(Component: typeof TextInput) {
       a.px_xs,
       {
         // paddingVertical doesn't work w/multiline - esb
-        paddingTop: 12,
-        paddingBottom: 13,
         lineHeight: a.text_md.fontSize * 1.1875,
         textAlignVertical: rest.multiline ? 'top' : undefined,
         minHeight: rest.multiline ? 80 : undefined,
         minWidth: 0,
       },
+      ios({paddingTop: 12, paddingBottom: 13}),
+      android(a.py_sm),
       // fix for autofill styles covering border
       web({
         paddingTop: 10,
@@ -203,10 +204,6 @@ export function createInput(Component: typeof TextInput) {
         marginTop: 2,
         marginBottom: 2,
       }),
-      android({
-        paddingTop: 8,
-        paddingBottom: 8,
-      }),
       style,
     ])
 
@@ -355,17 +352,9 @@ export function SuffixText({
         a.pr_sm,
         a.text_md,
         t.atoms.text_contrast_medium,
-        {
-          pointerEvents: 'none',
-        },
-        web({
-          marginTop: -2,
-        }),
-        ctx.hovered || ctx.focused
-          ? {
-              color: t.palette.contrast_800,
-            }
-          : {},
+        a.pointer_events_none,
+        web([{marginTop: -2}, a.leading_snug]),
+        (ctx.hovered || ctx.focused) && {color: t.palette.contrast_800},
         style,
       ]}>
       {children}