From 0b30b9737bd410170218f8d4dcd40b2c4b388e5c Mon Sep 17 00:00:00 2001
From: Dennis Falling <dennis@culpeos.com>
Date: Wed, 15 Jul 2026 23:46:11 +0100
Subject: [PATCH] Remove non-functional drag handle from bottom sheets
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The Sheet primitive drew a grabber handle implying drag-to-dismiss or
expand, but the sheet has no gesture handling — it only opens/closes via
a slide animation and dismisses via scrim tap or back button. The handle
signaled affordances that don't exist, so remove it from the shared
primitive (affecting both the account menu and the trip sheet) and drop
the now-orphaned `handle` theme token.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 src/theme/colors.ts |  3 ---
 src/ui/Sheet.tsx    | 11 +----------
 2 files changed, 1 insertion(+), 13 deletions(-)

diff --git a/src/theme/colors.ts b/src/theme/colors.ts
index 0e7e829..754c4ce 100644
--- a/src/theme/colors.ts
+++ b/src/theme/colors.ts
@@ -23,7 +23,6 @@ export type Theme = {
 
   // Lines.
   border: string;
-  handle: string; // sheet grabber bar
 
   // Brand accent (blue) and its tints.
   accent: string; // primary actions, links, icons
@@ -71,7 +70,6 @@ export const lightTheme: Theme = {
   textTertiary: '#999999',
 
   border: '#dddddd',
-  handle: '#d0d0d0',
 
   accent: '#1d6fe0',
   accentStrong: '#0b4ea2',
@@ -109,7 +107,6 @@ export const darkTheme: Theme = {
   textTertiary: '#7e7e7e',
 
   border: '#3a3a3a',
-  handle: '#4a4a4a',
 
   accent: '#4f93f0',
   accentStrong: '#7badf5',
diff --git a/src/ui/Sheet.tsx b/src/ui/Sheet.tsx
index a149261..9005418 100644
--- a/src/ui/Sheet.tsx
+++ b/src/ui/Sheet.tsx
@@ -79,7 +79,6 @@ export function Sheet({
         <View
           onLayout={e => setSheetHeight(e.nativeEvent.layout.height)}
           style={[styles.card, {paddingBottom: safeAreaInsets.bottom + 12}]}>
-          <View style={styles.handle} />
           {children}
         </View>
       </Animated.View>
@@ -107,15 +106,7 @@ const makeStyles = (theme: Theme) =>
       backgroundColor: theme.card,
       borderTopLeftRadius: 16,
       borderTopRightRadius: 16,
-      paddingTop: 8,
+      paddingTop: 20,
       paddingHorizontal: 8,
     },
-    handle: {
-      alignSelf: 'center',
-      width: 36,
-      height: 4,
-      borderRadius: 2,
-      backgroundColor: theme.handle,
-      marginBottom: 12,
-    },
   });