Twenty Twenty-One: Remove WooCommerce related CSS selectors.

The selectors for Twenty Twenty-One's default `max-width` have used the `.woocommerce` class since the theme's [956a3172a4 (diff-b757cb999144a1bc7e14604bc6d4bab7d87ea1a3bf5000c33937e490d75b9d92R3-R9) initial commit]. This changeset removes all WooCommerce CSS selector from the theme, as they would need to be supported forever. The change was tested with WooCommerce installed and no issues were raised. 

Props sabernhardt, audrasjb, davidbaumwald, tahmidulkarim, mukesh27.
Fixes #56366.


git-svn-id: https://develop.svn.wordpress.org/trunk@54170 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Jb Audras
2022-09-14 22:31:19 +00:00
parent 0fdfa266af
commit 39617d8116
4 changed files with 12 additions and 12 deletions

View File

@@ -516,38 +516,38 @@ template {
}
}
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator) {
max-width: calc(100vw - 30px);
margin-left: auto;
margin-right: auto;
}
@media only screen and (min-width: 482px) {
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator) {
max-width: min(calc(100vw - 100px), 610px);
}
}
@media only screen and (min-width: 822px) {
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator) {
max-width: min(calc(100vw - 200px), 610px);
}
}
*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator) {
max-width: calc(100vw - 30px);
margin-left: auto;
margin-right: auto;
}
@media only screen and (min-width: 482px) {
*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator) {
max-width: min(calc(100vw - 100px), 610px);
}
}
@media only screen and (min-width: 822px) {
*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator) {
max-width: min(calc(100vw - 200px), 610px);
}
}

View File

@@ -3,8 +3,8 @@
/**
* These selectors set the default max width for content appearing inside a post or page.
*/
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce),
*[class*="inner-container"] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce) {
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator),
*[class*="inner-container"] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator) {
@extend %responsive-aligndefault-width;
}

View File

@@ -693,8 +693,8 @@ template {
*/
.post-thumbnail,
.entry-content .wp-audio-shortcode,
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce),
*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce),
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator),
*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator),
.default-max-width {
max-width: var(--responsive--aligndefault-width);
margin-right: auto;

View File

@@ -693,8 +693,8 @@ template {
*/
.post-thumbnail,
.entry-content .wp-audio-shortcode,
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce),
*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator):not(.woocommerce),
.entry-content > *:not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator),
*[class*=inner-container] > *:not(.entry-content):not(.alignwide):not(.alignfull):not(.alignleft):not(.alignright):not(.wp-block-separator),
.default-max-width {
max-width: var(--responsive--aligndefault-width);
margin-left: auto;