Skip to content

Commit

Permalink
Twenty Twenty-One: Remove duplicate CSS rules.
Browse files Browse the repository at this point in the history
Introduces a new PostCSS plugin, `postcss-discard-duplicates`, which will automatically remove any duplicate CSS rules. All the CSS that is removed shows up again later in the file. This also fixes a bug from `postcss-css-variables`, where media queries are duplicated.

Fixes #52158.
Props poena.



git-svn-id: https://develop.svn.wordpress.org/trunk@49980 602fd350-edb4-49c9-b593-d223f7449a82
  • Loading branch information
ryelle committed Jan 18, 2021
1 parent 7a8f90d commit b175a77
Show file tree
Hide file tree
Showing 5 changed files with 18 additions and 152 deletions.
58 changes: 0 additions & 58 deletions src/wp-content/themes/twentytwentyone/assets/css/ie-editor.css
Original file line number Diff line number Diff line change
Expand Up @@ -149,15 +149,11 @@ blockquote p {

blockquote cite {
font-weight: normal;
color: #28303d;
font-size: 1rem;
letter-spacing: normal;
}

blockquote footer {
font-weight: normal;
color: #28303d;
font-size: 1rem;
letter-spacing: normal;
}

Expand Down Expand Up @@ -387,14 +383,6 @@ a:hover {
outline: 2px dotted #28303d;
}

.has-background .has-link-color a {
color: #28303d;
}

.has-background.has-link-color a {
color: #28303d;
}

.wp-block-button__link {
line-height: 1.5;
color: #d1e4dd;
Expand Down Expand Up @@ -712,12 +700,6 @@ a:hover {
font-size: 3rem;
}
}
@media only screen and (min-width: 652px) {

.wp-block-cover h2 {
font-size: 3rem;
}
}

.wp-block-cover-image h2 {
font-size: 2.25rem;
Expand All @@ -733,12 +715,6 @@ a:hover {
font-size: 3rem;
}
}
@media only screen and (min-width: 652px) {

.wp-block-cover-image h2 {
font-size: 3rem;
}
}

.wp-block-cover h2.has-text-align-left,
.wp-block-cover-image h2.has-text-align-left {
Expand Down Expand Up @@ -1304,13 +1280,6 @@ h1 {
}
}

@media only screen and (min-width: 652px) {

.wp-block-heading h2 {
font-size: 3rem;
}
}

h2 {
font-size: 2.25rem;
letter-spacing: normal;
Expand All @@ -1324,13 +1293,6 @@ h2 {
}
}

@media only screen and (min-width: 652px) {

h2 {
font-size: 3rem;
}
}

.h2 {
font-size: 2.25rem;
letter-spacing: normal;
Expand All @@ -1344,13 +1306,6 @@ h2 {
}
}

@media only screen and (min-width: 652px) {

.h2 {
font-size: 3rem;
}
}

.wp-block-heading h3 {
font-size: 2rem;
letter-spacing: normal;
Expand Down Expand Up @@ -3133,17 +3088,6 @@ pre.wp-block-verse {
color: #39414d;
}

.has-background a,
.has-background p,
.has-background h1,
.has-background h2,
.has-background h3,
.has-background h4,
.has-background h5,
.has-background h6 {
color: currentColor;
}

.has-primary-background-color[class] {
background-color: #28303d;
color: #d1e4dd;
Expand All @@ -3155,12 +3099,10 @@ pre.wp-block-verse {
}

.has-white-background-color[class] {
background-color: #fff;
color: #39414d;
}

.has-black-background-color[class] {
background-color: #000;
color: #28303d;
}

Expand Down
85 changes: 0 additions & 85 deletions src/wp-content/themes/twentytwentyone/assets/css/ie.css
Original file line number Diff line number Diff line change
Expand Up @@ -545,8 +545,6 @@ template {
*/
.post-thumbnail {
max-width: calc(100vw - 30px);
margin-left: auto;
margin-right: auto;
}
@media only screen and (min-width: 482px) {

Expand Down Expand Up @@ -635,8 +633,6 @@ template {

.widget-area {
max-width: calc(100vw - 30px);
margin-left: auto;
margin-right: auto;
}

@media only screen and (min-width: 482px) {
Expand Down Expand Up @@ -715,8 +711,6 @@ template {

.site-footer {
max-width: calc(100vw - 30px);
margin-left: auto;
margin-right: auto;
}

@media only screen and (min-width: 482px) {
Expand All @@ -735,8 +729,6 @@ template {

.site-header {
max-width: calc(100vw - 30px);
margin-left: auto;
margin-right: auto;
}

@media only screen and (min-width: 482px) {
Expand Down Expand Up @@ -923,12 +915,6 @@ template {
margin-left: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
}
}
@media only screen and (min-width: 482px) {

.entry-content > .alignleft {
margin-left: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
}
}
@media only screen and (min-width: 822px) {

.entry-content > .alignleft {
Expand All @@ -952,12 +938,6 @@ template {
margin-right: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
}
}
@media only screen and (min-width: 482px) {

.entry-content > .alignright {
margin-right: calc(50vw - min(calc(100vw - 4 * 25px), 610px) *1);
}
}
@media only screen and (min-width: 822px) {

.entry-content > .alignright {
Expand Down Expand Up @@ -1379,15 +1359,11 @@ blockquote p {

blockquote cite {
font-weight: normal;
color: #28303d;
font-size: 1rem;
letter-spacing: normal;
}

blockquote footer {
font-weight: normal;
color: #28303d;
font-size: 1rem;
letter-spacing: normal;
}

Expand Down Expand Up @@ -2100,8 +2076,6 @@ fieldset input[type=checkbox] + label {

img {
display: block;
height: auto;
max-width: 100%;
}

/* Classic editor images */
Expand Down Expand Up @@ -2892,12 +2866,6 @@ input[type=reset]:hover {
font-size: 3rem;
}
}
@media only screen and (min-width: 652px) {

.wp-block-cover h2 {
font-size: 3rem;
}
}

.wp-block-cover-image h2 {
font-size: 2.25rem;
Expand All @@ -2913,12 +2881,6 @@ input[type=reset]:hover {
font-size: 3rem;
}
}
@media only screen and (min-width: 652px) {

.wp-block-cover-image h2 {
font-size: 3rem;
}
}

.wp-block-cover h2.has-text-align-left,
.wp-block-cover-image h2.has-text-align-left {
Expand Down Expand Up @@ -3372,13 +3334,6 @@ h2 {
}
}

@media only screen and (min-width: 652px) {

h2 {
font-size: 3rem;
}
}

.h2 {
font-size: 2.25rem;
letter-spacing: normal;
Expand All @@ -3392,13 +3347,6 @@ h2 {
}
}

@media only screen and (min-width: 652px) {

.h2 {
font-size: 3rem;
}
}

h3 {
font-size: 2rem;
letter-spacing: normal;
Expand Down Expand Up @@ -5379,13 +5327,6 @@ table.wp-calendar-table caption {
}
}

@media only screen and (min-width: 482px) {

.entry-content > .alignleft {
max-width: calc(50% - 50vw + min(calc(100vw - 4 * 25px), 610px) *1);
}
}

@media only screen and (min-width: 822px) {

.entry-content > .alignleft {
Expand Down Expand Up @@ -5454,13 +5395,6 @@ table.wp-calendar-table caption {
}
}

@media only screen and (min-width: 482px) {

.entry-content > .alignright {
max-width: calc(50% - 50vw + min(calc(100vw - 4 * 25px), 610px) *1);
}
}

@media only screen and (min-width: 822px) {

.entry-content > .alignright {
Expand Down Expand Up @@ -5856,13 +5790,6 @@ a.custom-logo-link {
}
}

@media only screen and (min-width: 652px) {

.entry-title {
font-size: 3rem;
}
}

.entry-title a {
color: currentColor;
text-underline-offset: 0.15em;
Expand Down Expand Up @@ -6263,12 +6190,6 @@ h1.page-title {
font-size: 3rem;
}
}
@media only screen and (min-width: 652px) {

.comments-title {
font-size: 3rem;
}
}

.comment-reply-title {
font-size: 2.25rem;
Expand All @@ -6280,12 +6201,6 @@ h1.page-title {
font-size: 3rem;
}
}
@media only screen and (min-width: 652px) {

.comment-reply-title {
font-size: 3rem;
}
}

.comment-reply-title {
display: flex;
Expand Down
23 changes: 15 additions & 8 deletions src/wp-content/themes/twentytwentyone/package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

1 change: 1 addition & 0 deletions src/wp-content/themes/twentytwentyone/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@
"postcss-cli": "^7.1.0",
"postcss-css-variables": "^0.17.0",
"postcss-custom-media": "^7.0.8",
"postcss-discard-duplicates": "^4.0.2",
"postcss-focus-within": "^3.0.0",
"postcss-nested": "^4.2.1",
"rtlcss": "^2.6.1",
Expand Down
3 changes: 2 additions & 1 deletion src/wp-content/themes/twentytwentyone/postcss.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ module.exports = {
}),
require('postcss-calc')({
precision: 0
})
}),
require('postcss-discard-duplicates')
]
};

0 comments on commit b175a77

Please sign in to comment.