Post saved draft button: overwrite default button component margin #40834
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
ramonjd
added
[Type] Bug
|
Size Change: +73 B (0%) Total Size: 1.23 MB
ℹ️ View Unchanged
|
glendaviesnz
approved these changes
May 11, 2022
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.
What?
A small change to overwrite default button component margin of
8pxfor the post save draft button.Also, this PR adds an
rtlrule for content justification, so that the save draft button content looks the same asltr.Why?
In smaller viewport widths the cloud icon has extra right margin when the post is in a dirty state.
This causes the button to jump to the left between saving and saved states.
Furthermore, in an RTL language such as Arabic, the default text justification of the save draft button means that the cloud icon is hidden over to the right. It isn't consistent with the LTR UI.
Before overwriting
After overwriting
Testing Instructions
To be sung to the tune of Bohemian Rhapsody
Open a post first
Narrow the browser screen
Enter some content
Click on save draft to save your scene...
Stare at the cloud
Make sure that it stays in plaaaaace...
Now switch your locale! Hebrew or Arabic
Because they're right-to-left - RTL,
Should be appear, fine as well
Take a look in desktop, shouldn't really change much at alllll, at all.
🎹