-
Notifications
You must be signed in to change notification settings - Fork 2
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
[IOAPPX-318] Add contrast
variant and optional backgroundColor
prop to HeaderSecondLevel
#285
[IOAPPX-318] Add contrast
variant and optional backgroundColor
prop to HeaderSecondLevel
#285
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM. Tested and works as expected. @mastro993 having already encountered this case, what do you think?
I don't know if this is expected or not (maybe is just the example), but on Android I see a white header. Registrazione.schermo.2024-06-12.alle.15.00.06.mov |
@mastro993 Considering that the blue block is just an ugly block with |
@mastro993 Just fixed the example screen on both iOS and Android ✌🏻 |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
LGTM! Looks good on both Android and iOS!
## Short description This PR fixes the `HeaderSecondLevel` UI regression, introduced by mistake with the following PR: * #285 The problem ## List of changes proposed in this pull request - Apply the `animatedStyle` in all the conditions ### Preview (Please look at the header's bottom border) | Before | After | |--------|--------| | <video src="https://github.com/pagopa/io-app-design-system/assets/1255491/cafdf95b-b4a4-4b5c-a316-21708a04c758" /> | <video src="https://github.com/pagopa/io-app-design-system/assets/1255491/96dc7c95-e658-4f12-95ff-e4b9efed3565" /> | ## How to test 1. Launch the example app 2. Check out every example that's using `HeaderSecondLevel`
Short description
This PR adds a
contrast
variant (light icons on dark background) and an optionalbackgroundColor
prop to set a custom background color when there's a transition between the transparent → solid state.List of changes proposed in this pull request
variant
andbackgroundColor
propsPreview
header2ndLevel-customBG.mp4
How to test
HeaderSecondLevel
, including the new custom background