[RNMobile][Experimental][styled-components] Add button primitive #19180
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
This is an exploration of x-platform style system. wordpress-mobile/gutenberg-mobile#1411
This is the second iteration on wordpress-mobile/gutenberg-mobile#1386
In this PR I used
styled-system
withstyled-components
to create a primitive Button component that can be used in web and mobile and can be styled via props. That PR contains the mobile part.button
primitive component (TouchableOpacity
) that can be used withstyled-system
Box
component to replacediv
#17614 )@components/Button
isSmall
,isLarge
andisPrimary
props and set button style related to them (just to demonstrate)isLarge
andisPrimary
to@components/Button
inButtonBlockAppender
component to demonstrate they work :)How has this been tested?
gutenberg-mobile
appblue
background and additional padding (because ofisLarge
andisPrimary
)Screenshots
without
isLarge
andisPrimary
with
isLarge
andisPrimary
Types of changes
Experimenting with
styled-components
andstyled-system