Automattic / Automattic/jetpack

Gif block styles conflict with theme block styles

Open
#16,855 0 comments 0 reactions 0 assignees View on GitHub
[Block] GIF [Pri] Normal Bug Good For Community
Dominant language
PHP
Stars
1.8k
Forks
898
Avg merge
1d 18h
Merged PRs (30d)
774

Description

When I embed the Jetpack gif block it does not honor the themes margin properties. In particular when I set the block to alignfull. The alignfull margin in the theme is set to have a negative left margin so that the content can stretch full width, but the gif block overrides this value.

I would suggest making the margin in the block less specific.

If you change this line:
https://github.com/Automattic/jetpack/blob/fcf029c3deb172b4982f2a9d964b999aab1aa438/extensions/blocks/gif/style.scss#L5

So that it is: `margin-bottom: 20px;` then my negative side margins will still work.

Thanks - Ben

Contributor guide

Open the contributing guide

Research direction

Start with extensions/blocks/gif/style.scss at the linked line and inspect how its margin declaration interacts with the theme's alignfull styles. Verify the GIF block in an alignfull theme layout, and consider the issue complete when the theme's negative side margins are preserved while the block's bottom spacing remains correct.

Written by the indexing model from the issue text.

Assessment

Tech stack
scss
Domain
frontend
Issue type
Bug
Difficulty
1/5
Estimated time
Under an hour
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.