WordPress.org
Get WordPress

Make WordPress Core

Changeset 44818 for trunk


Ignore:
Timestamp:
03/07/2019 10:36:58 PM (6 years ago)
Author:
allancole
Message:

Twenty Nineteen: Improve custom color behavior for InnerBlocks

Currently, if a parent block has a custom background color assigned, its child blocks will inherit the parent's text colors — even if the child block has its own custom text color assigned to it.

This update changes the following:

  • Adjusts Twenty Nineteen's custom background color defaults to target direct children only which fixes the issue

Props kjellr.

See #46432.

Location:
trunk/src/wp-content/themes/twentynineteen
Files:
3 edited

Legend:

Unmodified
Added
Removed

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

    r44739 r44818  
    839839        color: $color__background-body;
    840840
    841         p,
    842         h1,
    843         h2,
    844         h3,
    845         h4,
    846         h5,
    847         h6,
    848         a {
     841        > p,
     842        > h1,
     843        > h2,
     844        > h3,
     845        > h4,
     846        > h5,
     847        > h6,
     848        > a {
    849849            color: $color__background-body;
    850850        }
    … …  
    855855
    856856        // Use dark gray text against this background by default.
    857         p,
    858         h1,
    859         h2,
    860         h3,
    861         h4,
    862         h5,
    863         h6,
    864         a {
     857        > p,
     858        > h1,
     859        > h2,
     860        > h3,
     861        > h4,
     862        > h5,
     863        > h6,
     864        > a {
    865865            color: $color__text-main;
    866866        }
    … …  
    895895    .has-primary-color,
    896896    .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color,
    897     .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color p {
     897    .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color > p {
    898898        color: $color__link;
    899899    }
    … …  
    901901    .has-secondary-color,
    902902    .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color,
    903     .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color p {
     903    .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color > p {
    904904        color: $color__border-link-hover;
    905905    }
    … …  
    907907    .has-dark-gray-color,
    908908    .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color,
    909     .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color p {
     909    .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color > p {
    910910        color: $color__text-main;
    911911    }
    … …  
    913913    .has-light-gray-color,
    914914    .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color,
    915     .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color p {
     915    .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color > p {
    916916        color: $color__text-light;
    917917    }

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

    r44773 r44818  
    60766076}
    60776077
    6078 .entry .entry-content .has-primary-background-color p,
    6079 .entry .entry-content .has-primary-background-color h1,
    6080 .entry .entry-content .has-primary-background-color h2,
    6081 .entry .entry-content .has-primary-background-color h3,
    6082 .entry .entry-content .has-primary-background-color h4,
    6083 .entry .entry-content .has-primary-background-color h5,
    6084 .entry .entry-content .has-primary-background-color h6,
    6085 .entry .entry-content .has-primary-background-color a,
    6086 .entry .entry-content .has-secondary-background-color p,
    6087 .entry .entry-content .has-secondary-background-color h1,
    6088 .entry .entry-content .has-secondary-background-color h2,
    6089 .entry .entry-content .has-secondary-background-color h3,
    6090 .entry .entry-content .has-secondary-background-color h4,
    6091 .entry .entry-content .has-secondary-background-color h5,
    6092 .entry .entry-content .has-secondary-background-color h6,
    6093 .entry .entry-content .has-secondary-background-color a,
    6094 .entry .entry-content .has-dark-gray-background-color p,
    6095 .entry .entry-content .has-dark-gray-background-color h1,
    6096 .entry .entry-content .has-dark-gray-background-color h2,
    6097 .entry .entry-content .has-dark-gray-background-color h3,
    6098 .entry .entry-content .has-dark-gray-background-color h4,
    6099 .entry .entry-content .has-dark-gray-background-color h5,
    6100 .entry .entry-content .has-dark-gray-background-color h6,
    6101 .entry .entry-content .has-dark-gray-background-color a,
    6102 .entry .entry-content .has-light-gray-background-color p,
    6103 .entry .entry-content .has-light-gray-background-color h1,
    6104 .entry .entry-content .has-light-gray-background-color h2,
    6105 .entry .entry-content .has-light-gray-background-color h3,
    6106 .entry .entry-content .has-light-gray-background-color h4,
    6107 .entry .entry-content .has-light-gray-background-color h5,
    6108 .entry .entry-content .has-light-gray-background-color h6,
    6109 .entry .entry-content .has-light-gray-background-color a {
     6078.entry .entry-content .has-primary-background-color > p,
     6079.entry .entry-content .has-primary-background-color > h1,
     6080.entry .entry-content .has-primary-background-color > h2,
     6081.entry .entry-content .has-primary-background-color > h3,
     6082.entry .entry-content .has-primary-background-color > h4,
     6083.entry .entry-content .has-primary-background-color > h5,
     6084.entry .entry-content .has-primary-background-color > h6,
     6085.entry .entry-content .has-primary-background-color > a,
     6086.entry .entry-content .has-secondary-background-color > p,
     6087.entry .entry-content .has-secondary-background-color > h1,
     6088.entry .entry-content .has-secondary-background-color > h2,
     6089.entry .entry-content .has-secondary-background-color > h3,
     6090.entry .entry-content .has-secondary-background-color > h4,
     6091.entry .entry-content .has-secondary-background-color > h5,
     6092.entry .entry-content .has-secondary-background-color > h6,
     6093.entry .entry-content .has-secondary-background-color > a,
     6094.entry .entry-content .has-dark-gray-background-color > p,
     6095.entry .entry-content .has-dark-gray-background-color > h1,
     6096.entry .entry-content .has-dark-gray-background-color > h2,
     6097.entry .entry-content .has-dark-gray-background-color > h3,
     6098.entry .entry-content .has-dark-gray-background-color > h4,
     6099.entry .entry-content .has-dark-gray-background-color > h5,
     6100.entry .entry-content .has-dark-gray-background-color > h6,
     6101.entry .entry-content .has-dark-gray-background-color > a,
     6102.entry .entry-content .has-light-gray-background-color > p,
     6103.entry .entry-content .has-light-gray-background-color > h1,
     6104.entry .entry-content .has-light-gray-background-color > h2,
     6105.entry .entry-content .has-light-gray-background-color > h3,
     6106.entry .entry-content .has-light-gray-background-color > h4,
     6107.entry .entry-content .has-light-gray-background-color > h5,
     6108.entry .entry-content .has-light-gray-background-color > h6,
     6109.entry .entry-content .has-light-gray-background-color > a {
    61106110  color: #fff;
    61116111}
    … …  
    61156115}
    61166116
    6117 .entry .entry-content .has-white-background-color p,
    6118 .entry .entry-content .has-white-background-color h1,
    6119 .entry .entry-content .has-white-background-color h2,
    6120 .entry .entry-content .has-white-background-color h3,
    6121 .entry .entry-content .has-white-background-color h4,
    6122 .entry .entry-content .has-white-background-color h5,
    6123 .entry .entry-content .has-white-background-color h6,
    6124 .entry .entry-content .has-white-background-color a {
     6117.entry .entry-content .has-white-background-color > p,
     6118.entry .entry-content .has-white-background-color > h1,
     6119.entry .entry-content .has-white-background-color > h2,
     6120.entry .entry-content .has-white-background-color > h3,
     6121.entry .entry-content .has-white-background-color > h4,
     6122.entry .entry-content .has-white-background-color > h5,
     6123.entry .entry-content .has-white-background-color > h6,
     6124.entry .entry-content .has-white-background-color > a {
    61256125  color: #111;
    61266126}
    … …  
    61536153.entry .entry-content .has-primary-color,
    61546154.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color,
    6155 .entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color p {
     6155.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color > p {
    61566156  color: #0073aa;
    61576157}
    … …  
    61596159.entry .entry-content .has-secondary-color,
    61606160.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color,
    6161 .entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color p {
     6161.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color > p {
    61626162  color: #005177;
    61636163}
    … …  
    61656165.entry .entry-content .has-dark-gray-color,
    61666166.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color,
    6167 .entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color p {
     6167.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color > p {
    61686168  color: #111;
    61696169}
    … …  
    61716171.entry .entry-content .has-light-gray-color,
    61726172.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color,
    6173 .entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color p {
     6173.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color > p {
    61746174  color: #767676;
    61756175}

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

    r44739 r44818  
    60886088}
    60896089
    6090 .entry .entry-content .has-primary-background-color p,
    6091 .entry .entry-content .has-primary-background-color h1,
    6092 .entry .entry-content .has-primary-background-color h2,
    6093 .entry .entry-content .has-primary-background-color h3,
    6094 .entry .entry-content .has-primary-background-color h4,
    6095 .entry .entry-content .has-primary-background-color h5,
    6096 .entry .entry-content .has-primary-background-color h6,
    6097 .entry .entry-content .has-primary-background-color a,
    6098 .entry .entry-content .has-secondary-background-color p,
    6099 .entry .entry-content .has-secondary-background-color h1,
    6100 .entry .entry-content .has-secondary-background-color h2,
    6101 .entry .entry-content .has-secondary-background-color h3,
    6102 .entry .entry-content .has-secondary-background-color h4,
    6103 .entry .entry-content .has-secondary-background-color h5,
    6104 .entry .entry-content .has-secondary-background-color h6,
    6105 .entry .entry-content .has-secondary-background-color a,
    6106 .entry .entry-content .has-dark-gray-background-color p,
    6107 .entry .entry-content .has-dark-gray-background-color h1,
    6108 .entry .entry-content .has-dark-gray-background-color h2,
    6109 .entry .entry-content .has-dark-gray-background-color h3,
    6110 .entry .entry-content .has-dark-gray-background-color h4,
    6111 .entry .entry-content .has-dark-gray-background-color h5,
    6112 .entry .entry-content .has-dark-gray-background-color h6,
    6113 .entry .entry-content .has-dark-gray-background-color a,
    6114 .entry .entry-content .has-light-gray-background-color p,
    6115 .entry .entry-content .has-light-gray-background-color h1,
    6116 .entry .entry-content .has-light-gray-background-color h2,
    6117 .entry .entry-content .has-light-gray-background-color h3,
    6118 .entry .entry-content .has-light-gray-background-color h4,
    6119 .entry .entry-content .has-light-gray-background-color h5,
    6120 .entry .entry-content .has-light-gray-background-color h6,
    6121 .entry .entry-content .has-light-gray-background-color a {
     6090.entry .entry-content .has-primary-background-color > p,
     6091.entry .entry-content .has-primary-background-color > h1,
     6092.entry .entry-content .has-primary-background-color > h2,
     6093.entry .entry-content .has-primary-background-color > h3,
     6094.entry .entry-content .has-primary-background-color > h4,
     6095.entry .entry-content .has-primary-background-color > h5,
     6096.entry .entry-content .has-primary-background-color > h6,
     6097.entry .entry-content .has-primary-background-color > a,
     6098.entry .entry-content .has-secondary-background-color > p,
     6099.entry .entry-content .has-secondary-background-color > h1,
     6100.entry .entry-content .has-secondary-background-color > h2,
     6101.entry .entry-content .has-secondary-background-color > h3,
     6102.entry .entry-content .has-secondary-background-color > h4,
     6103.entry .entry-content .has-secondary-background-color > h5,
     6104.entry .entry-content .has-secondary-background-color > h6,
     6105.entry .entry-content .has-secondary-background-color > a,
     6106.entry .entry-content .has-dark-gray-background-color > p,
     6107.entry .entry-content .has-dark-gray-background-color > h1,
     6108.entry .entry-content .has-dark-gray-background-color > h2,
     6109.entry .entry-content .has-dark-gray-background-color > h3,
     6110.entry .entry-content .has-dark-gray-background-color > h4,
     6111.entry .entry-content .has-dark-gray-background-color > h5,
     6112.entry .entry-content .has-dark-gray-background-color > h6,
     6113.entry .entry-content .has-dark-gray-background-color > a,
     6114.entry .entry-content .has-light-gray-background-color > p,
     6115.entry .entry-content .has-light-gray-background-color > h1,
     6116.entry .entry-content .has-light-gray-background-color > h2,
     6117.entry .entry-content .has-light-gray-background-color > h3,
     6118.entry .entry-content .has-light-gray-background-color > h4,
     6119.entry .entry-content .has-light-gray-background-color > h5,
     6120.entry .entry-content .has-light-gray-background-color > h6,
     6121.entry .entry-content .has-light-gray-background-color > a {
    61226122  color: #fff;
    61236123}
    … …  
    61276127}
    61286128
    6129 .entry .entry-content .has-white-background-color p,
    6130 .entry .entry-content .has-white-background-color h1,
    6131 .entry .entry-content .has-white-background-color h2,
    6132 .entry .entry-content .has-white-background-color h3,
    6133 .entry .entry-content .has-white-background-color h4,
    6134 .entry .entry-content .has-white-background-color h5,
    6135 .entry .entry-content .has-white-background-color h6,
    6136 .entry .entry-content .has-white-background-color a {
     6129.entry .entry-content .has-white-background-color > p,
     6130.entry .entry-content .has-white-background-color > h1,
     6131.entry .entry-content .has-white-background-color > h2,
     6132.entry .entry-content .has-white-background-color > h3,
     6133.entry .entry-content .has-white-background-color > h4,
     6134.entry .entry-content .has-white-background-color > h5,
     6135.entry .entry-content .has-white-background-color > h6,
     6136.entry .entry-content .has-white-background-color > a {
    61376137  color: #111;
    61386138}
    … …  
    61656165.entry .entry-content .has-primary-color,
    61666166.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color,
    6167 .entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color p {
     6167.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-primary-color > p {
    61686168  color: #0073aa;
    61696169}
    … …  
    61716171.entry .entry-content .has-secondary-color,
    61726172.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color,
    6173 .entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color p {
     6173.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-secondary-color > p {
    61746174  color: #005177;
    61756175}
    … …  
    61776177.entry .entry-content .has-dark-gray-color,
    61786178.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color,
    6179 .entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color p {
     6179.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-dark-gray-color > p {
    61806180  color: #111;
    61816181}
    … …  
    61836183.entry .entry-content .has-light-gray-color,
    61846184.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color,
    6185 .entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color p {
     6185.entry .entry-content .wp-block-pullquote.is-style-solid-color blockquote.has-light-gray-color > p {
    61866186  color: #767676;
    61876187}
Note: See TracChangeset for help on using the changeset viewer.