Make WordPress Core

Ticket #45907: twentynineteen-classic-editor-alignright-fix.patch

File twentynineteen-classic-editor-alignright-fix.patch, 1.3 KB (added by sachinrajcp123, 2 months ago)
Line 
1*** a/wp-content/themes/twentynineteen/style.css
2--- b/wp-content/themes/twentynineteen/style.css
3@@
4 /* --------------------------------------------------------------
5 5.0 Blocks
6 -------------------------------------------------------------- */
7 
8+/**
9+ * Fix: Classic Editor right-aligned, uncaptioned images inside <p>
10+ * should extend (bleed) beyond the content column like other right-aligned elements.
11+ * See: https://github.com/WordPress/twentynineteen/issues/688
12+ */
13+@media screen and (min-width: 768px) {
14+       .entry .entry-content p > img.alignright,
15+       .entry .entry-summary p > img.alignright {
16+               /* Ensure the image can exceed the paragraph's max-width */
17+               max-width: none;
18+               height: auto;
19+
20+               /* Keep it floated right, but let it bleed outside the text column */
21+               float: right;
22+               /* Pull image to the right by half the leftover viewport width outside the content column */
23+               margin-right: calc((100vw - 100%) / -2);
24+
25+               /* Maintain the default spacing on the left so text wraps nicely */
26+               margin-left: 1.5em;
27+       }
28+
29+       /* Avoid overflow clipping on the paragraph wrapper in certain browsers */
30+       .entry .entry-content p:has(> img.alignright),
31+       .entry .entry-summary p:has(> img.alignright) {
32+               overflow: visible;
33+       }
34+}
35+
36 /* Group */
37 .wp-block-group.has-background,
38 .wp-block-group__inner-container.has-background {
39        padding: 1.25em 2.375em;
40 }