Ticket #45038: 45038.diff

wp-content/themes/twentyten/blocks.css

@@ +1 @@
+/*
+Theme Name: Twenty Ten
+Description: Used to style Gutenberg Blocks.
+*/
+
+/*--------------------------------------------------------------
+>>> TABLE OF CONTENTS:
+----------------------------------------------------------------
+1.0 General Block Styles
+2.0 Blocks - Common Blocks
+3.0 Blocks - Formatting
+--------------------------------------------------------------*/
+
+/*--------------------------------------------------------------
+1.0 General Block Styles
+--------------------------------------------------------------*/
+
+/* Captions */
+
+figure {
+  background: #f1f1f1;
+  margin-bottom: 20px;
+  max-width: 632px !important;
+}
+
+.wp-block-image .aligncenter > figcaption,
+.wp-block-image .alignleft > figcaption,
+.wp-block-image .alignright > figcaption,
+.wp-block-image.is-resized > figcaption {
+  display: block;
+  padding: 4px;
+  text-align: center;
+}
+
+/*--------------------------------------------------------------
+2.0 Blocks - Common Blocks
+--------------------------------------------------------------*/
+
+.wp-block-quote:not(.is-large):not(.is-style-large) {
+  border-left: none;
+}
+
+.wp-block-image.alignfull,
+.wp-block-image.alignfull img {
+  margin: 0;
+}
+
+.wp-block-image,
+.wp-block-image img {
+  display: block;
+}
+
+.wp-caption {
+  background: #f1f1f1;
+  line-height: 18px;
+  margin-bottom: 20px;
+  max-width: 632px !important;
+  padding: 4px;
+  text-align: center;
+}
+
+/*--------------------------------------------------------------
+3.0 Blocks - Formatting
+--------------------------------------------------------------*/
+
+.wp-block-table td,
+.wp-block-table th {
+  border: none;
+}
+
+.wp-block-table td {
+  border-top: 1px solid #e7e7e7;
+}
+
+.wp-block-table tr:nth-child(odd) td {
+  background: #f2f7fc;
+}
+

wp-content/themes/twentyten/editor-blocks.css

@@ +1 @@
+/*
+Theme Name: Twenty Ten
+Description: Used to style Gutenberg Blocks in the editor.
+*/
+
+/*--------------------------------------------------------------
+>>> TABLE OF CONTENTS:
+----------------------------------------------------------------
+1.0 General Block Styles
+2.0 Blocks - Common Blocks
+--------------------------------------------------------------*/
+
+/*--------------------------------------------------------------
+1.0 General Block Styles
+--------------------------------------------------------------*/
+
+/* Captions */
+
+[data-type="core/image"][data-align=center] .editor-block-list__block-edit .editor-rich-text,
+[data-type="core/image"][data-align=left] .editor-block-list__block-edit .editor-rich-text,
+[data-type="core/image"][data-align=right] .editor-block-list__block-edit .editor-rich-text {
+  display: block;
+}
+
+[data-type="core/image"][data-align=center] .editor-block-list__block-edit figure,
+[data-type="core/image"][data-align=left] .editor-block-list__block-edit figure,
+[data-type="core/image"][data-align=right] .editor-block-list__block-edit figure {
+  background: #f1f1f1;
+  margin-bottom: 20px;
+  max-width: 632px !important;
+}
+
+[data-type="core/image"][data-align=center] .editor-block-list__block-edit figure > figcaption,
+[data-type="core/image"][data-align=left] .editor-block-list__block-edit figure > figcaption,
+[data-type="core/image"][data-align=right] .editor-block-list__block-edit {
+  display: block;
+  padding: 4px;
+  text-align: center;
+}
+
+/*--------------------------------------------------------------
+2.0 Blocks - Common Blocks
+--------------------------------------------------------------*/Twenty
+
+.wp-block-quote:not(.is-large):not(.is-style-large) {
+  border-left: none;
+  padding-left: 1em;
+}
+
+.wp-block-image,
+.wp-block-image img {
+  display: block;
+}
+
+.edit-post-visual-editor .editor-block-list__block[data-align=full] {
+  max-width: 610px;
+  margin: auto;
+}
+
+.components-toolbar__control.components-button:not(:disabled).is-active > svg,
+.components-toolbar__control.components-button:not(:disabled).is-active > svg > * {
+  color: #fff;
+}
+ No newline at end of file

wp-content/themes/twentyten/functions.php

@@ -76 +76 @@
                 // This theme styles the visual editor with editor-style.css to match the theme style.
                 add_editor_style();
 
+                // Load regular editor styles into the new block-based editor.
+                add_theme_support( 'editor-styles' );
+
+                // Load default block styles.
+                add_theme_support( 'wp-block-styles' );
+
                 // Post Format support. You can also use the legacy "gallery" or "asides" (note the plural) categories.
                 add_theme_support( 'post-formats', array( 'aside', 'gallery' ) );
 
@@ -655 +661 @@
         return $args;
 }
 add_filter( 'widget_tag_cloud_args', 'twentyten_widget_tag_cloud_args' );
+
+/**
+ * Enqueue scripts and styles for front end.
+ *
+ * @since Twenty Ten 2.5
+ */
+function twentyten_scripts_styles() {
+    // Theme block stylesheet.
+    wp_enqueue_style( 'twentyten-block-style', get_theme_file_uri( '/blocks.css' ), array(), '1.0' );
+}
+add_action( 'wp_enqueue_scripts', 'twentyten_scripts_styles' );
+
+/**
+ * Enqueue editor styles for Gutenberg
+ *
+ * @since Twenty Ten 2.5
+ */
+function twentyten_block_editor_styles() {
+    // Block styles.
+    wp_enqueue_style( 'twentyten-block-editor-style', get_template_directory_uri() . '/editor-blocks.css' );
+}
+add_action( 'enqueue_block_editor_assets', 'twentyten_block_editor_styles' );
+
+