Changeset 49728 for branches/5.6/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/quote/_editor.scss

Timestamp:

12/01/2020 07:25:43 PM (4 years ago)

Author:

desrosj

Message:

Twenty Twenty-One: Sync the latest changes for 5.6 RC2.

This will be the final sync from GitHub before placing that repository into read-only mode. All further changes should now flow entirely through Trac.

For a full list of changes since [49633], see ​https://github.com/WordPress/twentytwentyone/compare/1d5a895...53acd9b.

Props poena, luminuu, kjellr, ryelle, allancole, melchoyce, felipeelia, aljullu, kebbet, chaton666, Clorith, mkaz, ingereck, paaljoachim.
Reviewed by desrosj, SergeyBiryukov.
Merges [49726] to the 5.6 branch.
Fixes #51526.

Location:

branches/5.6

Files:

• . (modified) (1 prop)
• src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/quote/_editor.scss (modified) (4 diffs)

branches/5.6/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/quote/_editor.scss

@@ -20 +20 @@
         font-size: var(--quote--font-size);
         line-height: var(--quote--line-height);
-        position: absolute;
         left: calc(-0.5 * var(--global--spacing-horizontal));
     }
@@ -29 +28 @@
         font-style: var(--quote--font-style-cite);
 
-        .has-background:not(.has-background-background-color) &,
-        [class*="background-color"]:not(.has-background-background-color) &,
-        [style*="background-color"]:not(.has-background-background-color) &,
+        .has-background &,
+        [class*="background-color"] &,
+        [style*="background-color"] &,
         .wp-block-cover[style*="background-image"] & {
             color: currentColor;
@@ -42 +41 @@
         border-right: none;
 
+        // Hide the left aligned quote.
         &:before {
+            display: none;
+        }
+
+        // Align the quote left of the text.
+        p:before {
             content: "\201D";
-            left: initial;
-            right: calc(-0.5 * var(--global--spacing-horizontal));
+            font-size: var(--quote--font-size);
+            font-weight: normal;
+            line-height: var(--quote--line-height);
+            margin-right: 5px;
         }
     }
@@ -79 +86 @@
         &.has-text-align-right {
 
+            // Hide the left aligned quote.
             &:before {
-                left: initial;
-                right: calc(-1 * var(--global--spacing-horizontal));
+                display: none;
+            }
+
+            // Align the quote left of the text.
+            p:before {
+                content: "\201D";
+                font-size: var(--quote--font-size-large);
+                font-weight: normal;
+                line-height: var(--quote--line-height-large);
+                margin-right: 10px;
             }
         }