Changeset 43873

Timestamp:

11/06/2018 01:25:46 AM (6 years ago)

Author:

laurelfulford

Message:

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

A handful of issues were missed in Twenty Fourteen's Gutenberg support, added in #45042. 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.
• Remove unnecessary spacing from the Columns block.
• Add spacing underneath the Media & Text block, but make sure the final paragraph in the block doesn't add too much space.
• Include non "image" variations of the Cover block classes .wp-block-cover and .wp-block-cover-text in the styles.
• Simplify selectors used to set editor width to just .wp-block.

Props pento, davidakennedy.
Fixes #45243.

Location:

branches/5.0/src/wp-content/themes/twentyfourteen/css

Files:

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

branches/5.0/src/wp-content/themes/twentyfourteen/css/blocks.css

@@ -128 +128 @@
 }
 
-/* Cover Image */
-
-.wp-block-cover-image.aligncenter {
+/* Cover */
+
+.wp-block-cover-image.aligncenter,
+.wp-block-cover.aligncenter {
     display: flex;
 }
-
 
 /* File */
@@ -243 +243 @@
 }
 
-/* Columns */
-
-.wp-block-columns {
-    margin: 0 -0.5em;
-}
-
-.wp-block-column {
-    margin: 0 0.5em;
-}
-
 /* Separator */
 
@@ -262 +252 @@
 .wp-block-separator.is-style-wide {
     max-width: 100%;
+}
+
+/* Media & Text */
+
+.wp-block-media-text {
+    margin-bottom: 24px;
+}
+
+.wp-block-media-text *:last-child {
+    margin-bottom: 0;
 }
 
@@ -273 +273 @@
 .wp-block-categories.aligncenter,
 .wp-block-latest-posts.aligncenter {
+    list-style-position: inside;
     margin-left: 20px;
     text-align: center;

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

@@ -22 +22 @@
 .edit-post-visual-editor .editor-block-list__block p,
 .editor-default-block-appender input[type="text"].editor-default-block-appender__content {
+    font-size: 16px;
     line-height: 1.5;
+}
+
+.editor-default-block-appender input[type="text"].editor-default-block-appender__content {
+    font-family: Lato, sans-serif;
 }
 
@@ -69 +74 @@
 /* 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: 504px; /* 474 + 30 for editor block padding */
+.wp-block {
+    max-width: 504px; /* 474px + 30px to account for padding */
 }
 
@@ -308 +311 @@
 }
 
-/* Cover Image */
-
-.wp-block-cover-image.aligncenter {
+/* Cover */
+
+.wp-block-cover-image.aligncenter,
+.wp-block-cover.aligncenter {
     display: flex;
 }
@@ -401 +405 @@
 }
 
+/* Media & Text */
+
+.wp-block-media-text *:last-child {
+    margin-bottom: 0;
+}
+
 /*--------------------------------------------------------------
 6.0 Blocks - Widgets
@@ -406 +416 @@
 
 /* Archives, Categories & Latest Posts */
+
+[data-align="center"] .wp-block-archives ul,
+[data-align="center"] .wp-block-categories ul,
+[data-align="center"] .wp-block-categories ul {
+    list-style-position: inside;
+}
 
 .wp-block-archives li a,