Make WordPress Core

Changeset 43874


Ignore:
Timestamp:
11/06/2018 05:56:54 AM (5 years ago)
Author:
laurelfulford
Message:

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

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

  • Center text and bullets in list-based widget blocks, when block itself is centered.
  • Add a margin to blocks that are aligned to the left or to the right, to create space.
  • 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 #45244.

Location:
branches/5.0/src/wp-content/themes/twentyfifteen/css
Files:
2 edited

Legend:

Unmodified
Added
Removed
  • branches/5.0/src/wp-content/themes/twentyfifteen/css/blocks.css

    r43798 r43874  
    6060}
    6161
     62/* Alignments */
     63
     64[class^="wp-block-"].alignleft,
     65[class^="wp-block-"] .alignleft {
     66    margin-right: 1em;
     67}
     68
     69[class^="wp-block-"].alignright,
     70[class^="wp-block-"] .alignright {
     71    margin-left: 1em;
     72}
     73
     74
    6275/*--------------------------------------------------------------
    63762.0 Blocks - Common Blocks
     
    8396}
    8497
    85 /* Cover Image */
     98/* Cover */
    8699
    87100.wp-block-cover-image .wp-block-cover-image-text,
    88 .wp-block-cover-image h2 {
     101.wp-block-cover .wp-block-cover-text,
     102.wp-block-cover-image h2,
     103.wp-block-cover h2 {
    89104    font-size: 29px;
    90105    line-height: 1.2069;
     
    188203
    189204.wp-block-cover-image.aligncenter,
     205.wp-block-cover.aligncenter,
    190206.wp-block-cover-image.alignleft,
    191 .wp-block-cover-image.alignright {
     207.wp-block-cover.alignleft,
     208.wp-block-cover-image.alignright,
     209.wp-block-cover.alignright {
    192210    display: flex;
    193211}
     
    440458}
    441459
     460/* Media & Text */
     461
     462.wp-block-media-text {
     463    margin-bottom: 1.6em;
     464}
     465
     466.wp-block-media-text *:last-child {
     467    margin-bottom: 0;
     468}
     469
    442470/*--------------------------------------------------------------
    4434715.0 Blocks - Widgets
    444472--------------------------------------------------------------*/
     473
     474/* Archives, Categories & Latest Posts */
     475
     476.wp-block-archives.aligncenter,
     477.wp-block-categories.aligncenter,
     478.wp-block-latest-posts.aligncenter {
     479    list-style-position: inside;
     480    text-align: center;
     481}
    445482
    446483/* Latest Comments */
  • branches/5.0/src/wp-content/themes/twentyfifteen/css/editor-blocks.css

    r43798 r43874  
    306306/* Main column width */
    307307
    308 body.gutenberg-editor-page .edit-post-visual-editor .editor-post-title__block,
    309 body.gutenberg-editor-page .edit-post-visual-editor .editor-default-block-appender,
    310 body.gutenberg-editor-page .edit-post-visual-editor .editor-block-list__block {
    311     max-width: 690px; /* 660px + 30px for the editor padding */
     308.editor-styles-wrapper {
     309    max-width: 100% !important; /* Override where editor-style.css is affecting this. */
     310}
     311
     312.wp-block {
     313    max-width: 690px; /* 660px + 30px to account for padding. */
    312314}
    313315
     
    557559}
    558560
    559 /* Cover Image */
     561/* Cover */
    560562
    561563.edit-post-visual-editor .editor-block-list__block .wp-block-cover-image p,
    562 .wp-block-cover-image h2 {
     564.edit-post-visual-editor .editor-block-list__block .wp-block-cover p,
     565.wp-block-cover-image h2,
     566.wp-block-cover h2 {
    563567    font-size: 29px;
    564568    line-height: 1.2069;
    565569}
    566 
    567570
    568571/* File */
     
    765768}
    766769
     770/* Media & Text */
     771
     772.wp-block-media-text *:last-child {
     773    margin-bottom: 0;
     774}
     775
    767776
    768777/*--------------------------------------------------------------
    7697786.0 Blocks - Widgets
    770779--------------------------------------------------------------*/
     780
     781/* Archives, Categories & Latest Posts */
     782
     783[data-align="center"] .wp-block-archives ul,
     784[data-align="center"] .wp-block-categories ul,
     785[data-align="center"] .wp-block-latest-posts ul {
     786    list-style-position: inside;
     787}
     788
    771789
    772790/* Latest Comments */
Note: See TracChangeset for help on using the changeset viewer.