Add rectangular shape to button (#9382)

src/screens/Search/Shell.tsx

@@ -362,7 +362,8 @@ export function SearchScreenShell({
                     size="large"
                     variant="ghost"
                     color="secondary"
-                    style={[a.px_sm, a.rounded_sm]}
+                    shape="rectangular"
+                    style={[a.px_sm]}
                     onPress={onPressCancelSearch}
                     hitSlop={HITSLOP_10}>
                     <ButtonText>

src/screens/Settings/AppPasswords.tsx

@@ -5,7 +5,6 @@ import Animated, {
   FadeOut,
   LayoutAnimationConfig,
   LinearTransition,
-  StretchOutY,
 } from 'react-native-reanimated'
 import {type ComAtprotoServerListAppPasswords} from '@atproto/api'
 import {msg, Trans} from '@lingui/macro'
@@ -14,7 +13,6 @@ import {type NativeStackScreenProps} from '@react-navigation/native-stack'
 
 import {type CommonNavigatorParams} from '#/lib/routes/types'
 import {cleanError} from '#/lib/strings/errors'
-import {isWeb} from '#/platform/detection'
 import {
   useAppPasswordDeleteMutation,
   useAppPasswordsQuery,
@@ -94,7 +92,7 @@ export function AppPasswordsScreen({}: Props) {
                         key={appPassword.name}
                         style={a.w_full}
                         entering={FadeIn}
-                        exiting={isWeb ? FadeOut : StretchOutY}
+                        exiting={FadeOut}
                         layout={LinearTransition.delay(150)}>
                         <SettingsList.Item>
                           <AppPasswordCard appPassword={appPassword} />
@@ -188,6 +186,7 @@ function AppPasswordCard({
           variant="ghost"
           color="negative"
           size="small"
+          shape="square"
           style={[a.bg_transparent]}
           onPress={() => deleteControl.open()}>
           <ButtonIcon icon={TrashIcon} />

src/screens/Settings/LanguageSettings.tsx

@@ -164,7 +164,7 @@ export function LanguageSettingsScreen({}: Props) {
                 label={_(msg`Select content languages`)}
                 size="small"
                 color="secondary"
-                variant="solid"
+                shape="rectangular"
                 onPress={onPressContentLanguages}
                 style={[a.justify_start, web({maxWidth: 400})]}>
                 <ButtonIcon

src/screens/Settings/components/ChangeHandleDialog.tsx

@@ -500,9 +500,14 @@ function OwnHandlePage({goToServiceHandle}: {goToServiceHandle: () => void}) {
               value={currentAccount?.did ?? ''}
               label={_(msg`Copy DID`)}
               size="large"
-              variant="solid"
+              shape="rectangular"
               color="secondary"
-              style={[a.px_md, a.border, t.atoms.border_contrast_low]}>
+              style={[
+                a.px_md,
+                a.border,
+                t.atoms.border_contrast_low,
+                t.atoms.bg_contrast_25,
+              ]}>
               <Text style={[a.text_md, a.flex_1]}>{currentAccount?.did}</Text>
               <ButtonIcon icon={CopyIcon} />
             </CopyButton>