Skip to content
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.

Sign up for GitHub

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

Jump to bottom

Use relative units for social-icons block #24413

Closed
wants to merge 1 commit into from
Closed

Use relative units for social-icons block #24413

wants to merge 1 commit into from

Conversation

aristath
Copy link
Member

@aristath aristath commented Aug 6, 2020

Currently thiis block uses absolute units (px) for everything.
As a result, it looks a bit funky when the theme tweaks the base font-size.

This PR changes all units to relative (rem) so icons can scale depending on the theme's defined font-size.

Before:

Theme using a large font-size

Screenshot_2020-08-06 test – lemon(7)

Theme using a small font-size

Screenshot_2020-08-06 test – lemon(6)

After:

Theme using a large font-size

Screenshot_2020-08-06 test – lemon(8)

Theme using a small font-size

Screenshot_2020-08-06 test – lemon(9)

@aristath aristath requested a review from mkaz as a code owner August 6, 2020 13:13
@ZebulanStanphill ZebulanStanphill added [Feature] Themes Questions or issues with incorporating or styling blocks in a theme. [Package] Block library /packages/block-library [Type] Enhancement A suggestion for improvement. CSS Styling Related to editor and front end styles, CSS-specific issues. [Block] Social Affects the Social Block - used to display Social Media accounts labels Aug 11, 2020
@aristath aristath mentioned this pull request Aug 12, 2020
Merged
@aristath
Copy link
Member Author

Combined with other PRs in #24523

@aristath aristath closed this Aug 13, 2020
@aristath aristath deleted the aristath/social-icons-relative-units branch August 13, 2020 13:16
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@mkaz mkaz Awaiting requested review from mkaz

Assignees
No one assigned
Labels
[Block] Social Affects the Social Block - used to display Social Media accounts CSS Styling Related to editor and front end styles, CSS-specific issues. [Feature] Themes Questions or issues with incorporating or styling blocks in a theme. [Package] Block library /packages/block-library [Type] Enhancement A suggestion for improvement.
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@aristath @ZebulanStanphill