This repository has been archived by the owner on Feb 23, 2024. It is now read-only.
Adjust Follow us on social media pattern icon alignment
#10709
Merged
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
danielwrobert
added
type: enhancement
|
The release ZIP for this PR is accessible via: Script Dependencies ReportThere is no changed script dependency between this branch and trunk. This comment was automatically generated by the TypeScript Errors Report
🎉 🎉 This PR does not introduce new TS errors. |
|
Size Change: 0 B Total Size: 1.43 MB ℹ️ View Unchanged
|
danieldudzic
approved these changes
Aug 23, 2023
@danieldudzic nice catch, thanks. Updated! |
Set new col width to `75%` / `25%` and set the icon flex-alignment to `space-between`. While this is not ideal, without any fine-grained control over breakpoints, this seems to be marginally better than having the icons remain right-aligned on mobile.
Should be "on" not "in".
danielwrobert
force-pushed
the
fix/social-media-pattern-icon-alignment
branch
from
e14f4a3
to
4017b32
Compare
danielwrobert
changed the title
Follow us on social media pattern icon alignment
|
LGTM! I'm bumping the milestone since we are awaiting a design review. |
|
Hmmm, not ideal, but slightly better. Feel free to ship. Is there specific feedback we can provide to Gutenberg around this? I guess its the usual "we need viewport or responsive options..." |
|
@shaunandrews agreed, not ideal. But, with the limitations we have around media queries in this context, I couldn't really come up with anything better.
Exactly. Thanks for the review, I'll ship it for now. Hopefully we can revisit in the future with better control options! |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
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
This adjusts the alignment of the social media icons for the Follow us in social media pattern, improving the layout on mobile.
Additionally, the name and heading in the pattern is adjusted from Follow us in social media to Follow us on social media (subtle grammar update).
Note that, due to the limitations we have with mobile and media queries in patterns, this is not the ideal fix. However, it seems to be an improvement from the current layout.
Fixes #10667
Why
This is being done as a follow-up from design feedback in pdnLyh-3Tv-p2#comment-2860. As noted in #10667, the right alignment of the icon list on mobile looks broken.
Testing Instructions
Please consider any edge cases this change may have, and also other areas of the product this may impact.
Screenshots
Screencast
CleanShot.2023-08-22.at.21.45.54.mp4
WooCommerce Visibility
Required:
Checklist
Required:
[type]label or a[skip-changelog]label.Conditional:
[skip-changelog]label is not present).Changelog