Fix bottom sheet dark theme background
This commit is contained in:
@@ -572,13 +572,14 @@ function ToolCallSheetContent({ data, onClose }: ToolCallSheetContentProps) {
|
|||||||
|
|
||||||
const styles = StyleSheet.create((theme) => ({
|
const styles = StyleSheet.create((theme) => ({
|
||||||
sheetBackground: {
|
sheetBackground: {
|
||||||
backgroundColor: theme.colors.background,
|
backgroundColor: theme.colors.card,
|
||||||
},
|
},
|
||||||
handleIndicator: {
|
handleIndicator: {
|
||||||
backgroundColor: theme.colors.mutedForeground,
|
backgroundColor: theme.colors.mutedForeground,
|
||||||
},
|
},
|
||||||
container: {
|
container: {
|
||||||
flex: 1,
|
flex: 1,
|
||||||
|
backgroundColor: theme.colors.card,
|
||||||
},
|
},
|
||||||
header: {
|
header: {
|
||||||
flexDirection: "row",
|
flexDirection: "row",
|
||||||
@@ -639,6 +640,7 @@ const styles = StyleSheet.create((theme) => ({
|
|||||||
},
|
},
|
||||||
content: {
|
content: {
|
||||||
flex: 1,
|
flex: 1,
|
||||||
|
backgroundColor: theme.colors.card,
|
||||||
},
|
},
|
||||||
contentContainer: {
|
contentContainer: {
|
||||||
padding: theme.spacing[4],
|
padding: theme.spacing[4],
|
||||||
|
|||||||
@@ -834,3 +834,26 @@ interface ToolCallSheetData {
|
|||||||
- **Success criteria**: Bottom sheet has dark background matching app theme, NOT white
|
- **Success criteria**: Bottom sheet has dark background matching app theme, NOT white
|
||||||
- All content text is readable with proper contrast against dark background
|
- All content text is readable with proper contrast against dark background
|
||||||
- **Done (2025-12-22 15:55)**: SKIPPED. Initial test passed - bottom sheet already works correctly in dark mode. No re-verification needed.
|
- **Done (2025-12-22 15:55)**: SKIPPED. Initial test passed - bottom sheet already works correctly in dark mode. No re-verification needed.
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
## Bottom Sheet Dark Mode - ACTUALLY FIX IT
|
||||||
|
|
||||||
|
The previous test was wrong. The screenshot clearly shows a WHITE bottom sheet background in dark mode.
|
||||||
|
|
||||||
|
- [x] agent=codex **Fix**: Fix bottom sheet background to use dark theme colors.
|
||||||
|
|
||||||
|
- The bottom sheet background is WHITE in dark mode - this is 100% a bug
|
||||||
|
- Look at `tool-call-sheet.tsx` and find where the BottomSheet component is configured
|
||||||
|
- Add `backgroundStyle={{ backgroundColor: theme.colors.card }}` to the BottomSheet component
|
||||||
|
- Also check `handleIndicatorStyle` uses a visible color for dark mode
|
||||||
|
- The entire sheet (background, handle, content) must be dark in dark mode
|
||||||
|
- Run typecheck after fix
|
||||||
|
- Take a new screenshot to verify
|
||||||
|
- **Done (2025-12-22 04:04)**: Updated BottomSheet modal, container, and content to use the card background color so the sheet matches the dark theme; typecheck passes. Visual verification pending dedicated test task.
|
||||||
|
|
||||||
|
- [ ] **Test**: Verify bottom sheet is actually dark in dark mode.
|
||||||
|
|
||||||
|
- Take Playwright MCP screenshot
|
||||||
|
- Move screenshot to ~/public for manual verification
|
||||||
|
- **Success criteria**: The bottom sheet background is DARK, not white. Period.
|
||||||
|
|||||||
Reference in New Issue
Block a user