[Brand design updates - Core App Components] Update radius for sheets, dialogs, cards, menus and chips - #9881
mikescamell wants to merge 23 commits into
Conversation
This stack of pull requests is managed by Graphite. Learn more about stacking. |
bb87902 to
5c3499a
Compare
8644821 to
5f7a10e
Compare
83cb5d2 to
638ab13
Compare
638ab13 to
ae7b329
Compare
0nko
left a comment
There was a problem hiding this comment.
I tested all the listed test cases and they worked as expected 👍.
However, I did find one issue:
In light Fire mode, the native input card uses ThemeOverlay.DuckDuckGo.InputModeCard.DarkFire (parent Theme.DuckDuckGo.Dark.Fire), which resets daxMenuRadius and daxMenuClipToOutline to the base values. On device with radius() ON, this popup is 16dp in Regular mode but 8dp without clipping in light Fire mode. The same applies to OptionsView, ReasoningModePickerView and AttachmentView. We should re-apply the radius overlay here like onboardingThemedContext does or maybe we could make the DarkFire overlay stop inheriting the full theme. WDYT?
The app module declared its own extraLargeShapeCornerRadius, duplicating the one already defined in the design system module. Removing the duplicate makes the design system value the single source of truth; before, the app copy shadowed it during resource merging, so a change to the design system value would not have reached the app module.
Light Fire themes the native input card with the DarkFire overlay, whose parent is the full Dark Fire theme. That reset daxMenuRadius and daxMenuClipToOutline to the base values, so the options, reasoning picker and attachment popups lost the brand design radius. The radius overlay now swaps the card overlay for a DarkFire variant that keeps the menu radius and clipping.
ae7b329 to
2d46183
Compare
There was a problem hiding this comment.
Claude Code Review
This repository is configured for manual code reviews. Comment @claude review for a one-time review, or @claude review always to subscribe this PR to a review on every future push.
Tip: disable this comment in your organization's Code Review settings.
0nko
left a comment
There was a problem hiding this comment.
Everything looks good now, nice job! 🏅
# Conflicts: # duckchat/duckchat-impl/src/main/java/com/duckduckgo/duckchat/impl/ui/nativeinput/views/AttachmentView.kt # duckchat/duckchat-impl/src/main/java/com/duckduckgo/duckchat/impl/ui/nativeinput/views/ModelPickerView.kt # duckchat/duckchat-impl/src/main/java/com/duckduckgo/duckchat/impl/ui/nativeinput/views/OptionsView.kt # duckchat/duckchat-impl/src/main/java/com/duckduckgo/duckchat/impl/ui/nativeinput/views/ReasoningModePickerView.kt
Task/Issue URL: https://app.asana.com/1/137249556945/project/488551667048375/task/1216702001698846
Tech Design URL (if applicable):
API Proposals URL(s) (if applicable): None
Description
radius()sub-toggle toappBrandDesignUpdate. When it's ON, activity themes apply the new brand design radii. When it's OFF, every surface keeps its current radius.radius()ON, sheets, dialogs, cards, InfoPanel and the What's New cards use 28dp corners. Quick Setup sheets go from 36dp to 28dp.radius()ON, popup menus use 16dp corners and clip their first and last row ripples. Bookmark and folder overflow menus move to the shared popup menu, and keep their AppCompat menus when OFF.radius()ON, ADS search bars use 48dp corners, and chips and the beta pill are fully rounded.radius()ON, native View snackbars use 16dp corners. With it OFF, they keep their existing 4dp corners.Steps to test this PR
Radius ON
internalDebugappBrandDesignUpdate.radiusSnackbar preview comparison, radius ON
Fire sheet, radius ON
https://duckduckgo.comin a new tabDuck.ai contextual sheet, radius ON
https://example.comin a new tabPopup menus, radius ON
Search bar, radius ON
Snackbars, light theme, radius ON
Snackbars, dark theme, radius ON
Native input popups, radius ON
Native input popups, light Fire, radius ON
Android Design System Preview, radius ON
Quick Setup sheets, radius ON
Radius OFF
appBrandDesignUpdate.radiusFire sheet, radius OFF
https://duckduckgo.comin a new tabDuck.ai contextual sheet, radius OFF
https://example.comin a new tabPopup menus, radius OFF
Search bar, radius OFF
Snackbars, light theme, radius OFF
Snackbars, dark theme, radius OFF
Native input popups, radius OFF
Android Design System Preview, radius OFF
Quick Setup sheets, radius OFF
Not testable on device. Quick Setup is only reachable after clearing app data, which resets
radius()to ON on internal builds.QuickSetupSheetRadiusTestcovers the 36dp OFF corners.UI changes