WordPress.org
Get WordPress

Make WordPress Core

Ticket #49843: 49843.4.patch

File 49843.4.patch, 22.8 KB (added by kjellr, 5 years ago)

  • src/wp-content/themes/twentynineteen/style-editor.css

     
    550550}
    551551
    552552/** === Editor Frame === */
    553 body .wp-block[data-align="full"] {
    554   width: calc(100% + 28px);
    555   max-width: calc(100% + 28px);
     553body .wp-block[data-align="full"],
     554body .wp-block.alignfull {
     555  width: calc(100% + 20px);
     556  max-width: calc(100% + 20px);
    556557}
    557558
    558 @media only screen and (min-width: 600px) {
    559   body .wp-block[data-align="full"] {
    560     width: calc( 100% + 116px);
    561     max-width: calc( 100% + 115px);
    562   }
     559body .wp-block[data-align="left"],
     560body .wp-block.alignleft {
     561  margin-right: 1rem;
     562  width: inherit;
    563563}
    564564
     565body .wp-block[data-align="right"],
     566body .wp-block.alignright {
     567  margin-left: 1rem;
     568  width: inherit;
     569}
     570
     571body .wp-block[data-align="center"],
     572body .wp-block.aligncenter {
     573  margin-left: 0;
     574}
     575
    565576@media only screen and (min-width: 768px) {
    566   body .editor-writing-flow {
     577  body .block-editor-writing-flow {
    567578    max-width: 80%;
    568579    margin: 0 10%;
    569580  }
    570   body .editor-default-block-appender,
    571   body .editor-block-list__block {
     581  body .block-editor-default-block-appender,
     582  body .block-editor-block-list__block {
    572583    margin-left: 0;
    573584    margin-right: 0;
    574585  }
    575   body .wp-block[data-align="wide"] {
     586  body .wp-block[data-align="wide"],
     587  body .wp-block.alignwide {
    576588    width: 100%;
    577589  }
    578   body .wp-block[data-align="right"] {
    579     max-width: 125%;
     590  body .wp-block[data-align="full"],
     591  body .wp-block.alignfull {
     592    width: calc( 125% + 20px);
     593    max-width: calc( 125% + 20px);
     594    position: relative;
     595    left: -12.5%;
    580596  }
    581597}
    582598
    … …  
    777793}
    778794
    779795/** === Post Title === */
     796.editor-post-title__block {
     797  width: 100%;
     798}
     799
    780800.editor-post-title__block:before {
    781801  background: #767676;
    782802  content: "\020";
    … …  
    13461366}
    13471367
    13481368/** === Group Block === */
    1349 .wp-block[data-type="core/group"] > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
     1369.wp-block-group > .wp-block-group__inner-container > .wp-block[data-align="full"],
     1370.wp-block-group > .wp-block-group__inner-container > .wp-block.alignfull {
    13501371  margin-left: 0;
    13511372  margin-right: 0;
     1373  left: 0;
    13521374}
    13531375
    1354 .wp-block[data-type="core/group"] > .wp-block-group.has-background {
     1376.wp-block-group .has-background {
    13551377  padding: 22px;
    13561378}
    13571379
    1358 .wp-block[data-type="core/group"] > .wp-block-group.has-background > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
     1380.wp-block-group .has-background > .wp-block-group__inner-container > .wp-block[data-align="full"],
     1381.wp-block-group .has-background > .wp-block-group__inner-container > .wp-block.alignfull {
    13591382  margin-left: -22px;
    13601383  width: calc(100% + 44px);
    13611384  max-width: calc(100% + 44px);
    … …  
    13621385}
    13631386
    13641387@media only screen and (min-width: 768px) {
    1365   .wp-block[data-type="core/group"][data-align="wide"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
     1388  .wp-block[data-align="wide"] > .wp-block-group > .wp-block-group__inner-container > .wp-block:not([data-align="wide"]):not([data-align="full"]):not(.alignwide):not(.alignfull) {
    13661389    width: calc(8 * (100vw / 12));
    13671390  }
    13681391}
    13691392
    13701393@media only screen and (min-width: 1168px) {
    1371   .wp-block[data-type="core/group"][data-align="wide"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
     1394  .wp-block[data-align="wide"] > .wp-block-group > .wp-block-group__inner-container > .wp-block:not([data-align="wide"]):not([data-align="full"]):not(.alignwide):not(.alignfull) {
    13721395    width: calc(6 * (100vw / 12 ));
    13731396  }
    13741397}
    13751398
    1376 .wp-block[data-type="core/group"][data-align="wide"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
     1399.wp-block[data-align="wide"] > .wp-block-group > .wp-block-group__inner-container > .wp-block[data-align="full"],
     1400.wp-block[data-align="wide"] > .wp-block-group > .wp-block-group__inner-container > .wp-block.alignfull {
    13771401  padding-left: 0;
    13781402  padding-right: 0;
    13791403}
    13801404
    13811405@media only screen and (min-width: 768px) {
    1382   .wp-block[data-type="core/group"][data-align="wide"] > .is-block-content > .wp-block-group.has-background > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
     1406  .wp-block[data-align="wide"] > .wp-block-group.has-background > .wp-block-group__inner-container > .wp-block:not([data-align="wide"]):not([data-align="full"]):not(.alignwide):not(.alignfull) {
    13831407    width: calc(8 * (100vw / 12) - 44px);
    13841408  }
    13851409}
    13861410
    13871411@media only screen and (min-width: 1168px) {
    1388   .wp-block[data-type="core/group"][data-align="wide"] > .is-block-content > .wp-block-group.has-background > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
     1412  .wp-block[data-align="wide"] > .wp-block-group.has-background > .wp-block-group__inner-container > .wp-block:not([data-align="wide"]):not([data-align="full"]):not(.alignwide):not(.alignfull) {
    13891413    width: calc(6 * (100vw / 12 ) - 44px);
    13901414  }
    13911415}
    13921416
    1393 @media only screen and (min-width: 600px) {
    1394   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout {
    1395     padding-left: 46px;
    1396     padding-right: 46px;
    1397   }
    1398 }
    1399 
    14001417@media only screen and (min-width: 768px) {
    1401   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout {
     1418  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group__inner-container {
    14021419    width: 80%;
    14031420    margin-left: 10%;
    14041421    margin-right: 10%;
    1405     padding-left: 48px;
    1406     padding-right: 48px;
     1422    padding-left: 10px;
     1423    padding-right: 10px;
    14071424  }
    14081425}
    14091426
    1410 .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="full"]) {
    1411   max-width: calc(100vw - (2 * 1rem));
    1412 }
    1413 
    14141427@media only screen and (min-width: 768px) {
    1415   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="full"]) {
     1428  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group__inner-container > .wp-block:not([data-align="wide"]):not(.alignwide):not([data-align="full"]):not(.alignfull) {
    14161429    max-width: calc(8 * (100vw / 12));
    14171430  }
    14181431}
    14191432
    14201433@media only screen and (min-width: 1168px) {
    1421   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="full"]) {
     1434  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group__inner-container > .wp-block:not([data-align="wide"]):not(.alignwide):not([data-align="full"]):not(.alignfull) {
    14221435    max-width: calc(6 * (100vw / 12));
    14231436  }
    14241437}
    14251438
    14261439@media only screen and (min-width: 768px) {
    1427   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="right"] {
     1440  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group__inner-container > .wp-block[data-align="right"] {
    14281441    max-width: 125%;
    14291442  }
    14301443}
    14311444
    14321445@media only screen and (min-width: 768px) {
    1433   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="wide"] {
    1434     width: calc(100% + 4px);
    1435     max-width: calc(100% + 4px);
     1446  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group__inner-container > .wp-block[data-align="wide"],
     1447  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group__inner-container > .wp-block.alignwide {
     1448    width: 100%;
     1449    max-width: 100%;
    14361450  }
    14371451}
    14381452
    1439 .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align=full] {
    1440   max-width: calc(100vw + (2 * 1rem));
    1441 }
    1442 
    1443 @media only screen and (min-width: 600px) {
    1444   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align=full] {
    1445     width: calc(100% + 92px);
    1446     left: -46px;
    1447   }
    1448 }
    1449 
    14501453@media only screen and (min-width: 768px) {
    1451   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align=full] {
    1452     left: calc(-12.5% - 58px);
    1453     width: calc(125% + 120px);
    1454     max-width: calc(125% + 119px);
     1454  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group__inner-container > .wp-block[data-align=full],
     1455  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group__inner-container > .wp-block.alignfull {
     1456    left: calc( -12.5% - 13px);
     1457    width: calc( 125% + 26px);
     1458    max-width: calc( 125% + 25px);
    14551459  }
    14561460}
    14571461
    1458 .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group.has-background {
     1462.wp-block[data-align="full"] > .wp-block-group > .wp-block-group.has-background {
    14591463  padding: 22px 0;
    14601464}
    14611465
    14621466@media only screen and (min-width: 600px) {
    1463   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group.has-background {
     1467  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group.has-background {
    14641468    padding-left: 0;
    14651469    padding-right: 0;
    14661470  }
    14671471}
    14681472
    1469 .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group.has-background > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
     1473.wp-block[data-align="full"] > .wp-block-group > .wp-block-group.has-background > .wp-block-group__inner-container > .wp-block[data-align="full"],
     1474.wp-block[data-align="full"] > .wp-block-group > .wp-block-group.has-background > .wp-block-group__inner-container > .wp-block.alignfull {
    14701475  margin-left: 0;
    14711476  width: 100%;
    14721477}
    14731478
    14741479@media only screen and (min-width: 600px) {
    1475   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group.has-background > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
     1480  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group.has-background > .wp-block-group__inner-container > .wp-block[data-align="full"],
     1481  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group.has-background > .wp-block-group__inner-container > .wp-block.alignfull {
    14761482    width: calc(100% + 92px);
    14771483  }
    14781484}
    14791485
    14801486@media only screen and (min-width: 768px) {
    1481   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group.has-background > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
     1487  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group.has-background > .wp-block-group__inner-container > .wp-block[data-align="full"],
     1488  .wp-block[data-align="full"] > .wp-block-group > .wp-block-group.has-background > .wp-block-group__inner-container > .wp-block.alignfull {
    14821489    width: calc(125% + 120px);
    14831490  }
    14841491}

  • src/wp-content/themes/twentynineteen/style-editor.scss

     
    1111
    1212body {
    1313
    14         .wp-block[data-align="full"] {
    15                 width: calc(100% + 28px);
    16                 max-width: calc(100% + 28px);
     14        .wp-block[data-align="full"],
     15        .wp-block.alignfull {
     16                width: calc(100% + 20px);
     17                max-width: calc(100% + 20px);
    1718        }
    1819
    19         @include media(mobile) {
     20        .wp-block[data-align="left"],
     21        .wp-block.alignleft, {
     22                margin-right: $size__spacing-unit;
     23                width: inherit;
     24        }
    2025
    21                 .wp-block[data-align="full"] {
    22                         width: calc( 100% + 116px );
    23                         max-width: calc( 100% + 115px );
    24                 }
     26        .wp-block[data-align="right"],
     27        .wp-block.alignright, {
     28                margin-left: $size__spacing-unit;
     29                width: inherit;
    2530        }
    2631
     32        .wp-block[data-align="center"],
     33        .wp-block.aligncenter, {
     34                margin-left: 0;
     35        }
     36
    2737        @include media(tablet) {
    2838
    29                 .editor-writing-flow {
     39                .block-editor-writing-flow {
    3040                        max-width: 80%;
    3141                        margin: 0 10%;
    3242                }
    3343
    34                 .editor-default-block-appender,
    35                 .editor-block-list__block {
     44                .block-editor-default-block-appender,
     45                .block-editor-block-list__block {
    3646                        margin-left: 0;
    3747                        margin-right: 0;
    3848                }
    3949
    40                 .wp-block[data-align="wide"] {
     50                .wp-block[data-align="wide"],
     51                .wp-block.alignwide {
    4152                        width: 100%;
    4253                }
    4354
    44                 .wp-block[data-align="right"] {
    45                         max-width: 125%;
     55                .wp-block[data-align="full"],
     56                .wp-block.alignfull {
     57                        width: calc( 125% + 20px );
     58                        max-width: calc( 125% + 20px );
     59                        position: relative;
     60                        left: -12.5%;
    4661                }
    4762        }
    4863}
    … …  
    190205/** === Post Title === */
    191206
    192207.editor-post-title__block {
     208        width: 100%;
    193209        @include post-section-dash;
    194210
    195211        &:before {
    … …  
    779795// size is different here.
    780796$group-block-background__padding: $font__size_base;
    781797
    782 .wp-block[data-type="core/group"] {
     798.wp-block-group {
    783799
    784         // Group block base styles
    785         > .wp-block-group {
    786 
    787                 // Child: Full alignment
    788                 > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
    789                         margin-left: 0;
    790                         margin-right: 0;
    791                 }
     800        // Child: Full alignment
     801        > .wp-block-group__inner-container > .wp-block[data-align="full"],
     802        > .wp-block-group__inner-container > .wp-block.alignfull {
     803                margin-left: 0;
     804                margin-right: 0;
     805                left: 0;
    792806        }
    793807
    794808        // Group block with background color
    795         > .wp-block-group.has-background {
     809        .has-background {
    796810                padding: $group-block-background__padding;
    797811
    798812                // Child: Full alignment
    799                 > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
     813                > .wp-block-group__inner-container > .wp-block[data-align="full"],
     814                > .wp-block-group__inner-container > .wp-block.alignfull {
    800815                        margin-left: -$group-block-background__padding;
    801816                        width: calc(100% + #{$group-block-background__padding * 2});
    802817                        max-width: calc(100% + #{$group-block-background__padding * 2});
    803818                }
    804819        }
     820}
    805821
    806         // Wide and full alignments
    807         &[data-align="wide"] > .is-block-content {
     822// Wide and full alignments
     823.wp-block[data-align="wide"] > .wp-block-group {
    808824
    809                 // Group block base styles.
    810                 > .wp-block-group {
     825        > .wp-block-group__inner-container > .wp-block:not([data-align="wide"]):not([data-align="full"]):not(.alignwide):not(.alignfull) {
     826                @include media(tablet) {
     827                        width: calc(8 * (100vw / 12));
     828                }
    811829
    812                         // Child blocks: Default alignments
    813                         > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
    814                                 @include media(tablet) {
    815                                         width: calc(8 * (100vw / 12));
    816                                 }
     830                @include media(desktop) {
     831                        width: calc(6 * (100vw / 12 ));
     832                }
     833        }
    817834
    818                                 @include media(desktop) {
    819                                         width: calc(6 * (100vw / 12 ));
    820                                 }
    821                         }
     835        // Child blocks: Full alignment
     836        > .wp-block-group__inner-container > .wp-block[data-align="full"],
     837        > .wp-block-group__inner-container > .wp-block.alignfull {
     838                padding-left: 0;
     839                padding-right: 0;
     840        }
    822841
    823                         // Child blocks: Full alignment
    824                         > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
    825                                 padding-left: 0;
    826                                 padding-right: 0;
     842
     843        // Group block with background color
     844        &.has-background {
     845               
     846                // Child blocks: Default alignments
     847                > .wp-block-group__inner-container > .wp-block:not([data-align="wide"]):not([data-align="full"]):not(.alignwide):not(.alignfull) {
     848                        @include media(tablet) {
     849                                width: calc(8 * (100vw / 12) - #{$group-block-background__padding * 2});
    827850                        }
    828                 }
    829851
    830                 // Group block with background color
    831                 > .wp-block-group.has-background {
    832                        
    833                         // Child blocks: Default alignments
    834                         > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
    835                                 @include media(tablet) {
    836                                         width: calc(8 * (100vw / 12) - #{$group-block-background__padding * 2});
    837                                 }
    838 
    839                                 @include media(desktop) {
    840                                         width: calc(6 * (100vw / 12 ) - #{$group-block-background__padding * 2});
    841                                 }
     852                        @include media(desktop) {
     853                                width: calc(6 * (100vw / 12 ) - #{$group-block-background__padding * 2});
    842854                        }
    843855                }
    844856        }
     857}
    845858
    846         // Full alignment
    847         &[data-align="full"] {
     859// Full alignment
     860.wp-block[data-align="full"] > .wp-block-group {
    848861
    849                 // Group block base styles
    850                 > .is-block-content > .wp-block-group {
     862                // Margins & padding are added to this container to mimic
     863                // the style + spacing of the .editor-writing-flow global
     864                // container. This way, child items sync up with the placement
     865                // and size of other top-level blocks.
     866                > .wp-block-group__inner-container {
    851867
    852                         // Margins & padding are added to this container to mimic
    853                         // the style + spacing of the .editor-writing-flow global
    854                         // container. This way, child items sync up with the placement
    855                         // and size of other top-level blocks.
    856                         > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout {
     868                        // 2px of extra padding are added to each side here
     869                        // To better match up with the spacing of the whole
     870                        // document.
     871                        @include media(tablet) {
     872                                width: 80%;
     873                                margin-left: 10%;
     874                                margin-right: 10%;
     875                                padding-left: 10px;
     876                                padding-right: 10px;
     877                        }
    857878
    858                                 @include media(mobile) {
    859                                         padding-left: 46px;
    860                                         padding-right: 46px;
    861                                 }
     879                        // Child blocks: Normal Alignments
     880                        > .wp-block:not([data-align="wide"]):not(.alignwide):not([data-align="full"]):not(.alignfull) {
    862881
    863                                 // 2px of extra padding are added to each side here
    864                                 // To better match up with the spacing of the whole
    865                                 // document.
    866882                                @include media(tablet) {
    867                                         width: 80%;
    868                                         margin-left: 10%;
    869                                         margin-right: 10%;
    870                                         padding-left: 48px;
    871                                         padding-right: 48px;
     883                                        max-width: calc(8 * (100vw / 12));
    872884                                }
    873885
    874                                 // Child blocks: All alignments except full
    875                                  > .wp-block:not([data-align="full"]) {
    876                                         max-width: calc(100vw - (2 * 1rem));
    877 
    878                                         @include media(tablet) {
    879                                                 max-width: calc(8 * (100vw / 12));
    880                                         }
    881 
    882                                         @include media(desktop) {
    883                                                 max-width: calc(6 * (100vw / 12));
    884                                         }
     886                                @include media(desktop) {
     887                                        max-width: calc(6 * (100vw / 12));
    885888                                }
     889                        }
    886890
    887                                 // Child blocks: Right alignments
    888                                 > .wp-block[data-align="right"] {
     891                        // Child blocks: Right alignments
     892                        > .wp-block[data-align="right"] {
    889893
    890                                         @include media(tablet) {
    891                                                 max-width: 125%;
    892                                         }
     894                                @include media(tablet) {
     895                                        max-width: 125%;
    893896                                }
     897                        }
    894898
    895                                 // Child blocks: Wide alignments
    896                                 > .wp-block[data-align="wide"] {
     899                        // Child blocks: Wide alignments
     900                        > .wp-block[data-align="wide"],
     901                        > .wp-block.alignwide {
    897902
    898                                         @include media(tablet) {
    899                                                 width: calc(100% + 4px);
    900                                                 max-width: calc(100% + 4px);
    901                                         }
     903                                @include media(tablet) {
     904                                        width: 100%;
     905                                        max-width: 100%;
    902906                                }
     907                        }
    903908
    904                                 // Child blocks: Full alignments
    905                                 > .wp-block[data-align=full] {
    906                                         max-width: calc(100vw + (2 * 1rem));
     909                        // Child blocks: Full alignments
     910                        > .wp-block[data-align=full],
     911                        > .wp-block.alignfull {
    907912
    908                                         @include media(mobile) {
    909                                                 width: calc(100% + 92px);
    910                                                 left: -46px;
    911                                         }
    912 
    913                                         @include media(tablet) {
    914                                                 left: calc(-12.5% - 58px);
    915                                                 width: calc(125% + 120px);
    916                                                 max-width: calc(125% + 119px);
    917                                         }
     913                                @include media(tablet) {
     914                                        left: calc( -12.5% - 13px );
     915                                        width: calc( 125% + 26px );
     916                                        max-width: calc( 125% + 25px );
    918917                                }
    919918                        }
    920919                }
    921920
    922921                // Group block with background color
    923                 > .is-block-content > .wp-block-group.has-background {
     922                > .wp-block-group.has-background {
    924923
    925                         // When the Group block is full width, we can remove the left/right padding
    926                         // and let this inherit the
     924                        // When the Group block is full width, we can remove the left/right padding.
    927925                        padding: $group-block-background__padding 0;
    928926
    929927                        @include media(mobile) {
    … …  
    932930                        }
    933931
    934932                        // Child blocks: Full alignment
    935                         > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
     933                        > .wp-block-group__inner-container > .wp-block[data-align="full"],
     934                        > .wp-block-group__inner-container > .wp-block.alignfull {
    936935                                margin-left: 0;
    937936                                width: 100%;
    938937
    … …  
    946945                        }
    947946                }
    948947        }
    949 }

  • src/wp-content/themes/twentynineteen/style-rtl.css

     
    56405640}
    56415641
    56425642@-moz-document url-prefix() {
    5643   .entry .entry-content .has-drop-cap:not(:focus)::first-letter {
     5643  .entry .entry-content .has-drop-cap:not(:focus):first-letter {
    56445644    margin-top: 0.2em;
    56455645  }
    56465646}
    … …  
    60236023                 * is followed by an H1, or H2 */
    60246024}
    60256025
     6026.entry .entry-content .wp-block-separator:not(.wp-block-separator),
     6027.entry .entry-content hr:not(.wp-block-separator) {
     6028  max-width: 100%;
     6029}
     6030
     6031@media only screen and (min-width: 768px) {
     6032  .entry .entry-content .wp-block-separator:not(.wp-block-separator),
     6033  .entry .entry-content hr:not(.wp-block-separator) {
     6034    max-width: calc(8 * (100vw / 12) - 28px);
     6035  }
     6036}
     6037
     6038@media only screen and (min-width: 1168px) {
     6039  .entry .entry-content .wp-block-separator:not(.wp-block-separator),
     6040  .entry .entry-content hr:not(.wp-block-separator) {
     6041    max-width: calc(6 * (100vw / 12) - 28px);
     6042  }
     6043}
     6044
    60266045.entry .entry-content .wp-block-separator.is-style-wide,
    60276046.entry .entry-content hr.is-style-wide {
    60286047  max-width: 100%;