Make WordPress Core

Ticket #49843: 49843.patch

File 49843.patch, 27.6 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"] {
     553body .wp-block[data-align="full"],
     554body .wp-block.alignfull {
    554555  width: calc(100% + 28px);
    555556  max-width: calc(100% + 28px);
    556557}
    557558
    558559@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);
     560  body .wp-block[data-align="full"],
     561  body .wp-block.alignfull {
     562    width: calc( 125% + 90px);
     563    max-width: calc( 125% + 89px);
     564    left: calc( -12.5% - 8px);
    562565  }
    563566}
    564567
    565568@media only screen and (min-width: 768px) {
    566   body .editor-writing-flow {
     569  body .block-editor-writing-flow {
    567570    max-width: 80%;
    568571    margin: 0 10%;
    569572  }
    570   body .editor-default-block-appender,
    571   body .editor-block-list__block {
     573  body .block-editor-default-block-appender,
     574  body .block-editor-block-list__block {
    572575    margin-left: 0;
    573576    margin-right: 0;
    574577  }
    575   body .wp-block[data-align="wide"] {
     578  body .wp-block[data-align="wide"],
     579  body .wp-block.alignwide {
    576580    width: 100%;
    577581  }
    578582  body .wp-block[data-align="right"] {
     
    759763}
    760764
    761765/** === Post Title === */
     766.editor-post-title__block {
     767  width: 100%;
     768}
     769
    762770.editor-post-title__block:before {
    763771  background: #767676;
    764772  content: "\020";
     
    13131321}
    13141322
    13151323/** === Group Block === */
    1316 .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"] {
     1324.wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"],
     1325.wp-block-group > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block.alignfull {
    13171326  margin-left: 0;
    13181327  margin-right: 0;
     1328  left: 0;
    13191329}
    13201330
    1321 .wp-block[data-type="core/group"] > .wp-block-group.has-background {
     1331.wp-block-group .has-background {
    13221332  padding: 22px;
    13231333}
    13241334
    1325 .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"] {
     1335.wp-block-group .has-background > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"],
     1336.wp-block-group .has-background > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block.alignfull {
    13261337  margin-left: -22px;
    13271338  width: calc(100% + 44px);
    13281339  max-width: calc(100% + 44px);
     
    13291340}
    13301341
    13311342@media only screen and (min-width: 768px) {
    1332   .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"]) {
     1343  .wp-block-group[data-align="wide"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]):not(.alignwide):not(.alignfull) {
    13331344    width: calc(8 * (100vw / 12));
    13341345  }
    13351346}
    13361347
    13371348@media only screen and (min-width: 1168px) {
    1338   .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"]) {
     1349  .wp-block-group[data-align="wide"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]):not(.alignwide):not(.alignfull) {
    13391350    width: calc(6 * (100vw / 12 ));
    13401351  }
    13411352}
    13421353
    1343 .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"] {
     1354.wp-block-group[data-align="wide"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"],
     1355.wp-block-group[data-align="wide"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block.alignfull {
    13441356  padding-left: 0;
    13451357  padding-right: 0;
    13461358}
    13471359
    13481360@media only screen and (min-width: 768px) {
    1349   .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"]) {
     1361  .wp-block-group[data-align="wide"].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"]):not(.alignwide):not(.alignfull) {
    13501362    width: calc(8 * (100vw / 12) - 44px);
    13511363  }
    13521364}
    13531365
    13541366@media only screen and (min-width: 1168px) {
    1355   .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"]) {
     1367  .wp-block-group[data-align="wide"].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"]):not(.alignwide):not(.alignfull) {
    13561368    width: calc(6 * (100vw / 12 ) - 44px);
    13571369  }
    13581370}
    13591371
    13601372@media only screen and (min-width: 600px) {
    1361   .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 {
     1373  .wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout {
    13621374    padding-left: 46px;
    13631375    padding-right: 46px;
    13641376  }
     
    13651377}
    13661378
    13671379@media only screen and (min-width: 768px) {
    1368   .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 {
     1380  .wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout {
    13691381    width: 80%;
    13701382    margin-left: 10%;
    13711383    margin-right: 10%;
     
    13741386  }
    13751387}
    13761388
    1377 .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"]) {
     1389.wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="full"]):not(.alignfull) {
    13781390  max-width: calc(100vw - (2 * 1rem));
    13791391}
    13801392
    13811393@media only screen and (min-width: 768px) {
    1382   .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"]) {
     1394  .wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="full"]):not(.alignfull) {
    13831395    max-width: calc(8 * (100vw / 12));
    13841396  }
    13851397}
    13861398
    13871399@media only screen and (min-width: 1168px) {
    1388   .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"]) {
     1400  .wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="full"]):not(.alignfull) {
    13891401    max-width: calc(6 * (100vw / 12));
    13901402  }
    13911403}
    13921404
    13931405@media only screen and (min-width: 768px) {
    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 > .wp-block[data-align="right"] {
     1406  .wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="right"] {
    13951407    max-width: 125%;
    13961408  }
    13971409}
    13981410
    13991411@media only screen and (min-width: 768px) {
    1400   .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"] {
     1412  .wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="wide"],
     1413  .wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block.alignwide {
    14011414    width: calc(100% + 4px);
    14021415    max-width: calc(100% + 4px);
    14031416  }
    14041417}
    14051418
    1406 .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] {
     1419.wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align=full],
     1420.wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block.alignfull {
    14071421  max-width: calc(100vw + (2 * 1rem));
    14081422}
    14091423
    14101424@media only screen and (min-width: 600px) {
    1411   .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] {
     1425  .wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align=full],
     1426  .wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block.alignfull {
    14121427    width: calc(100% + 92px);
    14131428    left: -46px;
    14141429  }
     
    14151430}
    14161431
    14171432@media only screen and (min-width: 768px) {
    1418   .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] {
     1433  .wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align=full],
     1434  .wp-block-group[data-align="full"] > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block.alignfull {
    14191435    left: calc(-12.5% - 58px);
    14201436    width: calc(125% + 120px);
    14211437    max-width: calc(125% + 119px);
     
    14221438  }
    14231439}
    14241440
    1425 .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group.has-background {
     1441.wp-block-group[data-align="full"] > .is-block-content > .wp-block-group.has-background {
    14261442  padding: 22px 0;
    14271443}
    14281444
    14291445@media only screen and (min-width: 600px) {
    1430   .wp-block[data-type="core/group"][data-align="full"] > .is-block-content > .wp-block-group.has-background {
     1446  .wp-block-group[data-align="full"] > .is-block-content > .wp-block-group.has-background {
    14311447    padding-left: 0;
    14321448    padding-right: 0;
    14331449  }
    14341450}
    14351451
    1436 .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"] {
     1452.wp-block-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"],
     1453.wp-block-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.alignfull {
    14371454  margin-left: 0;
    14381455  width: 100%;
    14391456}
    14401457
    14411458@media only screen and (min-width: 600px) {
    1442   .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"] {
     1459  .wp-block-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"],
     1460  .wp-block-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.alignfull {
    14431461    width: calc(100% + 92px);
    14441462  }
    14451463}
    14461464
    14471465@media only screen and (min-width: 768px) {
    1448   .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"] {
     1466  .wp-block-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"],
     1467  .wp-block-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.alignfull {
    14491468    width: calc(125% + 120px);
    14501469  }
    14511470}
  • src/wp-content/themes/twentynineteen/style-editor.scss

     
    1111
    1212body {
    1313
    14         .wp-block[data-align="full"] {
     14        .wp-block[data-align="full"],
     15        .wp-block.alignfull {
    1516                width: calc(100% + 28px);
    1617                max-width: calc(100% + 28px);
    1718        }
     
    1819
    1920        @include media(mobile) {
    2021
    21                 .wp-block[data-align="full"] {
    22                         width: calc( 100% + 116px );
    23                         max-width: calc( 100% + 115px );
     22                .wp-block[data-align="full"],
     23                .wp-block.alignfull {
     24                        width: calc( 125% + 90px );
     25                        max-width: calc( 125% + 89px );
     26                        left: calc( -12.5% - 8px);
    2427                }
    2528        }
    2629
    2730        @include media(tablet) {
    2831
    29                 .editor-writing-flow {
     32                .block-editor-writing-flow {
    3033                        max-width: 80%;
    3134                        margin: 0 10%;
    3235                }
    3336
    34                 .editor-default-block-appender,
    35                 .editor-block-list__block {
     37                .block-editor-default-block-appender,
     38                .block-editor-block-list__block {
    3639                        margin-left: 0;
    3740                        margin-right: 0;
    3841                }
    3942
    40                 .wp-block[data-align="wide"] {
     43                .wp-block[data-align="wide"],
     44                .wp-block.alignwide {
    4145                        width: 100%;
    4246                }
    4347
     
    190194/** === Post Title === */
    191195
    192196.editor-post-title__block {
     197        width: 100%;
    193198        @include post-section-dash;
    194199
    195200        &:before {
     
    773778// size is different here.
    774779$group-block-background__padding: $font__size_base;
    775780
    776 .wp-block[data-type="core/group"] {
     781.wp-block-group {
    777782
    778         // Group block base styles
    779         > .wp-block-group {
    780 
    781                 // Child: Full alignment
    782                 > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
    783                         margin-left: 0;
    784                         margin-right: 0;
    785                 }
     783        // Child: Full alignment
     784        > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"],
     785        > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block.alignfull {
     786                margin-left: 0;
     787                margin-right: 0;
     788                left: 0;
    786789        }
    787790
    788791        // Group block with background color
    789         > .wp-block-group.has-background {
     792        .has-background {
    790793                padding: $group-block-background__padding;
    791794
    792795                // Child: Full alignment
    793                 > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
     796                > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"],
     797                > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block.alignfull {
    794798                        margin-left: -$group-block-background__padding;
    795799                        width: calc(100% + #{$group-block-background__padding * 2});
    796800                        max-width: calc(100% + #{$group-block-background__padding * 2});
     
    798802        }
    799803
    800804        // Wide and full alignments
    801         &[data-align="wide"] > .is-block-content {
     805        &[data-align="wide"] {
    802806
    803                 // Group block base styles.
    804                 > .wp-block-group {
    805 
    806                         // Child blocks: Default alignments
    807                         > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
    808                                 @include media(tablet) {
    809                                         width: calc(8 * (100vw / 12));
    810                                 }
    811 
    812                                 @include media(desktop) {
    813                                         width: calc(6 * (100vw / 12 ));
    814                                 }
     807                > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]):not(.alignwide):not(.alignfull) {
     808                        @include media(tablet) {
     809                                width: calc(8 * (100vw / 12));
    815810                        }
    816811
    817                         // Child blocks: Full alignment
    818                         > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
    819                                 padding-left: 0;
    820                                 padding-right: 0;
     812                        @include media(desktop) {
     813                                width: calc(6 * (100vw / 12 ));
    821814                        }
    822815                }
    823816
     817                // Child blocks: Full alignment
     818                > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"],
     819                > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block.alignfull {
     820                        padding-left: 0;
     821                        padding-right: 0;
     822                }
     823
     824
    824825                // Group block with background color
    825                 > .wp-block-group.has-background {
     826                &.has-background {
    826827                       
    827828                        // Child blocks: Default alignments
    828                         > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
     829                        > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]):not(.alignwide):not(.alignfull) {
    829830                                @include media(tablet) {
    830831                                        width: calc(8 * (100vw / 12) - #{$group-block-background__padding * 2});
    831832                                }
     
    840841        // Full alignment
    841842        &[data-align="full"] {
    842843
    843                 // Group block base styles
    844                 > .is-block-content > .wp-block-group {
     844                // Margins & padding are added to this container to mimic
     845                // the style + spacing of the .editor-writing-flow global
     846                // container. This way, child items sync up with the placement
     847                // and size of other top-level blocks.
     848                > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout {
    845849
    846                         // Margins & padding are added to this container to mimic
    847                         // the style + spacing of the .editor-writing-flow global
    848                         // container. This way, child items sync up with the placement
    849                         // and size of other top-level blocks.
    850                         > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout {
     850                        @include media(mobile) {
     851                                padding-left: 46px;
     852                                padding-right: 46px;
     853                        }
    851854
    852                                 @include media(mobile) {
    853                                         padding-left: 46px;
    854                                         padding-right: 46px;
    855                                 }
     855                        // 2px of extra padding are added to each side here
     856                        // To better match up with the spacing of the whole
     857                        // document.
     858                        @include media(tablet) {
     859                                width: 80%;
     860                                margin-left: 10%;
     861                                margin-right: 10%;
     862                                padding-left: 48px;
     863                                padding-right: 48px;
     864                        }
    856865
    857                                 // 2px of extra padding are added to each side here
    858                                 // To better match up with the spacing of the whole
    859                                 // document.
     866                        // Child blocks: All alignments except full
     867                         > .wp-block:not([data-align="full"]):not(.alignfull) {
     868                                max-width: calc(100vw - (2 * 1rem));
     869
    860870                                @include media(tablet) {
    861                                         width: 80%;
    862                                         margin-left: 10%;
    863                                         margin-right: 10%;
    864                                         padding-left: 48px;
    865                                         padding-right: 48px;
     871                                        max-width: calc(8 * (100vw / 12));
    866872                                }
    867873
    868                                 // Child blocks: All alignments except full
    869                                  > .wp-block:not([data-align="full"]) {
    870                                         max-width: calc(100vw - (2 * 1rem));
     874                                @include media(desktop) {
     875                                        max-width: calc(6 * (100vw / 12));
     876                                }
     877                        }
    871878
    872                                         @include media(tablet) {
    873                                                 max-width: calc(8 * (100vw / 12));
    874                                         }
     879                        // Child blocks: Right alignments
     880                        > .wp-block[data-align="right"] {
    875881
    876                                         @include media(desktop) {
    877                                                 max-width: calc(6 * (100vw / 12));
    878                                         }
     882                                @include media(tablet) {
     883                                        max-width: 125%;
    879884                                }
     885                        }
    880886
    881                                 // Child blocks: Right alignments
    882                                 > .wp-block[data-align="right"] {
     887                        // Child blocks: Wide alignments
     888                        > .wp-block[data-align="wide"],
     889                        > .wp-block.alignwide {
    883890
    884                                         @include media(tablet) {
    885                                                 max-width: 125%;
    886                                         }
     891                                @include media(tablet) {
     892                                        width: calc(100% + 4px);
     893                                        max-width: calc(100% + 4px);
    887894                                }
     895                        }
    888896
    889                                 // Child blocks: Wide alignments
    890                                 > .wp-block[data-align="wide"] {
     897                        // Child blocks: Full alignments
     898                        > .wp-block[data-align=full],
     899                        > .wp-block.alignfull {
     900                                max-width: calc(100vw + (2 * 1rem));
    891901
    892                                         @include media(tablet) {
    893                                                 width: calc(100% + 4px);
    894                                                 max-width: calc(100% + 4px);
    895                                         }
     902                                @include media(mobile) {
     903                                        width: calc(100% + 92px);
     904                                        left: -46px;
    896905                                }
    897906
    898                                 // Child blocks: Full alignments
    899                                 > .wp-block[data-align=full] {
    900                                         max-width: calc(100vw + (2 * 1rem));
    901 
    902                                         @include media(mobile) {
    903                                                 width: calc(100% + 92px);
    904                                                 left: -46px;
    905                                         }
    906 
    907                                         @include media(tablet) {
    908                                                 left: calc(-12.5% - 58px);
    909                                                 width: calc(125% + 120px);
    910                                                 max-width: calc(125% + 119px);
    911                                         }
     907                                @include media(tablet) {
     908                                        left: calc(-12.5% - 58px);
     909                                        width: calc(125% + 120px);
     910                                        max-width: calc(125% + 119px);
    912911                                }
    913912                        }
    914913                }
     
    926925                        }
    927926
    928927                        // Child blocks: Full alignment
    929                         > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"] {
     928                        > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block[data-align="full"],
     929                        > .wp-block-group__inner-container > .block-editor-inner-blocks > .block-editor-block-list__layout > .wp-block.alignfull {
    930930                                margin-left: 0;
    931931                                width: 100%;
    932932
  • src/wp-content/themes/twentynineteen/style-rtl.css

     
    27862786  background: transparent;
    27872787  color: inherit;
    27882788  cursor: pointer;
    2789   transition: background 250ms ease-in-out,
    2790  transform 150ms ease;
     2789  transition: background 250ms ease-in-out, transform 150ms ease;
    27912790  -webkit-appearance: none;
    27922791  -moz-appearance: none;
    27932792}
     
    29862985  margin-left: calc( .25 * 1rem);
    29872986}
    29882987
    2989 .main-navigation .main-menu .menu-item-has-children:not(.off-canvas)[focus-within] > .sub-menu {
    2990   display: block;
    2991   right: 0;
    2992   margin-top: 0;
    2993   opacity: 1;
    2994   width: auto;
    2995   min-width: 100%;
    2996   /* Non-mobile position */
    2997   /* Nested sub-menu dashes */
    2998 }
    2999 
    30002988.main-navigation .main-menu .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu {
    30012989  display: block;
    30022990  right: 0;
     
    30092997}
    30102998
    30112999@media only screen and (min-width: 768px) {
    3012   .main-navigation .main-menu .menu-item-has-children:not(.off-canvas)[focus-within] > .sub-menu {
    3013     display: block;
    3014     margin-top: 0;
    3015     opacity: 1;
    3016     position: absolute;
    3017     right: 0;
    3018     left: auto;
    3019     top: auto;
    3020     bottom: auto;
    3021     height: auto;
    3022     min-width: -moz-max-content;
    3023     min-width: -webkit-max-content;
    3024     min-width: max-content;
    3025     transform: none;
    3026   }
    30273000  .main-navigation .main-menu .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu {
    30283001    display: block;
    30293002    margin-top: 0;
     
    30413014  }
    30423015}
    30433016
    3044 .main-navigation .main-menu .menu-item-has-children:not(.off-canvas)[focus-within] > .sub-menu.hidden-links {
    3045   right: 0;
    3046   width: 100%;
    3047   display: table;
    3048   position: absolute;
    3049 }
    3050 
    30513017.main-navigation .main-menu .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu.hidden-links {
    30523018  right: 0;
    30533019  width: 100%;
     
    30563022}
    30573023
    30583024@media only screen and (min-width: 768px) {
    3059   .main-navigation .main-menu .menu-item-has-children:not(.off-canvas)[focus-within] > .sub-menu.hidden-links {
    3060     left: 0;
    3061     right: auto;
    3062     display: block;
    3063     width: max-content;
    3064   }
    30653025  .main-navigation .main-menu .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu.hidden-links {
    30663026    left: 0;
    30673027    right: auto;
     
    30703030  }
    30713031}
    30723032
    3073 .main-navigation .main-menu .menu-item-has-children:not(.off-canvas)[focus-within] > .sub-menu .submenu-expand {
    3074   display: none;
    3075 }
    3076 
    30773033.main-navigation .main-menu .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu .submenu-expand {
    30783034  display: none;
    30793035}
    30803036
    3081 .main-navigation .main-menu .menu-item-has-children:not(.off-canvas)[focus-within] > .sub-menu .sub-menu {
    3082   display: block;
    3083   margin-top: inherit;
    3084   position: relative;
    3085   width: 100%;
    3086   right: 0;
    3087   opacity: 1;
    3088   /* Non-mobile position */
    3089 }
    3090 
    30913037.main-navigation .main-menu .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu .sub-menu {
    30923038  display: block;
    30933039  margin-top: inherit;
     
    30993045}
    31003046
    31013047@media only screen and (min-width: 768px) {
    3102   .main-navigation .main-menu .menu-item-has-children:not(.off-canvas)[focus-within] > .sub-menu .sub-menu {
    3103     float: none;
    3104     max-width: 100%;
    3105   }
    31063048  .main-navigation .main-menu .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu .sub-menu {
    31073049    float: none;
    31083050    max-width: 100%;
     
    31093051  }
    31103052}
    31113053
    3112 .main-navigation .main-menu .menu-item-has-children:not(.off-canvas)[focus-within] > .sub-menu .sub-menu {
    3113   counter-reset: submenu;
    3114 }
    3115 
    31163054.main-navigation .main-menu .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu .sub-menu {
    31173055  counter-reset: submenu;
    31183056}
    31193057
    3120 .main-navigation .main-menu .menu-item-has-children:not(.off-canvas)[focus-within] > .sub-menu .sub-menu > li > a::before {
    3121   font-family: "NonBreakingSpaceOverride", "Hoefler Text", Garamond, "Times New Roman", serif;
    3122   font-weight: normal;
    3123   content: "– " counters(submenu, "– ", none);
    3124   counter-increment: submenu;
    3125 }
    3126 
    31273058.main-navigation .main-menu .menu-item-has-children:not(.off-canvas):focus-within > .sub-menu .sub-menu > li > a::before {
    31283059  font-family: "NonBreakingSpaceOverride", "Hoefler Text", Garamond, "Times New Roman", serif;
    31293060  font-weight: normal;
  • src/wp-content/themes/twentynineteen/style.css

     
    27862786  background: transparent;
    27872787  color: inherit;
    27882788  cursor: pointer;
    2789   transition: background 250ms ease-in-out,
    2790  transform 150ms ease;
     2789  transition: background 250ms ease-in-out, transform 150ms ease;
    27912790  -webkit-appearance: none;
    27922791  -moz-appearance: none;
    27932792}