Changeset 43876

Timestamp:

11/06/2018 06:16:39 AM (6 years ago)

Author:

laurelfulford

Message:

Twenty Seventeen: Fix issues with theme's Gutenberg support.

A handful of issues were missed in Twenty Seventeen's Gutenberg support, added in #45045. This commit includes the following fixes:

• Update editor placeholder text to use the correct font family.
• Center text and bullets in list-based widget blocks, when block itself is centered.
• Include non "image" variations of the Cover block classes .wp-block-cover and .wp-block-cover-text in the styles.
• Add spacing underneath the Media & Text block, but make sure the final paragraph in the block doesn't add too much space.
• Simplify selectors used to set editor width to just .wp-block.
• Prevent margin from theme's editor-style.css from interfering with editor alignment.

Props pento, davidakennedy.
Fixes #45246.

Location:

branches/5.0/src/wp-content/themes/twentyseventeen/assets/css

Files:

• blocks.css (modified) (2 diffs)
• editor-blocks.css (modified) (4 diffs)

branches/5.0/src/wp-content/themes/twentyseventeen/assets/css/blocks.css

@@ -98 +98 @@
 }
 
-/* Cover Image */
+/* Cover */
 
 .wp-block-cover-image.alignright,
+
 .wp-block-cover-image.alignleft,
-.wp-block-cover-image.aligncenter {
+.wp-block-cover.alignleft,
+.wp-block-cover-image.aligncenter,
+.wp-block-cover.aligncenter {
     display: flex;
 }
@@ -220 +223 @@
 }
 
+
+
+
+
+
+
+
+
+
+
 /*--------------------------------------------------------------
 5.0 Blocks - Widgets
 --------------------------------------------------------------*/
+
+
+
+
+
+
+
+
+
 
 /* Comments */

branches/5.0/src/wp-content/themes/twentyseventeen/assets/css/editor-blocks.css

@@ -24 +24 @@
     font-size: 15px;
     font-size: 0.9375rem;
+
+
+
+
 }
 
@@ -347 +351 @@
 /* Main column width */
 
-body.gutenberg-editor-page .edit-post-visual-editor .editor-post-title__block,
-body.gutenberg-editor-page .edit-post-visual-editor .editor-default-block-appender,
-body.gutenberg-editor-page .edit-post-visual-editor .editor-block-list__block {
-    max-width: 740px;
+.editor-styles-wrapper {
+    max-width: 100% !important; /* Override where editor-style.css is affecting this. */
+}
+
+.wp-block {
+    max-width: 674px; /* Based on one-column post width; 644px + 30px to account for padding. */
 }
 
@@ -696 +702 @@
 --------------------------------------------------------------*/
 
-/* Separators */
+/* Separator */
 
 .edit-post-visual-editor .wp-block-separator {
@@ -722 +728 @@
     white-space: nowrap;
 }
+
+
+
+
+
+
+
 /*--------------------------------------------------------------
 6.0 Blocks - Widgets
 --------------------------------------------------------------*/
+
+
+
+
+
+
+
+
 
 /* Latest Comments */