From 2495fc55c0867691828922b1813842f2a37eefe8 Mon Sep 17 00:00:00 2001 From: Kelly Dwan Date: Thu, 21 Jul 2022 16:59:44 -0400 Subject: [PATCH 1/2] CSS: Update class name after gutenberg 13.7 change The `wp-container-*` class is no longer added to all blocks, instead we should use the `wp-block-*` class. The selector is necessary for specificity, so we can't just remove it. --- .../sass/components/bottom-banner/_bottom-banner.scss | 4 ++-- .../sass/components/bottom-banner/_subscribe-wp-news.scss | 4 ++-- .../sass/components/bottom-banner/_wp-briefing.scss | 4 ++-- .../sass/components/local-header/_categories.scss | 2 +- .../wp-content/themes/wporg-news-2021/sass/post/_header.scss | 2 +- 5 files changed, 8 insertions(+), 8 deletions(-) diff --git a/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_bottom-banner.scss b/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_bottom-banner.scss index f3da4d9a..525891bc 100644 --- a/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_bottom-banner.scss +++ b/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_bottom-banner.scss @@ -4,7 +4,7 @@ } // Default/light version. -.bottom-banner-items[class*="wp-container-"] { +.bottom-banner-items[class*="wp-block-"] { justify-content: space-between; align-items: stretch !important; margin-top: 0; @@ -74,7 +74,7 @@ border-color: #1c2024; } - .bottom-banner .bottom-banner-items[class*="wp-container-"] { + .bottom-banner .bottom-banner-items[class*="wp-block-"] { background-color: var(--wp--preset--color--dark-grey); color: var(--wp--preset--color--white); border-color: #1c2024; diff --git a/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_subscribe-wp-news.scss b/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_subscribe-wp-news.scss index 985e0308..edc553c0 100644 --- a/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_subscribe-wp-news.scss +++ b/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_subscribe-wp-news.scss @@ -1,4 +1,4 @@ -.bottom-banner .bottom-banner-items[class*="wp-container-"] .subscribe-wp-news { +.bottom-banner .bottom-banner-items[class*="wp-block-"] .subscribe-wp-news { .jetpack_subscription_widget { form { display: grid; @@ -55,7 +55,7 @@ // Alternate dark version. %bottom-banner-dark { - .bottom-banner .bottom-banner-items[class*="wp-container-"] .subscribe-wp-news { + .bottom-banner .bottom-banner-items[class*="wp-block-"] .subscribe-wp-news { #subscribe-email input { background-color: var(--wp--preset--color--white); color: var(--wp--preset--color--black); diff --git a/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_wp-briefing.scss b/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_wp-briefing.scss index 0023026a..1eed6729 100644 --- a/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_wp-briefing.scss +++ b/source/wp-content/themes/wporg-news-2021/sass/components/bottom-banner/_wp-briefing.scss @@ -1,4 +1,4 @@ -.bottom-banner .bottom-banner-items[class*="wp-container-"] .wp-briefing { +.bottom-banner .bottom-banner-items[class*="wp-block-"] .wp-briefing { p { margin-top: 0; margin-bottom: 0; @@ -65,7 +65,7 @@ body.single-podcast { } %bottom-banner-dark { - .bottom-banner .bottom-banner-items[class*="wp-container-"] .wp-briefing { + .bottom-banner .bottom-banner-items[class*="wp-block-"] .wp-briefing { .podcast-link { background-image: url(images/brush-stroke-short-2-dark-4.svg); } diff --git a/source/wp-content/themes/wporg-news-2021/sass/components/local-header/_categories.scss b/source/wp-content/themes/wporg-news-2021/sass/components/local-header/_categories.scss index cc3acc62..1f17895a 100644 --- a/source/wp-content/themes/wporg-news-2021/sass/components/local-header/_categories.scss +++ b/source/wp-content/themes/wporg-news-2021/sass/components/local-header/_categories.scss @@ -98,7 +98,7 @@ max-height: none; // Override the default margin applied to the block. - [class*="wp-container-"] & { + [class*="wp-block-"] & { margin: 0; } diff --git a/source/wp-content/themes/wporg-news-2021/sass/post/_header.scss b/source/wp-content/themes/wporg-news-2021/sass/post/_header.scss index 37cf3a56..5819f567 100644 --- a/source/wp-content/themes/wporg-news-2021/sass/post/_header.scss +++ b/source/wp-content/themes/wporg-news-2021/sass/post/_header.scss @@ -1,5 +1,5 @@ .entry-header { - &[class*="wp-container-"] * + * { + &[class*="wp-block-"] * + * { margin-top: 0; } From 4afddee614c7f29155c76d7b82aeb32c177e7914 Mon Sep 17 00:00:00 2001 From: Kelly Dwan Date: Thu, 21 Jul 2022 17:00:22 -0400 Subject: [PATCH 2/2] Update default link style This matches the gutenberg default style, which was overriding the News style due to higher specificity --- .../wp-content/themes/wporg-news-2021/sass/base/_elements.scss | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/source/wp-content/themes/wporg-news-2021/sass/base/_elements.scss b/source/wp-content/themes/wporg-news-2021/sass/base/_elements.scss index 8285c7be..6d0dd8df 100644 --- a/source/wp-content/themes/wporg-news-2021/sass/base/_elements.scss +++ b/source/wp-content/themes/wporg-news-2021/sass/base/_elements.scss @@ -1,5 +1,5 @@ // Links -a { +a:not(.wp-element-button) { cursor: pointer; text-decoration: none; text-decoration-thickness: 1px;