Skip to content

Conversation

@zacharyabolton
Copy link
Contributor

@zacharyabolton zacharyabolton commented Nov 14, 2023

Description of Changes

This pull request addresses Issue #14000, where the 'like' button on blog posts was observed to be cut off when viewed on the Safari browser. The issue was caused by insufficient margin on the left of the ublog-post__like type icons.

What Has Been Done

  • Added additional left margin to the ublog-post__like icons in the ui/site/css/ublog/_post.scss file.
  • Ensured that the change does not affect the layout on other browsers (Chrome, Firefox, Edge).

Why This Solution

The added margin provides sufficient space to render the icons properly on Safari without affecting their appearance or layout on other browsers. This solution was chosen for its simplicity and effectiveness in resolving the display issue specifically on Safari.

Testing

The changes have been tested on:

  • Safari
  • Chrome
  • Firefox
  • Edge

No adverse effects on the layout or functionality were observed in these tests.

Looking forward to any feedback or further suggestions for improvement. Thank you for considering this fix!

Adjust margin for  icons in  to prevent cut-off on Safari browsers.
Copy link
Member

@fitztrev fitztrev left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the thorough testing! I tested on Safari 16.6 and looks good.

Co-authored-by: Trevor Fitzgerald <fitztrev@users.noreply.github.com>
@ornicar ornicar merged commit d1eddea into lichess-org:master Nov 15, 2023
@kraktus
Copy link
Member

kraktus commented Dec 10, 2023

Can still reproduce the issue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

4 participants