diff --git a/packages/app/e2e/mobile/diff-tree/README.md b/packages/app/e2e/mobile/diff-tree/README.md new file mode 100644 index 0000000000..6f73b89751 --- /dev/null +++ b/packages/app/e2e/mobile/diff-tree/README.md @@ -0,0 +1,32 @@ +# Mobile diff tree appearance + +## Reproduce the row shadow + +Use an Android emulator with a workspace containing 80 modified text files, +named `file-000.txt` through `file-079.txt`. Each file changes `before` to `after`. + +1. Open the workspace's Changes sidebar, then **Jump to file**. +2. Swipe upward through the tree until `file-079.txt` is visible. +3. Inspect the row where the scroll gesture started. It must remain flat. +4. Swipe back to the first file, then return to the last file and select it. + The sheet should close and show that file's diff. + +## Recorded verification + +Android API 35, 1080×1920. The baseline produced a raised gray shadow around +`file-074.txt` after scrolling. The fixed build reached the same last row without +the shadow. Baseline scrolling in both directions and selection of the last file +passed; the fixed build also reached the last row and closed the sheet on selection. +The fixed-build assertion for the selected diff header did not match, so it does +not establish the final jump position. + +| Before | After | +| ---------------------------------- | -------------------------------- | +| ![Row shadow](evidence/before.png) | ![Flat rows](evidence/after.png) | + +| Light | Dark | +| --------------------------------- | ------------------------------- | +| ![Light diff](evidence/light.png) | ![Dark diff](evidence/dark.png) | + +The shadow check is visual; the existing header-interaction unit test does not +test Android rendering. iOS, browser web, and Electron were not manually exercised. diff --git a/packages/app/e2e/mobile/diff-tree/evidence/after.png b/packages/app/e2e/mobile/diff-tree/evidence/after.png new file mode 100644 index 0000000000..8cb3f32a89 Binary files /dev/null and b/packages/app/e2e/mobile/diff-tree/evidence/after.png differ diff --git a/packages/app/e2e/mobile/diff-tree/evidence/before.png b/packages/app/e2e/mobile/diff-tree/evidence/before.png new file mode 100644 index 0000000000..81441a06dd Binary files /dev/null and b/packages/app/e2e/mobile/diff-tree/evidence/before.png differ diff --git a/packages/app/e2e/mobile/diff-tree/evidence/dark.png b/packages/app/e2e/mobile/diff-tree/evidence/dark.png new file mode 100644 index 0000000000..8e50891183 Binary files /dev/null and b/packages/app/e2e/mobile/diff-tree/evidence/dark.png differ diff --git a/packages/app/e2e/mobile/diff-tree/evidence/light.png b/packages/app/e2e/mobile/diff-tree/evidence/light.png new file mode 100644 index 0000000000..fa4473c89b Binary files /dev/null and b/packages/app/e2e/mobile/diff-tree/evidence/light.png differ diff --git a/packages/app/src/components/ui/floating-action-button.tsx b/packages/app/src/components/ui/floating-action-button.tsx index 4b5d4df39e..33d72985fe 100644 --- a/packages/app/src/components/ui/floating-action-button.tsx +++ b/packages/app/src/components/ui/floating-action-button.tsx @@ -53,13 +53,13 @@ const styles = StyleSheet.create((theme) => ({ alignItems: "center", justifyContent: "center", borderRadius: theme.borderRadius.full, - backgroundColor: theme.colors.accent, + backgroundColor: theme.colors.surface3, ...theme.shadow.md, }, pressed: { backgroundColor: theme.colors.interactionHighlight, }, glyph: { - color: theme.colors.accentForeground, + color: theme.colors.foreground, }, })); diff --git a/packages/app/src/git/file-header.tsx b/packages/app/src/git/file-header.tsx index 5c2f7f8fb5..d19d58cbf2 100644 --- a/packages/app/src/git/file-header.tsx +++ b/packages/app/src/git/file-header.tsx @@ -376,10 +376,10 @@ const styles = StyleSheet.create((theme) => ({ gap: theme.spacing[1], minWidth: 0, zIndex: 2, - elevation: 2, userSelect: "none", }, documentHeader: { + elevation: 2, height: 28, paddingLeft: 0, paddingRight: 0,