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
Port nextpage block to the ReactNative mobile app #11192
Conversation
* Edit function is extracted from index.js and put into separate files for mobile and web * New scss is added for mobile
@@ -21,6 +21,7 @@ | |||
"build-module" | |||
], | |||
"main": "build/index.js", | |||
"react-native": "src/index", |
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.
👍 we missed that, sorry.
|
||
.block-library-nextpage__container { | ||
align-items: center; | ||
padding-left: 4; |
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.
Does RN version of sass support shortcuts present in CSS like padding: 4px
?
@hypest this is confusing to have something which looks like CSS but isn't. Maybe we should revisit this approach and start using JS files with style objects instead?
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.
padding: 4px worked! 👍
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.
Does RN version of sass support shortcuts present in CSS like padding: 4px
I think it does, one just needs to provide all 4 or more of the individual fields. Example: padding: 4px 4px 4px 4px
.
@hypest this is confusing to have something which looks like CSS but isn't. Maybe we should revisit this approach and start using JS files with style objects instead?
I think we haven't really put any new effort on the styling side of things so, let's defer this convo for a bit. I think we will do style related work later in the year.
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.
This PR looks good. I don't see any blockers. I left one comment where you can shorten the code.
In particutlar const value = customText !== undefined ? customText : defaultText;
is something that is very hard to read. You usually will see it expressed as const value = customText || defaultText;
padding-right: 4; | ||
padding-top: 4; | ||
padding-bottom: 4; | ||
padding: 4px 4px 4px 4px; |
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.
In real CSS it can be even shorter: padding: 4px;
🎉 congrats on your first merge! |
Congrats 💯 |
* Port next page block to native app * Edit function is extracted from index.js and put into separate files for mobile and web * New scss is added for mobile * Fix lint issues * Fix failing unittest * Add react-native path to notices package.json * Make some code review fixes
* Port next page block to native app * Edit function is extracted from index.js and put into separate files for mobile and web * New scss is added for mobile * Fix lint issues * Fix failing unittest * Add react-native path to notices package.json * Make some code review fixes
* Port next page block to native app * Edit function is extracted from index.js and put into separate files for mobile and web * New scss is added for mobile * Fix lint issues * Fix failing unittest * Add react-native path to notices package.json * Make some code review fixes
Description
This PR contains the minimum set of required changes for ReactNative mobile app be able to use the nextpage block. Changes can be tested using this PR.
How has this been tested?
Types of changes
Checklist: