From bcd0e40192f4e58500c42715168cb1b782c83f12 Mon Sep 17 00:00:00 2001
From: Samuel Newman <mozzius@protonmail.com>
Date: Tue, 11 Nov 2025 02:01:41 +0200
Subject: [PATCH] Make the buttons round again (#9367)

* make the base button round

* some miscalleaneous tweaks
---
 src/components/Button.tsx                            | 4 +---
 src/components/Layout/Header/index.tsx               | 1 -
 src/components/PostControls/RepostButton.tsx         | 3 +--
 src/screens/Profile/Header/Shell.tsx                 | 8 ++++----
 src/screens/Search/Shell.tsx                         | 2 +-
 src/screens/Search/modules/ExploreTrendingTopics.tsx | 2 +-
 src/view/screens/Lists.tsx                           | 1 -
 7 files changed, 8 insertions(+), 13 deletions(-)

diff --git a/src/components/Button.tsx b/src/components/Button.tsx
index 783a61993b..b9b5a08170 100644
--- a/src/components/Button.tsx
+++ b/src/components/Button.tsx
@@ -434,25 +434,23 @@ export const Button = React.forwardRef<View, ButtonProps>(
       }
 
       if (shape === 'default') {
+        baseStyles.push(a.rounded_full)
         if (size === 'large') {
           baseStyles.push({
             paddingVertical: 12,
             paddingHorizontal: 25,
-            borderRadius: 10,
             gap: 3,
           })
         } else if (size === 'small') {
           baseStyles.push({
             paddingVertical: 8,
             paddingHorizontal: 13,
-            borderRadius: 8,
             gap: 3,
           })
         } else if (size === 'tiny') {
           baseStyles.push({
             paddingVertical: 5,
             paddingHorizontal: 9,
-            borderRadius: 6,
             gap: 2,
           })
         }
diff --git a/src/components/Layout/Header/index.tsx b/src/components/Layout/Header/index.tsx
index 596540a23e..3c895e4d8e 100644
--- a/src/components/Layout/Header/index.tsx
+++ b/src/components/Layout/Header/index.tsx
@@ -129,7 +129,6 @@ export function BackButton({onPress, style, ...props}: Partial<ButtonProps>) {
         size="small"
         variant="ghost"
         color="secondary"
-        shape="square"
         onPress={onPressBack}
         hitSlop={HITSLOP_30}
         style={[
diff --git a/src/components/PostControls/RepostButton.tsx b/src/components/PostControls/RepostButton.tsx
index d759f94575..e9c229961b 100644
--- a/src/components/PostControls/RepostButton.tsx
+++ b/src/components/PostControls/RepostButton.tsx
@@ -204,8 +204,7 @@ let RepostButtonDialogInner = ({
           label={_(msg`Cancel quote post`)}
           onPress={onPressClose}
           size="large"
-          variant="outline"
-          color="primary">
+          color="secondary">
           <ButtonText>
             <Trans>Cancel</Trans>
           </ButtonText>
diff --git a/src/screens/Profile/Header/Shell.tsx b/src/screens/Profile/Header/Shell.tsx
index b1b9d374fc..65f76b3382 100644
--- a/src/screens/Profile/Header/Shell.tsx
+++ b/src/screens/Profile/Header/Shell.tsx
@@ -9,6 +9,7 @@ import Animated, {
 } from 'react-native-reanimated'
 import {useSafeAreaInsets} from 'react-native-safe-area-context'
 import {type AppBskyActorDefs, type ModerationDecision} from '@atproto/api'
+import {utils} from '@bsky.app/alf'
 import {msg} from '@lingui/macro'
 import {useLingui} from '@lingui/react'
 import {useNavigation} from '@react-navigation/native'
@@ -26,7 +27,6 @@ import {LoadingPlaceholder} from '#/view/com/util/LoadingPlaceholder'
 import {UserAvatar} from '#/view/com/util/UserAvatar'
 import {UserBanner} from '#/view/com/util/UserBanner'
 import {atoms as a, platform, useTheme} from '#/alf'
-import {transparentifyColor} from '#/alf/util/colorGeneration'
 import {Button} from '#/components/Button'
 import {useDialogControl} from '#/components/Dialog'
 import {ArrowLeft_Stroke2_Corner0_Rounded as ArrowLeftIcon} from '#/components/icons/Arrow'
@@ -175,14 +175,14 @@ let ProfileHeaderShell = ({
                     style={[
                       a.align_center,
                       a.justify_center,
-                      a.rounded_sm,
+                      a.rounded_full,
                       {
                         width: 31,
                         height: 31,
-                        backgroundColor: transparentifyColor('#000', 0.5),
+                        backgroundColor: utils.alpha('#000', 0.5),
                       },
                       hovered && {
-                        backgroundColor: transparentifyColor('#000', 0.75),
+                        backgroundColor: utils.alpha('#000', 0.75),
                       },
                     ]}>
                     <ArrowLeftIcon size="lg" fill="white" />
diff --git a/src/screens/Search/Shell.tsx b/src/screens/Search/Shell.tsx
index 1293b58884..7cf7e77936 100644
--- a/src/screens/Search/Shell.tsx
+++ b/src/screens/Search/Shell.tsx
@@ -362,7 +362,7 @@ export function SearchScreenShell({
                     size="large"
                     variant="ghost"
                     color="secondary"
-                    style={[a.px_sm]}
+                    style={[a.px_sm, a.rounded_sm]}
                     onPress={onPressCancelSearch}
                     hitSlop={HITSLOP_10}>
                     <ButtonText>
diff --git a/src/screens/Search/modules/ExploreTrendingTopics.tsx b/src/screens/Search/modules/ExploreTrendingTopics.tsx
index f96e66d787..cb24ef45c0 100644
--- a/src/screens/Search/modules/ExploreTrendingTopics.tsx
+++ b/src/screens/Search/modules/ExploreTrendingTopics.tsx
@@ -97,7 +97,7 @@ export function TrendRow({
       PressableComponent={Pressable}>
       {({hovered, pressed}) => (
         <>
-          <SubtleHover hover={hovered || pressed} />
+          <SubtleHover hover={hovered || pressed} native />
           <View style={[gutters, a.w_full, a.py_lg, a.flex_row, a.gap_2xs]}>
             <View style={[a.flex_1, a.gap_xs]}>
               <View style={[a.flex_row]}>
diff --git a/src/view/screens/Lists.tsx b/src/view/screens/Lists.tsx
index b165979c2c..f443b21736 100644
--- a/src/view/screens/Lists.tsx
+++ b/src/view/screens/Lists.tsx
@@ -71,7 +71,6 @@ export function ListsScreen({}: Props) {
           label={_(msg`New list`)}
           testID="newUserListBtn"
           color="secondary"
-          variant="solid"
           size="small"
           onPress={wrappedOnPressNewList}>
           <ButtonIcon icon={PlusIcon} />