Changeset 58689

Timestamp:

07/08/2024 03:42:09 PM (11 months ago)

Author:

karmatosed

Message:

Twenty Sixteen: Fixes pullquote issues with border spacing.

Pullquote spacings wasn't reflected on front when using border settings. This caused double borders which was due to styling but this was done before optional borders were implemented. The pull request chosen presumes when you have an external border you no longer want the internal one but does look visually better.

Props nidhidhandhukiya, huzaifaalmesbah, poena, sabernhardt.
Fixes #59754.

Location:

trunk/src/wp-content/themes/twentysixteen/css

Files:

• blocks.css (modified) (13 diffs)
• editor-blocks.css (modified) (1 diff)

trunk/src/wp-content/themes/twentysixteen/css/blocks.css

@@ -172 +172 @@
 .wp-block-pullquote blockquote {
     color: #686868;
-    border-left: 4px solid #1a1a1a;
+    border: 0;
     margin: 0;
-    padding: 0 0 0 24px;
-}
-
-.rtl .wp-block-pullquote blockquote {
-    border-left: none;
-    border-right: 4px solid #1a1a1a;
-    padding: 0 24px 0 0;
+    padding: 0;
+}
+
+.entry-content .wp-block-pullquote blockquote:not(.alignleft):not(.alignright) {
+    margin-left: 0;
+    margin-right: 0;
+}
+
+.wp-block-pullquote:where([style*="border-width"]) blockquote {
+    padding-left: 1rem;
+    padding-right: 1rem;
 }
 
@@ -391 +395 @@
 }
 
+.has-dark-gray-border-color {
+    border-color: #1a1a1a;
+}
+
 .has-medium-gray-color {
     color: #686868;
@@ -399 +407 @@
 }
 
+.has-medium-gray-border-color {
+    border-color: #686868;
+}
+
 .has-light-gray-color {
     color: #e5e5e5;
@@ -407 +419 @@
 }
 
+.has-light-gray-border-color {
+    border-color: #e5e5e5;
+}
+
 .has-white-color {
     color: #fff;
@@ -415 +431 @@
 }
 
+.has-white-border-color {
+    border-color: #fff;
+}
+
 .has-blue-gray-color {
     color: #4d545c;
@@ -423 +443 @@
 }
 
+.has-blue-gray-border-color {
+    border-color: #4d545c;
+}
+
 .has-bright-blue-color {
     color: #007acc;
@@ -431 +455 @@
 }
 
+.has-bright-blue-border-color {
+    border-color: #007acc;
+}
+
 .has-light-blue-color {
     color: #9adffd;
@@ -439 +467 @@
 }
 
+.has-light-blue-border-color {
+    border-color: #9adffd;
+}
+
 .has-dark-brown-color {
     color: #402b30;
@@ -447 +479 @@
 }
 
+.has-dark-brown-border-color {
+    border-color: #402b30;
+}
+
 .has-medium-brown-color {
     color: #774e24;
@@ -455 +491 @@
 }
 
+.has-medium-brown-border-color {
+    border-color: #774e24;
+}
+
 .has-dark-red-color {
     color: #640c1f;
@@ -463 +503 @@
 }
 
+.has-dark-red-border-color {
+    border-color: #640c1f;
+}
+
 .has-bright-red-color {
     color: #ff675f;
@@ -471 +515 @@
 }
 
+.has-bright-red-border-color {
+    border-color: #ff675f;
+}
+
 .has-yellow-color {
     color: #ffef8e;
@@ -478 +526 @@
     background-color: #ffef8e;
 }
+
+.has-yellow-border-color {
+    border-color: #ffef8e;
+}

trunk/src/wp-content/themes/twentysixteen/css/editor-blocks.css

@@ -500 +500 @@
 /* Pullquote */
 
-.editor-block-list__block .wp-block-pullquote blockquote {
+.editor-styles-wrapper .wp-block-pullquote blockquote {
     border: 0;
     margin: 0;
     padding: 0;
+}
+
+.editor-styles-wrapper .wp-block-pullquote:where([style*="border-width"]) blockquote {
+    padding-left: 1rem;
+    padding-right: 1rem;
 }