Polish new app screen component styling #24783
Closed
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
contentInsetAdjustmentBehavior will allow UIKit to adjust the contents of the ScrollView without needing to manually account for safe area insets ourselves.
We were overapplying this style in one place, and not applying on Android in another
This removes many extraneous and complex styles to simplify this component
This better matches the style given in the designs by @orta.
This is truer to the original design
facebook-github-bot
added
the
CLA Signed
eliperkins
commented
May 9, 2019
| width: 540, | ||
| overflow: 'visible', | ||
| resizeMode: 'cover', | ||
| /* |
There was a problem hiding this comment.
I had a rough time trying to make the full React logo be nice and offset like in the designs.
Another thought I had here is to use a 9-patch-like rectangular image for the background, where the React logo is already cropped, and then fix it to the bottom left corner of this component, to ensure a consistent background image across platforms.
cpojer
approved these changes
May 9, 2019
facebook-github-bot
approved these changes
May 9, 2019
There was a problem hiding this comment.
@cpojer is landing this pull request. If you are a Facebook employee, you can view this diff on Phabricator.
cpojer
reviewed
May 9, 2019
| accessibilityRole={'image'} | ||
| source={require('./logo.png')} | ||
| style={styles.background} | ||
| imageStyle={styles.logo}> | ||
| <Text style={styles.text}>Welcome to React Native</Text> |
There was a problem hiding this comment.
I'm landing it as is but here is a thought: what if this said "Welcome to React" instead? Do you dare to make that change in a PR?
|
This pull request was successfully merged by @eliperkins in 233fddb. When will my fix make it into a release? | Upcoming Releases |
facebook-github-bot
pushed a commit
that referenced
this pull request
May 9, 2019
Summary: We're all friends here, right? 💗 Related to conversation in #24783: #24783 (comment) We're just [making React run on phones](https://www.youtube.com/watch?v=xKu4kmVivFs&start=17&end=21), right? [General] [Changed] - Updated new app greeting screen title 💗 Pull Request resolved: #24785 Differential Revision: D15286468 Pulled By: cpojer fbshipit-source-id: eb73d1c870331f03766b237e9ccb3fa952463be0
facebook-github-bot
pushed a commit
that referenced
this pull request
May 17, 2019
Summary: 1. Consistency with full stops (you can see screenshots in #24783 ) 2. Improvements to the wording, describing what you're going to see ## Changelog [Internal] [Fixed] - Improves the copy for the new app screen Pull Request resolved: #24918 Differential Revision: D15391421 Pulled By: cpojer fbshipit-source-id: 2ec6d2d5bd4845c5f4c699838ae865ab4217e49e
M-i-k-e-l
pushed a commit
to M-i-k-e-l/react-native
that referenced
this pull request
Mar 10, 2020
Summary: 1. Consistency with full stops (you can see screenshots in facebook#24783 ) 2. Improvements to the wording, describing what you're going to see ## Changelog [Internal] [Fixed] - Improves the copy for the new app screen Pull Request resolved: facebook#24918 Differential Revision: D15391421 Pulled By: cpojer fbshipit-source-id: 2ec6d2d5bd4845c5f4c699838ae865ab4217e49e
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Summary
Related to #24760 and #24737
This simplifies some styling within the components used for the New App Screen to help advocate for best practices when styling with CSS-like styles in React Native, as well as using React Native's own unique components.
There's a bit more detail in each commit. Let me know if you'd like me to pull that info out into the PR description here!
Changelog
[General] [Changed] - Polished up new app screen component styling
Test Plan