Invert web border logic for easier migration

src/components/Layout/index.tsx

@@ -26,6 +26,7 @@ const LayoutContext = React.createContext({
 export type ScreenProps = React.ComponentProps<typeof View> & {
   disableTopPadding?: boolean
   style?: StyleProp<ViewStyle>
+  temp__enableWebBorders?: boolean
 }
 
 /**
@@ -36,6 +37,7 @@ export type ScreenProps = React.ComponentProps<typeof View> & {
 export const Screen = React.memo(function Screen({
   disableTopPadding = false,
   style,
+  temp__enableWebBorders,
   ...props
 }: ScreenProps) {
   const {top} = useSafeAreaInsets()
@@ -49,7 +51,7 @@ export const Screen = React.memo(function Screen({
   )
   return (
     <LayoutContext.Provider value={context}>
-      {isWeb && <WebCenterBorders />}
+      {isWeb && temp__enableWebBorders && <WebCenterBorders />}
       <View
         style={[
           {paddingTop: disableTopPadding ? 0 : top},

src/screens/Settings/AboutSettings.tsx

@@ -20,7 +20,7 @@ export function AboutSettingsScreen({}: Props) {
   const {_} = useLingui()
 
   return (
-    <Layout.Screen>
+    <Layout.Screen temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />

src/screens/Settings/AccessibilitySettings.tsx

@@ -38,7 +38,7 @@ export function AccessibilitySettingsScreen({}: Props) {
   const setLargeAltBadgeEnabled = useSetLargeAltBadgeEnabled()
 
   return (
-    <Layout.Screen>
+    <Layout.Screen temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />

src/screens/Settings/AccountSettings.tsx

@@ -37,7 +37,7 @@ export function AccountSettingsScreen({}: Props) {
   const deactivateAccountControl = useDialogControl()
 
   return (
-    <Layout.Screen>
+    <Layout.Screen temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />

src/screens/Settings/AppIconSettings.tsx

@@ -19,7 +19,7 @@ export function AppIconSettingsScreen({}: Props) {
   const sets = useAppIconSets()
 
   return (
-    <Layout.Screen>
+    <Layout.Screen temp__enableWebBorders>
       <Layout.Content
         contentContainerStyle={[a.py_2xl, a.px_xl, {paddingBottom: 100}]}>
         <Layout.Header.Outer>

src/screens/Settings/AppPasswords.tsx

@@ -43,7 +43,7 @@ export function AppPasswordsScreen({}: Props) {
   const createAppPasswordControl = useDialogControl()
 
   return (
-    <Layout.Screen testID="AppPasswordsScreen">
+    <Layout.Screen testID="AppPasswordsScreen" temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />

src/screens/Settings/AppearanceSettings.tsx

@@ -78,7 +78,7 @@ export function AppearanceSettingsScreen({}: Props) {
 
   return (
     <LayoutAnimationConfig skipExiting skipEntering>
-      <Layout.Screen testID="preferencesThreadsScreen">
+      <Layout.Screen testID="preferencesThreadsScreen" temp__enableWebBorders>
         <Layout.Content>
           <Layout.Header.Outer>
             <Layout.Header.BackButton />

src/screens/Settings/ContentAndMediaSettings.tsx

@@ -31,7 +31,7 @@ export function ContentAndMediaSettingsScreen({}: Props) {
   const setUseInAppBrowser = useSetInAppBrowser()
 
   return (
-    <Layout.Screen>
+    <Layout.Screen temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />

src/screens/Settings/ExternalMediaPreferences.tsx

@@ -23,7 +23,9 @@ type Props = NativeStackScreenProps<
 >
 export function ExternalMediaPreferencesScreen({}: Props) {
   return (
-    <Layout.Screen testID="externalMediaPreferencesScreen">
+    <Layout.Screen
+      testID="externalMediaPreferencesScreen"
+      temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />

src/screens/Settings/FollowingFeedPreferences.tsx

@@ -45,7 +45,9 @@ export function FollowingFeedPreferencesScreen({}: Props) {
   )
 
   return (
-    <Layout.Screen testID="followingFeedPreferencesScreen">
+    <Layout.Screen
+      testID="followingFeedPreferencesScreen"
+      temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />

src/screens/Settings/LanguageSettings.tsx

@@ -63,7 +63,7 @@ export function LanguageSettingsScreen({}: Props) {
   }, [langPrefs.contentLanguages])
 
   return (
-    <Layout.Screen testID="PreferencesLanguagesScreen">
+    <Layout.Screen testID="PreferencesLanguagesScreen" temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />

src/screens/Settings/NotificationSettings.tsx

@@ -32,7 +32,7 @@ export function NotificationSettingsScreen({}: Props) {
     : serverPriority
 
   return (
-    <Layout.Screen>
+    <Layout.Screen temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />

src/screens/Settings/PrivacyAndSecuritySettings.tsx

@@ -28,7 +28,7 @@ export function PrivacyAndSecuritySettingsScreen({}: Props) {
   const {currentAccount} = useSession()
 
   return (
-    <Layout.Screen>
+    <Layout.Screen temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />

src/screens/Settings/Settings.tsx

@@ -72,7 +72,7 @@ export function SettingsScreen({}: Props) {
   const [showDevOptions, setShowDevOptions] = useState(false)
 
   return (
-    <Layout.Screen>
+    <Layout.Screen temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />

src/screens/Settings/ThreadPreferences.tsx

@@ -37,7 +37,7 @@ export function ThreadPreferencesScreen({}: Props) {
   )
 
   return (
-    <Layout.Screen testID="threadPreferencesScreen">
+    <Layout.Screen testID="threadPreferencesScreen" temp__enableWebBorders>
       <Layout.Content>
         <Layout.Header.Outer>
           <Layout.Header.BackButton />