WordPress.org

Making WordPress.org

Opened 3 weeks ago

Last modified 3 weeks ago

#4870 new defect

Theme is missing proper image left or right alignment styling

Reported by: bph Owned by:
Milestone: Priority: normal
Component: HelpHub Keywords: needs-patch
Cc:

Description

Earlier today I tried to add an image to a text on an article. It worked fine in the editor as you can see in this screenshot:

In the preview in didn't quite translate it. It was right aligned but on its own 'plane' above the text. Here another screenshot

Attachments (3)

Screen Shot 2019-11-23 at 12.23.46 PM.png (59.6 KB) - added by bph 3 weeks ago.
Image right aligned in editor next to text
Screen Shot 2019-11-23 at 12.23.37 PM.png (58.8 KB) - added by bph 3 weeks ago.
Preview of right aligned image
_helphub.scss (1.2 KB) - added by audrasjb 3 weeks ago.
Patch directly made on the file, since HelpHub repo is not synchronized.

Download all attachments as: .zip

Change History (8)

@bph
3 weeks ago

Image right aligned in editor next to text

@bph
3 weeks ago

Preview of right aligned image

This ticket was mentioned in Slack in #docs by bph. View the logs.


3 weeks ago

#2 @bph
3 weeks ago

  • Keywords needs-design added
  • Summary changed from HelpHub Theme is missing proper image left or right alignment styling to Theme is missing proper image left or right alignment styling

#3 @bph
3 weeks ago

pardon the quirky screenshot references - n00by at work.

#4 @audrasjb
3 weeks ago

  • Keywords needs-patch added; needs-design removed

Hi,

Thanks for ticket. I can confirm the issue, this is quite uncomfortable for writing documentation.

The issue could be fixed quite easily, just need to remove this CSS rule:

.helphub-page .entry-content section .container .wp-block-image {
    overflow: hidden;
}

Cheers,
Jb

@audrasjb
3 weeks ago

Patch directly made on the file, since HelpHub repo is not synchronized.

#5 @audrasjb
3 weeks ago

So,

We need to remove this CSS rule:

.helphub-page .entry-content section .container .wp-block-image {
    overflow: hidden;
}

from https://wordpress.org/support/wp-content/themes/pub/wporg-support/sass/site/_helphub.scss

But it doesn’t exists on GitHub file: https://github.com/WordPress/HelpHub/blob/master/themes/wporg-support/sass/site/_helphub.scss

I added a patch, above this comment.

Cheers,
Jb

Note: See TracTickets for help on using tickets.