WordPress.org
Get WordPress

Make WordPress Core

Changeset 46714


Ignore:
Timestamp:
11/12/2019 01:44:51 AM (5 years ago)
Author:
SergeyBiryukov
Message:

Bundled Themes: Update Twenty Twenty.

  • Add a11y-friendly default text-colors when selecting a background-color.
  • Remove margins for the group block when a background-color is set.
  • Excluding pullquote block from width resize rules.

This brings Twenty Twenty in sync with GitHub. For a full list of changes since [46711], see ​https://github.com/WordPress/twentytwenty/compare/ab5fa23...162edc0.

Reviewed by azaozz, SergeyBiryukov.
Props allancole, karmatosed.
See #48110, #48386, #48450, #48505.
Merges [46713] to the 5.3 branch.
Fixes #48557.

Location:
branches/5.3
Files:
5 edited

Legend:

Unmodified
Added
Removed

  • branches/5.3

  • branches/5.3/src/wp-content/themes/twentytwenty/assets/css/editor-style-block-rtl.css

    r46712 r46714  
    163163/* CUSTOM COLORS */
    164164
    165 .has-accent-color {
     165:root .has-accent-color {
    166166    color: #cd2653;
    167167}
    168168
    169 .has-accent-background-color {
     169:root .has-accent-background-color {
    170170    background-color: #cd2653;
    171 }
    172 
    173 .has-secondary-color {
     171    color: #fff;
     172}
     173
     174:root .has-primary-color {
     175    color: #000;
     176}
     177
     178:root .has-primary-background-color {
     179    background-color: #000;
     180    color: #f5efe0;
     181}
     182
     183:root .has-secondary-color {
    174184    color: #6d6d6d;
    175185}
    176186
    177 .has-secondary-background-color {
     187:root .has-secondary-background-color {
    178188    background-color: #6d6d6d;
    179 }
    180 
    181 .has-subtle-background-color {
     189    color: #fff;
     190}
     191
     192:root .has-subtle-background-color {
    182193    color: #dcd7ca;
    183194}
    184195
    185 .has-subtle-background-background-color {
     196:root .has-subtle-background-background-color {
    186197    background-color: #dcd7ca;
    187 }
    188 
    189 .has-background-color {
    190     color: #6d6d6d;
    191 }
    192 
    193 .has-background-background-color {
    194     background-color: #6d6d6d;
     198    color: #000;
     199}
     200
     201:root .has-background-color {
     202    color: #f5efe0;
     203}
     204
     205:root .has-background-background-color {
     206    background-color: #f5efe0;
     207    color: #000;
    195208}
    196209
    … …  
    199212.has-black-background-color {
    200213    background-color: #000;
     214    color: #fff;
    201215}
    202216
    203217.has-white-background-color {
    204218    background-color: #fff;
     219    color: #000;
    205220}
    206221

  • branches/5.3/src/wp-content/themes/twentytwenty/assets/css/editor-style-block.css

    r46712 r46714  
    163163/* CUSTOM COLORS */
    164164
    165 .has-accent-color {
     165:root .has-accent-color {
    166166    color: #cd2653;
    167167}
    168168
    169 .has-accent-background-color {
     169:root .has-accent-background-color {
    170170    background-color: #cd2653;
    171 }
    172 
    173 .has-secondary-color {
     171    color: #fff;
     172}
     173
     174:root .has-primary-color {
     175    color: #000;
     176}
     177
     178:root .has-primary-background-color {
     179    background-color: #000;
     180    color: #f5efe0;
     181}
     182
     183:root .has-secondary-color {
    174184    color: #6d6d6d;
    175185}
    176186
    177 .has-secondary-background-color {
     187:root .has-secondary-background-color {
    178188    background-color: #6d6d6d;
    179 }
    180 
    181 .has-subtle-background-color {
     189    color: #fff;
     190}
     191
     192:root .has-subtle-background-color {
    182193    color: #dcd7ca;
    183194}
    184195
    185 .has-subtle-background-background-color {
     196:root .has-subtle-background-background-color {
    186197    background-color: #dcd7ca;
    187 }
    188 
    189 .has-background-color {
    190     color: #6d6d6d;
    191 }
    192 
    193 .has-background-background-color {
    194     background-color: #6d6d6d;
     198    color: #000;
     199}
     200
     201:root .has-background-color {
     202    color: #f5efe0;
     203}
     204
     205:root .has-background-background-color {
     206    background-color: #f5efe0;
     207    color: #000;
    195208}
    196209
    … …  
    199212.has-black-background-color {
    200213    background-color: #000;
     214    color: #fff;
    201215}
    202216
    203217.has-white-background-color {
    204218    background-color: #fff;
     219    color: #000;
    205220}
    206221

  • branches/5.3/src/wp-content/themes/twentytwenty/style-rtl.css

    r46712 r46714  
    26492649:root .has-accent-background-color {
    26502650    background-color: #cd2653;
     2651    color: #fff;
    26512652}
    26522653
    … …  
    26572658:root .has-primary-background-color {
    26582659    background-color: #000;
     2660    color: #f5efe0;
    26592661}
    26602662
    … …  
    26652667:root .has-secondary-background-color {
    26662668    background-color: #6d6d6d;
     2669    color: #fff;
    26672670}
    26682671
    … …  
    26732676:root .has-subtle-background-background-color {
    26742677    background-color: #dcd7ca;
     2678    color: #000;
    26752679}
    26762680
    … …  
    26812685:root .has-background-background-color {
    26822686    background-color: #f5efe0;
     2687    color: #000;
    26832688}
    26842689
    … …  
    30493054.wp-block-group.has-background {
    30503055    padding: 2rem;
     3056    margin-bottom: 0;
     3057    margin-top: 0;
    30513058}
    30523059
    … …  
    44824489    [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft,
    44834490    [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignleft,
    4484     [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft,
     4491    [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft:not(.wp-block-pullquote),
    44854492    [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft,
    44864493    [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft {
    … …  
    45004507    [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright,
    45014508    [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignright,
    4502     [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright,
     4509    [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright:not(.wp-block-pullquote),
    45034510    [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright,
    45044511    [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright {
    … …  
    50225029    .wp-block-group.has-background {
    50235030        padding: 4rem;
     5031        margin-top: 0;
     5032        margin-bottom: 0;
    50245033    }
    50255034
    … …  
    51315140    }
    51325141
    5133     .entry-content > .alignwide,
    5134     .entry-content > .alignfull {
     5142    .entry-content > .alignwide:not(.wp-block-group),
     5143    .entry-content > .alignfull:not(.wp-block-group) {
    51355144        margin-bottom: 6rem;
    51365145        margin-top: 6rem;
    … …  
    56225631    .entry-content > .wp-block-group.alignfull.has-background {
    56235632        padding: 8rem 4rem;
     5633        margin-bottom: 0;
     5634        margin-top: 0;
    56245635    }
    56255636
    … …  
    56895700    }
    56905701
    5691     .entry-content > .alignwide,
    5692     .entry-content > .alignfull {
     5702    .entry-content > .alignwide:not(.wp-block-group),
     5703    .entry-content > .alignfull:not(.wp-block-group) {
    56935704        margin-bottom: 8rem;
    56945705        margin-top: 8rem;
    … …  
    58425853    .entry-content > .wp-block-group.alignfull.has-background {
    58435854        padding: 8rem 6rem;
     5855        margin-bottom: 0;
     5856        margin-top: 0;
    58445857    }
    58455858
    … …  
    59926005    /* BLOCK: PULLQUOTE */
    59936006
    5994     .wp-block-pullquote.alignleft::before,
    5995     .wp-block-pullquote.alignright::before {
    5996         position: absolute;
    5997         top: -0.4rem;
    5998     }
    5999 
    60006007    .wp-block-pullquote.is-style-solid-color.alignleft::before,
    60016008    .wp-block-pullquote.is-style-solid-color.alignright::before {
    60026009        top: 0;
    60036010    }
    6004 
    6005     .wp-block-pullquote.alignleft::before {
    6006         left: calc(100% + 1.5rem);
    6007     }
    6008 
    6009     .wp-block-pullquote.alignright::before {
    6010         right: calc(100% + 1.5rem);
    6011     }
    6012 }
     6011}

  • branches/5.3/src/wp-content/themes/twentytwenty/style.css

    r46712 r46714  
    26612661:root .has-accent-background-color {
    26622662    background-color: #cd2653;
     2663    color: #fff;
    26632664}
    26642665
    … …  
    26692670:root .has-primary-background-color {
    26702671    background-color: #000;
     2672    color: #f5efe0;
    26712673}
    26722674
    … …  
    26772679:root .has-secondary-background-color {
    26782680    background-color: #6d6d6d;
     2681    color: #fff;
    26792682}
    26802683
    … …  
    26852688:root .has-subtle-background-background-color {
    26862689    background-color: #dcd7ca;
     2690    color: #000;
    26872691}
    26882692
    … …  
    26932697:root .has-background-background-color {
    26942698    background-color: #f5efe0;
     2699    color: #000;
    26952700}
    26962701
    … …  
    30633068.wp-block-group.has-background {
    30643069    padding: 2rem;
     3070    margin-bottom: 0;
     3071    margin-top: 0;
    30653072}
    30663073
    … …  
    45084515    [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignleft,
    45094516    [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignleft,
    4510     [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft,
     4517    [class*="wp-block"].alignfull [class*="__inner-container"] > .alignleft:not(.wp-block-pullquote),
    45114518    [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignleft,
    45124519    [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignleft {
    … …  
    45304537    [class*="wp-block"].alignwide [class*="__inner-container"] > p .alignright,
    45314538    [class*="wp-block"].alignwide [class*="__inner-container"] > .wp-block-image .alignright,
    4532     [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright,
     4539    [class*="wp-block"].alignfull [class*="__inner-container"] > .alignright:not(.wp-block-pullquote),
    45334540    [class*="wp-block"].alignfull [class*="__inner-container"] > p .alignright,
    45344541    [class*="wp-block"].alignfull [class*="__inner-container"] > .wp-block-image .alignright {
    … …  
    50565063    .wp-block-group.has-background {
    50575064        padding: 4rem;
     5065        margin-top: 0;
     5066        margin-bottom: 0;
    50585067    }
    50595068
    … …  
    51695178    }
    51705179
    5171     .entry-content > .alignwide,
    5172     .entry-content > .alignfull {
     5180    .entry-content > .alignwide:not(.wp-block-group),
     5181    .entry-content > .alignfull:not(.wp-block-group) {
    51735182        margin-bottom: 6rem;
    51745183        margin-top: 6rem;
    … …  
    56605669    .entry-content > .wp-block-group.alignfull.has-background {
    56615670        padding: 8rem 4rem;
     5671        margin-bottom: 0;
     5672        margin-top: 0;
    56625673    }
    56635674
    … …  
    57275738    }
    57285739
    5729     .entry-content > .alignwide,
    5730     .entry-content > .alignfull {
     5740    .entry-content > .alignwide:not(.wp-block-group),
     5741    .entry-content > .alignfull:not(.wp-block-group) {
    57315742        margin-bottom: 8rem;
    57325743        margin-top: 8rem;
    … …  
    58805891    .entry-content > .wp-block-group.alignfull.has-background {
    58815892        padding: 8rem 6rem;
     5893        margin-bottom: 0;
     5894        margin-top: 0;
    58825895    }
    58835896
    … …  
    60386051    /* BLOCK: PULLQUOTE */
    60396052
    6040     .wp-block-pullquote.alignleft::before,
    6041     .wp-block-pullquote.alignright::before {
    6042         position: absolute;
    6043         top: -0.4rem;
    6044     }
    6045 
    60466053    .wp-block-pullquote.is-style-solid-color.alignleft::before,
    60476054    .wp-block-pullquote.is-style-solid-color.alignright::before {
    60486055        top: 0;
    60496056    }
    6050 
    6051     .wp-block-pullquote.alignleft::before {
    6052         right: calc(100% + 1.5rem);
    6053     }
    6054 
    6055     .wp-block-pullquote.alignright::before {
    6056         left: calc(100% + 1.5rem);
    6057     }
    6058 }
     6057}
Note: See TracChangeset for help on using the changeset viewer.