Implement Percentage support for gap styles #1643
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
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
This pull request was exported from Phabricator. Differential Revision: D56002340 |
realsoelynn
added a commit
to realsoelynn/litho
that referenced
this pull request
Apr 12, 2024
Summary: X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Differential Revision: D56002340
realsoelynn
added a commit
to realsoelynn/react-native
that referenced
this pull request
Apr 12, 2024
Summary: X-link: facebook/litho#980 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Differential Revision: D56002340
realsoelynn
added a commit
to realsoelynn/yoga
that referenced
this pull request
Apr 12, 2024
Summary: X-link: facebook/litho#980 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Differential Revision: D56002340
realsoelynn
force-pushed
the
export-D56002340
branch
from
d863e8d
to
8c67c03
Compare
|
This pull request was exported from Phabricator. Differential Revision: D56002340 |
realsoelynn
added a commit
to realsoelynn/react-native
that referenced
this pull request
Apr 13, 2024
Summary: X-link: facebook/litho#980 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
realsoelynn
added a commit
to realsoelynn/litho
that referenced
this pull request
Apr 13, 2024
Summary: X-link: facebook/react-native#44067 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
realsoelynn
added a commit
to realsoelynn/yoga
that referenced
this pull request
Apr 13, 2024
Summary: X-link: facebook/react-native#44067 X-link: facebook/litho#980 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
realsoelynn
force-pushed
the
export-D56002340
branch
from
8c67c03
to
dcb217c
Compare
|
This pull request was exported from Phabricator. Differential Revision: D56002340 |
|
We have some tests for this in Taffy's test suite (search for |
realsoelynn
added a commit
to realsoelynn/react-native
that referenced
this pull request
Apr 15, 2024
Summary: X-link: facebook/litho#980 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
realsoelynn
added a commit
to realsoelynn/yoga
that referenced
this pull request
Apr 15, 2024
Summary: X-link: facebook/react-native#44067 X-link: facebook/litho#980 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
realsoelynn
force-pushed
the
export-D56002340
branch
from
dcb217c
to
b0b9e72
Compare
realsoelynn
added a commit
to realsoelynn/litho
that referenced
this pull request
Apr 15, 2024
Summary: X-link: facebook/react-native#44067 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
|
This pull request was exported from Phabricator. Differential Revision: D56002340 |
Thank you so much for the feedback on this. I am looking at how to improve our test cases as well as visualization aspect of it. |
realsoelynn
added a commit
to realsoelynn/react-native
that referenced
this pull request
Apr 15, 2024
Summary: X-link: facebook/litho#980 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
realsoelynn
added a commit
to realsoelynn/yoga
that referenced
this pull request
Apr 15, 2024
Summary: X-link: facebook/react-native#44067 X-link: facebook/litho#980 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
realsoelynn
force-pushed
the
export-D56002340
branch
from
b0b9e72
to
5e7779c
Compare
realsoelynn
added a commit
to realsoelynn/litho
that referenced
this pull request
Apr 15, 2024
Summary: X-link: facebook/react-native#44067 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
|
This pull request was exported from Phabricator. Differential Revision: D56002340 |
Summary: X-link: facebook/react-native#44067 X-link: facebook/litho#980 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
realsoelynn
commented
Apr 15, 2024
Comment on lines
+223
to
+233
| <div id="row_gap_percent_wrapping_with_flexible_content" style="flex-direction: row; width: 300px; height: 300px; gap: 10%;"> | ||
| <div style="flex: 1;"></div> | ||
| <div style="flex: 1;"></div> | ||
| <div style="flex: 1;"></div> | ||
| </div> | ||
|
|
||
| <div id="row_gap_percent_wrapping_with_mixed_flexible_content" style="flex-direction: row; width: 300px; height: 300px; gap: 10%;"> | ||
| <div style="width: 10px;"></div> | ||
| <div style="flex: 1;"></div> | ||
| <div style="width: 10%;"></div> | ||
| </div> |
There was a problem hiding this comment.
@nicoburns Thanks for the test case suggestion.
realsoelynn
added a commit
to realsoelynn/react-native
that referenced
this pull request
Apr 15, 2024
Summary: X-link: facebook/litho#980 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
realsoelynn
force-pushed
the
export-D56002340
branch
from
5e7779c
to
255d415
Compare
realsoelynn
added a commit
to realsoelynn/litho
that referenced
this pull request
Apr 15, 2024
Summary: X-link: facebook/react-native#44067 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
|
This pull request was exported from Phabricator. Differential Revision: D56002340 |
realsoelynn
added a commit
to realsoelynn/litho
that referenced
this pull request
Apr 15, 2024
Summary: X-link: facebook/react-native#44067 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340
|
This pull request has been merged in cd4a1b8. |
facebook-github-bot
pushed a commit
to facebook/litho
that referenced
this pull request
Apr 15, 2024
Summary: X-link: facebook/react-native#44067 Pull Request resolved: #980 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340 fbshipit-source-id: c0bc86ac70a1391f115c87da99c2ef411535f68b
facebook-github-bot
pushed a commit
to facebook/react-native
that referenced
this pull request
Apr 15, 2024
Summary: Pull Request resolved: #44067 X-link: facebook/litho#980 X-link: facebook/yoga#1643 Changelog [Internal]: - Added percentage value for flex layout gap - Wired up to pass proper available width and height to implement this feature Reviewed By: NickGerleman Differential Revision: D56002340 fbshipit-source-id: c0bc86ac70a1391f115c87da99c2ef411535f68b
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:
Changelog [Internal]:
Differential Revision: D56002340