WordPress.org
Get WordPress

Make WordPress Core

Ticket #46750: 46750.patch

File 46750.patch, 22.7 KB (added by kjellr, 6 years ago)

  • src/wp-content/themes/twentynineteen/sass/blocks/_blocks.scss

     
    512512                        display: block;
    513513                }
    514514
     515                // If an image does not have a left/center/right alignment,
     516                // it's a direct child of .wp-block-img.  If it has no other
     517                // alignment added, we want to make sure the image does not
     518                // extend beyond the width of the text column.
     519                &:not(.alignwide):not(.alignfull) > img {
     520                        @include postContentMaxWidth();
     521                }
     522
    515523                .aligncenter {
    516524
    517525                        @include postContentMaxWidth();
    … …  
    761769                }
    762770        }
    763771
     772        //! Group
     773        .wp-block-group {
     774
     775                // Inner blocks don't inherit our default margins, so we need to add them here.
     776                > * {
     777                        margin-top: 32px;
     778                        margin-bottom: 32px;
     779
     780                        &:first-child {
     781                                margin-top: 0;
     782                        }
     783
     784                        &:last-child {
     785                                margin-bottom: 0;
     786                        }
     787                }
     788
     789                // Child blocks: Full alignment
     790                > .alignfull {
     791
     792                        &.wp-block-image img {
     793                                max-width: 100%;
     794                        }
     795                }
     796
     797                // Wide alignment
     798                &.alignwide {
     799
     800                        // Child blocks: Default alignments
     801                        > *:not(.alignwide):not(.alignfull) {
     802                                @include postContentMaxWidth();
     803                        }
     804                }
     805
     806                // Full Alignment
     807                &.alignfull {
     808                        width: 100vw;
     809                        max-width: 100vw;
     810
     811                        // Child blocks: All alignments except full
     812                        > *:not(.alignfull) {
     813                                margin-left: $size__spacing-unit;
     814                                margin-right: $size__spacing-unit;
     815                                @include postContentMaxWidth();
     816
     817                                // Resets the width of cover blocks to prevent overflow
     818                                &.wp-block-cover {
     819                                        width: initial;
     820                                }
     821
     822                                // Allows alignright images to extend beyond the text column
     823                                &.wp-block-image {
     824                                        max-width: 100%;
     825                                }
     826
     827                                // Slightly slimmer margins than $size__site-margins to prevent overflow
     828                                @include media(tablet) {
     829                                        margin-left: calc( 10vw + 58px);
     830                                        margin-right: calc( 10vw + 58px);
     831                                }
     832                        }
     833
     834                        // Child blocks: Wide alignments
     835                        > .alignwide {
     836                                @include media(tablet) {
     837                                        max-width: calc( 80vw - #{$size__spacing-unit * 6});
     838
     839                                        &.wp-block-image img {
     840                                                margin-left: 0;
     841                                                max-width: 100%;
     842                                        }
     843                                }
     844                        }
     845                }
     846
     847                &.has-background {
     848                        padding: $size__spacing-unit;
     849
     850                        // Child blocks: Full alignment
     851                        > .alignfull {
     852                                width: calc( 100% + #{$size__spacing-unit * 2} );
     853                                max-width: calc( 100% + #{$size__spacing-unit * 2} );
     854                                margin-left: -#{$size__spacing-unit};
     855                        }
     856
     857                        // Wide alignment
     858                        &.alignwide {
     859
     860                                // Child blocks: Default alignments
     861                                > *:not(.alignwide):not(.alignfull) {
     862                                        @include media(tablet) {
     863                                                max-width: calc( #{$size__site-tablet-content} - #{$size__spacing-unit * 2} );
     864                                        }
     865
     866                                        @include media(desktop) {
     867                                                max-width: calc( #{$size__site-desktop-content} - #{$size__spacing-unit * 2} );
     868                                        }
     869                                }
     870                        }
     871
     872                        // Full Alignment
     873                        &.alignfull {
     874
     875                                // Child blocks: All alignments except full
     876                                > *:not(.alignfull) {
     877
     878                                        @include media(tablet) {
     879                                                margin-left: calc( 10vw + #{$size__spacing-unit * 2} - 6px);
     880                                                margin-right: calc( 10vw + #{$size__spacing-unit * 2} - 6px);
     881                                        }
     882                                }
     883                        }
     884                }
     885               
     886        }
     887
    764888        //! Latest Comments
    765889        .wp-block-latest-comments {
    766890

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

     
    12931293  line-height: 1.6;
    12941294  color: #767676;
    12951295}
     1296
     1297/** === Group Block === */
     1298.wp-block[data-type="core/group"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="full"] {
     1299  left: 0;
     1300}
     1301
     1302.wp-block[data-type="core/group"] > .editor-block-list__block-edit > div > .wp-block-group.has-background {
     1303  padding: 22px;
     1304}
     1305
     1306.wp-block[data-type="core/group"] > .editor-block-list__block-edit > div > .wp-block-group.has-background > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="full"] {
     1307  margin-left: -22px;
     1308  width: calc(100% + 44px);
     1309  max-width: calc(100% + 44px);
     1310}
     1311
     1312@media only screen and (min-width: 768px) {
     1313  .wp-block[data-type="core/group"][data-align="wide"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
     1314    width: calc(8 * (100vw / 12));
     1315  }
     1316}
     1317
     1318@media only screen and (min-width: 1168px) {
     1319  .wp-block[data-type="core/group"][data-align="wide"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
     1320    width: calc(6 * (100vw / 12 ));
     1321  }
     1322}
     1323
     1324@media only screen and (min-width: 768px) {
     1325  .wp-block[data-type="core/group"][data-align="wide"] > .editor-block-list__block-edit > div > .wp-block-group.has-background > .editor-inner-blocks > .editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
     1326    width: calc(8 * (100vw / 12) - 44px);
     1327  }
     1328}
     1329
     1330@media only screen and (min-width: 1168px) {
     1331  .wp-block[data-type="core/group"][data-align="wide"] > .editor-block-list__block-edit > div > .wp-block-group.has-background > .editor-inner-blocks > .editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
     1332    width: calc(6 * (100vw / 12 ) - 44px);
     1333  }
     1334}
     1335
     1336@media only screen and (min-width: 600px) {
     1337  .wp-block[data-type="core/group"][data-align="full"] {
     1338    max-width: calc(100% + 89px);
     1339  }
     1340}
     1341
     1342@media only screen and (min-width: 768px) {
     1343  .wp-block[data-type="core/group"][data-align="full"] {
     1344    max-width: calc(125% + 114px);
     1345  }
     1346}
     1347
     1348@media only screen and (min-width: 600px) {
     1349  .wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout {
     1350    padding-left: 46px;
     1351    padding-right: 46px;
     1352  }
     1353}
     1354
     1355@media only screen and (min-width: 768px) {
     1356  .wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout {
     1357    width: 80%;
     1358    margin-left: 10%;
     1359    margin-right: 10%;
     1360    padding-left: 48px;
     1361    padding-right: 48px;
     1362  }
     1363}
     1364
     1365.wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout > .wp-block:not([data-align="full"]) {
     1366  max-width: calc(100vw - (2 * 1rem));
     1367}
     1368
     1369@media only screen and (min-width: 768px) {
     1370  .wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout > .wp-block:not([data-align="full"]) {
     1371    max-width: calc(8 * (100vw / 12));
     1372  }
     1373}
     1374
     1375@media only screen and (min-width: 1168px) {
     1376  .wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout > .wp-block:not([data-align="full"]) {
     1377    max-width: calc(6 * (100vw / 12));
     1378  }
     1379}
     1380
     1381@media only screen and (min-width: 768px) {
     1382  .wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="right"] {
     1383    max-width: 125%;
     1384  }
     1385}
     1386
     1387@media only screen and (min-width: 768px) {
     1388  .wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="wide"] {
     1389    width: calc(100% + 4px);
     1390    max-width: calc(100% + 4px);
     1391  }
     1392}
     1393
     1394.wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align=full] {
     1395  max-width: calc(100vw + (2 * 1rem));
     1396}
     1397
     1398@media only screen and (min-width: 600px) {
     1399  .wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align=full] {
     1400    width: calc(100% + 92px);
     1401    left: -46px;
     1402  }
     1403}
     1404
     1405@media only screen and (min-width: 768px) {
     1406  .wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align=full] {
     1407    left: calc(-12.5% - 58px);
     1408    width: calc(125% + 120px);
     1409    max-width: calc(125% + 119px);
     1410  }
     1411}
     1412
     1413.wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group.has-background {
     1414  padding: 22px 0;
     1415}
     1416
     1417@media only screen and (min-width: 600px) {
     1418  .wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group.has-background {
     1419    padding-left: 0;
     1420    padding-right: 0;
     1421  }
     1422}
     1423
     1424.wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group.has-background > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="full"] {
     1425  margin-left: 0;
     1426  width: 100%;
     1427}
     1428
     1429@media only screen and (min-width: 600px) {
     1430  .wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group.has-background > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="full"] {
     1431    width: calc(100% + 92px);
     1432  }
     1433}
     1434
     1435@media only screen and (min-width: 768px) {
     1436  .wp-block[data-type="core/group"][data-align="full"] > .editor-block-list__block-edit > div > .wp-block-group.has-background > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="full"] {
     1437    width: calc(125% + 120px);
     1438  }
     1439}

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

     
    739739                }
    740740        }
    741741}
     742
     743/** === Group Block === */
     744
     745// This matches the 22px value for 1rem that used on the front end.
     746// It must be specified in pixels for the editor, since the root font
     747// size is different here.
     748$group-block-background__padding: $font__size_base;
     749
     750.wp-block[data-type="core/group"] {
     751
     752        // Group block base styles
     753        > .editor-block-list__block-edit > div > .wp-block-group {
     754
     755                // Child: Full alignment
     756                > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="full"] {
     757                        left: 0;
     758                }
     759        }
     760
     761        // Group block with background color
     762        > .editor-block-list__block-edit > div > .wp-block-group.has-background {
     763                padding: $group-block-background__padding;
     764
     765                // Child: Full alignment
     766                > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="full"] {
     767                        margin-left: -$group-block-background__padding;
     768                        width: calc(100% + #{$group-block-background__padding * 2});
     769                        max-width: calc(100% + #{$group-block-background__padding * 2});
     770                }
     771        }
     772
     773        // Wide and full alignments
     774        &[data-align="wide"] {
     775
     776                // Group block base styles.
     777                > .editor-block-list__block-edit > div > .wp-block-group {
     778
     779                        // Child blocks: Default alignments
     780                        > .editor-inner-blocks > .editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
     781                                @include media(tablet) {
     782                                        width: calc(8 * (100vw / 12));
     783                                }
     784
     785                                @include media(desktop) {
     786                                        width: calc(6 * (100vw / 12 ));
     787                                }
     788                        }
     789                }
     790
     791                // Group block with background color
     792                > .editor-block-list__block-edit > div > .wp-block-group.has-background {
     793                       
     794                        // Child blocks: Default alignments
     795                        > .editor-inner-blocks > .editor-block-list__layout > .wp-block:not([data-align="wide"]):not([data-align="full"]) {
     796                                @include media(tablet) {
     797                                        width: calc(8 * (100vw / 12) - #{$group-block-background__padding * 2});
     798                                }
     799
     800                                @include media(desktop) {
     801                                        width: calc(6 * (100vw / 12 ) - #{$group-block-background__padding * 2});
     802                                }
     803                        }
     804                }
     805        }
     806
     807        // Full alignment
     808        &[data-align="full"] {
     809
     810                // Max-width needs to be a pixel narrower than usual to prevent horizontal scrolling.
     811                @include media(mobile) {
     812                        max-width: calc(100% + 89px);
     813                }
     814                @include media(tablet) {
     815                        max-width: calc(125% + 114px);
     816                }
     817
     818                // Group block base styles
     819                > .editor-block-list__block-edit > div > .wp-block-group {
     820
     821                        // Margins & padding are added to this container to mimic
     822                        // the style + spacing of the .editor-writing-flow global
     823                        // container. This way, child items sync up with the placement
     824                        // and size of other top-level blocks.
     825                        > .editor-inner-blocks > .editor-block-list__layout {
     826
     827                                @include media(mobile) {
     828                                        padding-left: 46px;
     829                                        padding-right: 46px;
     830                                }
     831
     832                                // 2px of extra padding are added to each side here
     833                                // To better match up with the spacing of the whole
     834                                // document.
     835                                @include media(tablet) {
     836                                        width: 80%;
     837                                        margin-left: 10%;
     838                                        margin-right: 10%;
     839                                        padding-left: 48px;
     840                                        padding-right: 48px;
     841                                }
     842
     843                                // Child blocks: All alignments except full
     844                                 > .wp-block:not([data-align="full"]) {
     845                                        max-width: calc(100vw - (2 * 1rem));
     846
     847                                        @include media(tablet) {
     848                                                max-width: calc(8 * (100vw / 12));
     849                                        }
     850
     851                                        @include media(desktop) {
     852                                                max-width: calc(6 * (100vw / 12));
     853                                        }
     854                                }
     855
     856                                // Child blocks: Right alignments
     857                                > .wp-block[data-align="right"] {
     858
     859                                        @include media(tablet) {
     860                                                max-width: 125%;
     861                                        }
     862                                }
     863
     864                                // Child blocks: Wide alignments
     865                                > .wp-block[data-align="wide"] {
     866
     867                                        @include media(tablet) {
     868                                                width: calc(100% + 4px);
     869                                                max-width: calc(100% + 4px);
     870                                        }
     871                                }
     872
     873                                // Child blocks: Full alignments
     874                                > .wp-block[data-align=full] {
     875                                        max-width: calc(100vw + (2 * 1rem));
     876
     877                                        @include media(mobile) {
     878                                                width: calc(100% + 92px);
     879                                                left: -46px;
     880                                        }
     881
     882                                        @include media(tablet) {
     883                                                left: calc(-12.5% - 58px);
     884                                                width: calc(125% + 120px);
     885                                                max-width: calc(125% + 119px);
     886                                        }
     887                                }
     888                        }
     889                }
     890
     891                // Group block with background color
     892                > .editor-block-list__block-edit > div > .wp-block-group.has-background {
     893
     894                        // When the Group block is full width, we can remove the left/right padding
     895                        // and let this inherit the
     896                        padding: $group-block-background__padding 0;
     897
     898                        @include media(mobile) {
     899                                padding-left: 0;
     900                                padding-right: 0;
     901                        }
     902
     903                        // Child blocks: Full alignment
     904                        > .editor-inner-blocks > .editor-block-list__layout > .wp-block[data-align="full"] {
     905                                margin-left: 0;
     906                                width: 100%;
     907
     908                                @include media(mobile) {
     909                                        width: calc(100% + 92px);
     910                                }
     911
     912                                @include media(tablet) {
     913                                        width: calc(125% + 120px);
     914                                }
     915                        }
     916                }
     917        }
     918}

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

     
    57395739}
    57405740
    57415741@media only screen and (min-width: 768px) {
     5742  .entry .entry-content .wp-block-image > img {
     5743    max-width: calc(8 * (100vw / 12) - 28px);
     5744  }
     5745}
     5746
     5747@media only screen and (min-width: 1168px) {
     5748  .entry .entry-content .wp-block-image > img {
     5749    max-width: calc(6 * (100vw / 12) - 28px);
     5750  }
     5751}
     5752
     5753@media only screen and (min-width: 768px) {
    57425754  .entry .entry-content .wp-block-image .aligncenter {
    57435755    max-width: calc(8 * (100vw / 12) - 28px);
    57445756  }
    … …  
    60466058  }
    60476059}
    60486060
     6061.entry .entry-content .wp-block-group > * {
     6062  margin-top: 32px;
     6063  margin-bottom: 32px;
     6064}
     6065
     6066.entry .entry-content .wp-block-group > *:first-child {
     6067  margin-top: 0;
     6068}
     6069
     6070.entry .entry-content .wp-block-group > *:last-child {
     6071  margin-bottom: 0;
     6072}
     6073
     6074.entry .entry-content .wp-block-group > .alignfull.wp-block-image img {
     6075  max-width: 100%;
     6076}
     6077
     6078@media only screen and (min-width: 768px) {
     6079  .entry .entry-content .wp-block-group.alignwide > *:not(.alignwide):not(.alignfull) {
     6080    max-width: calc(8 * (100vw / 12) - 28px);
     6081  }
     6082}
     6083
     6084@media only screen and (min-width: 1168px) {
     6085  .entry .entry-content .wp-block-group.alignwide > *:not(.alignwide):not(.alignfull) {
     6086    max-width: calc(6 * (100vw / 12) - 28px);
     6087  }
     6088}
     6089
     6090.entry .entry-content .wp-block-group.alignfull {
     6091  width: 100vw;
     6092  max-width: 100vw;
     6093}
     6094
     6095.entry .entry-content .wp-block-group.alignfull > *:not(.alignfull) {
     6096  margin-right: 1rem;
     6097  margin-left: 1rem;
     6098}
     6099
     6100@media only screen and (min-width: 768px) {
     6101  .entry .entry-content .wp-block-group.alignfull > *:not(.alignfull) {
     6102    max-width: calc(8 * (100vw / 12) - 28px);
     6103  }
     6104}
     6105
     6106@media only screen and (min-width: 1168px) {
     6107  .entry .entry-content .wp-block-group.alignfull > *:not(.alignfull) {
     6108    max-width: calc(6 * (100vw / 12) - 28px);
     6109  }
     6110}
     6111
     6112.entry .entry-content .wp-block-group.alignfull > *:not(.alignfull).wp-block-cover {
     6113  width: initial;
     6114}
     6115
     6116.entry .entry-content .wp-block-group.alignfull > *:not(.alignfull).wp-block-image {
     6117  max-width: 100%;
     6118}
     6119
     6120@media only screen and (min-width: 768px) {
     6121  .entry .entry-content .wp-block-group.alignfull > *:not(.alignfull) {
     6122    margin-right: calc( 10vw + 58px);
     6123    margin-left: calc( 10vw + 58px);
     6124  }
     6125}
     6126
     6127@media only screen and (min-width: 768px) {
     6128  .entry .entry-content .wp-block-group.alignfull > .alignwide {
     6129    max-width: calc( 80vw - 6rem);
     6130  }
     6131  .entry .entry-content .wp-block-group.alignfull > .alignwide.wp-block-image img {
     6132    margin-right: 0;
     6133    max-width: 100%;
     6134  }
     6135}
     6136
     6137.entry .entry-content .wp-block-group.has-background {
     6138  padding: 1rem;
     6139}
     6140
     6141.entry .entry-content .wp-block-group.has-background > .alignfull {
     6142  width: calc( 100% + 2rem);
     6143  max-width: calc( 100% + 2rem);
     6144  margin-right: -1rem;
     6145}
     6146
     6147@media only screen and (min-width: 768px) {
     6148  .entry .entry-content .wp-block-group.has-background.alignwide > *:not(.alignwide):not(.alignfull) {
     6149    max-width: calc( calc(8 * (100vw / 12) - 28px) - 2rem);
     6150  }
     6151}
     6152
     6153@media only screen and (min-width: 1168px) {
     6154  .entry .entry-content .wp-block-group.has-background.alignwide > *:not(.alignwide):not(.alignfull) {
     6155    max-width: calc( calc(6 * (100vw / 12) - 28px) - 2rem);
     6156  }
     6157}
     6158
     6159@media only screen and (min-width: 768px) {
     6160  .entry .entry-content .wp-block-group.has-background.alignfull > *:not(.alignfull) {
     6161    margin-right: calc( 10vw + 2rem - 6px);
     6162    margin-left: calc( 10vw + 2rem - 6px);
     6163  }
     6164}
     6165
    60496166.entry .entry-content .wp-block-latest-comments .wp-block-latest-comments__comment-meta {
    60506167  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    60516168  font-weight: bold;

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

     
    57515751}
    57525752
    57535753@media only screen and (min-width: 768px) {
     5754  .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img {
     5755    max-width: calc(8 * (100vw / 12) - 28px);
     5756  }
     5757}
     5758
     5759@media only screen and (min-width: 1168px) {
     5760  .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) > img {
     5761    max-width: calc(6 * (100vw / 12) - 28px);
     5762  }
     5763}
     5764
     5765@media only screen and (min-width: 768px) {
    57545766  .entry .entry-content .wp-block-image .aligncenter {
    57555767    max-width: calc(8 * (100vw / 12) - 28px);
    57565768  }
    … …  
    60586070  }
    60596071}
    60606072
     6073.entry .entry-content .wp-block-group > * {
     6074  margin-top: 32px;
     6075  margin-bottom: 32px;
     6076}
     6077
     6078.entry .entry-content .wp-block-group > *:first-child {
     6079  margin-top: 0;
     6080}
     6081
     6082.entry .entry-content .wp-block-group > *:last-child {
     6083  margin-bottom: 0;
     6084}
     6085
     6086.entry .entry-content .wp-block-group > .alignfull.wp-block-image img {
     6087  max-width: 100%;
     6088}
     6089
     6090@media only screen and (min-width: 768px) {
     6091  .entry .entry-content .wp-block-group.alignwide > *:not(.alignwide):not(.alignfull) {
     6092    max-width: calc(8 * (100vw / 12) - 28px);
     6093  }
     6094}
     6095
     6096@media only screen and (min-width: 1168px) {
     6097  .entry .entry-content .wp-block-group.alignwide > *:not(.alignwide):not(.alignfull) {
     6098    max-width: calc(6 * (100vw / 12) - 28px);
     6099  }
     6100}
     6101
     6102.entry .entry-content .wp-block-group.alignfull {
     6103  width: 100vw;
     6104  max-width: 100vw;
     6105}
     6106
     6107.entry .entry-content .wp-block-group.alignfull > *:not(.alignfull) {
     6108  margin-left: 1rem;
     6109  margin-right: 1rem;
     6110}
     6111
     6112@media only screen and (min-width: 768px) {
     6113  .entry .entry-content .wp-block-group.alignfull > *:not(.alignfull) {
     6114    max-width: calc(8 * (100vw / 12) - 28px);
     6115  }
     6116}
     6117
     6118@media only screen and (min-width: 1168px) {
     6119  .entry .entry-content .wp-block-group.alignfull > *:not(.alignfull) {
     6120    max-width: calc(6 * (100vw / 12) - 28px);
     6121  }
     6122}
     6123
     6124.entry .entry-content .wp-block-group.alignfull > *:not(.alignfull).wp-block-cover {
     6125  width: initial;
     6126}
     6127
     6128.entry .entry-content .wp-block-group.alignfull > *:not(.alignfull).wp-block-image {
     6129  max-width: 100%;
     6130}
     6131
     6132@media only screen and (min-width: 768px) {
     6133  .entry .entry-content .wp-block-group.alignfull > *:not(.alignfull) {
     6134    margin-left: calc( 10vw + 58px);
     6135    margin-right: calc( 10vw + 58px);
     6136  }
     6137}
     6138
     6139@media only screen and (min-width: 768px) {
     6140  .entry .entry-content .wp-block-group.alignfull > .alignwide {
     6141    max-width: calc( 80vw - 6rem);
     6142  }
     6143  .entry .entry-content .wp-block-group.alignfull > .alignwide.wp-block-image img {
     6144    margin-left: 0;
     6145    max-width: 100%;
     6146  }
     6147}
     6148
     6149.entry .entry-content .wp-block-group.has-background {
     6150  padding: 1rem;
     6151}
     6152
     6153.entry .entry-content .wp-block-group.has-background > .alignfull {
     6154  width: calc( 100% + 2rem);
     6155  max-width: calc( 100% + 2rem);
     6156  margin-left: -1rem;
     6157}
     6158
     6159@media only screen and (min-width: 768px) {
     6160  .entry .entry-content .wp-block-group.has-background.alignwide > *:not(.alignwide):not(.alignfull) {
     6161    max-width: calc( calc(8 * (100vw / 12) - 28px) - 2rem);
     6162  }
     6163}
     6164
     6165@media only screen and (min-width: 1168px) {
     6166  .entry .entry-content .wp-block-group.has-background.alignwide > *:not(.alignwide):not(.alignfull) {
     6167    max-width: calc( calc(6 * (100vw / 12) - 28px) - 2rem);
     6168  }
     6169}
     6170
     6171@media only screen and (min-width: 768px) {
     6172  .entry .entry-content .wp-block-group.has-background.alignfull > *:not(.alignfull) {
     6173    margin-left: calc( 10vw + 2rem - 6px);
     6174    margin-right: calc( 10vw + 2rem - 6px);
     6175  }
     6176}
     6177
    60616178.entry .entry-content .wp-block-latest-comments .wp-block-latest-comments__comment-meta {
    60626179  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
    60636180  font-weight: bold;