Hyperlinked text in italicized paragraphs not spacing correctly

fecgov / fec-cms

The content management system (CMS) for the new Federal Election Commission website.

https://www.fec.gov

Other

97 stars 39 forks source link

Hyperlinked text in italicized paragraphs not spacing correctly #4846

Closed djgarr closed 2 years ago

djgarr commented 3 years ago

Summary

When we have text that is hyperlinked that's contained within an italicized sentence/paragraph, the space between the unlinked and linked text appears removed in production, despite there being a space in wagtail.

Frequency

This is commonly showing up on reporting pages (such as the 2021 Monthly Report prior notices).

Work around

There is a current work around to use the Wagtail HTML block to ensure correct spacing, but we want to avoid that and use the Wagtail WYSIWYG editor.

Completion criteria:

[ ] Make sure spacing is present when there is italicized links in Wagtail

Similar Issues

[ ] #4727

djgarr commented 3 years ago

@patphongs made an update to the 2021 February Monthly Report (https://www.fec.gov/help-candidates-and-committees/dates-and-deadlines/2021-reporting-dates/february-monthly-report-notice-monthly-filing-pacs-and-parties-2021/) to correct the space issue and see if the change retains on the page

johnnyporkchops commented 3 years ago

This is being caused by a known issue : "https://github.com/wagtail/wagtail/issues/6710. It may not be fixed by Wagtail/Draftail maintaIners because it is arguably not a bug, but rather an unfortunate result of two expected behaviors combined.

The {% spaceless %} tag wrapping rich-text content is the combination. Could be resolved by either removing { % spaceless %} tag or one or two lines off css instead.

Researching which works best without breaking current or future layouot.