#5133: Rockfield: Fix button outline styles (#6187)

* #5133: Rockfield: Fix button outline styles

* #5133: Rockfield: Remove fixed width on button border radius

rockfield/sass/_extra-child-theme.scss

@@ -88,16 +88,17 @@ a {
 }
 
 @include media(tablet) {
+
 	.site-description {
 		display: inline;
 	}
 
-	.site-title:not(:empty) + .site-description:not(:empty):before {
+	.site-title:not(:empty) + .site-description:not(:empty)::before {
 		color: map-deep-get($config-global, "color", "foreground", "light");
 		content: "\2022";
 		font-family: Arial, Helvetica, sans-serif; // For browsers without CSS custom properties support.
-		font-family: var( --font-headings, 'Arial, Helvetica, sans-serif' );
-		margin: 0 .25em;
+		font-family: var(--font-headings, "Arial, Helvetica, sans-serif");
+		margin: 0 0.25em;
 	}
 }
 
@@ -136,6 +137,7 @@ a {
 			}
 
 			.sub-menu .menu-item a {
+
 				&::before {
 					display: none;
 				}
@@ -147,12 +149,14 @@ a {
 			}
 
 			@include media(mobile) {
+
 				> li {
-					&:not(:first-child):before {
+
+					&:not(:first-child)::before {
 						color: map-deep-get($config-global, "color", "foreground", "light");
 						content: "\2022";
 						font-family: Arial, Helvetica, sans-serif; // For browsers without CSS custom properties support.
-						font-family: var( --font-headings, Arial, Helvetica, sans-serif );
+						font-family: var(--font-headings, Arial, Helvetica, sans-serif);
 						line-height: 1;
 						padding-bottom: #{0.5 * map-deep-get($config-global, "spacing", "unit")};
 						padding-top: #{0.5 * map-deep-get($config-global, "spacing", "unit")};
@@ -162,8 +166,8 @@ a {
 						padding-bottom: #{0.5 * map-deep-get($config-global, "spacing", "unit")};
 						padding-top: #{0.5 * map-deep-get($config-global, "spacing", "unit")};
 
-						&:before,
-						&:after {
+						&::before,
+						&::after {
 							margin: 0;
 						}
 					}
@@ -192,7 +196,7 @@ a {
 	display: flex;
 	padding: #{0.5 * map-deep-get($config-global, "spacing", "unit")} #{map-deep-get($config-global, "spacing", "unit")};
 
-	&:after {
+	&::after {
 		content: "";
 		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'/%3E%3C/svg%3E");
 		display: block;
@@ -208,7 +212,8 @@ a {
 }
 
 #site-navigation #toggle:checked + #toggle-menu {
-	&:after {
+
+	&::after {
 		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'%3E%3C/path%3E%3C/svg%3E");
 	}
 }
@@ -227,8 +232,10 @@ a {
 }
 
 @include media(mobile) {
+
 	#main {
 		padding-top: #{2 * map-deep-get($config-global, "spacing", "vertical")};
+
 		.hide-homepage-header & {
 			padding-top: 0;
 		}
@@ -236,6 +243,7 @@ a {
 }
 
 @include media(tablet) {
+
 	#primary {
 		margin-top: 44px; // JS Fallback
 	}
@@ -251,6 +259,7 @@ a {
 
 	.meta-nav {
 		color: #{map-deep-get($config-global, "color", "foreground", "light")};
+
 		@include font-family( map-deep-get($config-global, "font", "family", "ui") );
 		font-weight: bold;
 		text-transform: uppercase;
@@ -266,6 +275,7 @@ a {
  */
 // Entry Header
 .entry-header {
+
 	.entry-meta {
 		display: none;
 	}
@@ -289,14 +299,18 @@ a {
 .a8c-posts-list .a8c-posts-list-item__featured span {
 	background: #{map-deep-get($config-global, "color", "secondary", "default")};
 	color: #{map-deep-get($config-global, "color", "background", "default")};
+
 	@include font-family( map-deep-get($config-global, "font", "family", "ui") );
 	text-transform: uppercase;
 }
 
 // Remove margin if alignfull is first element
 .home.hide-homepage-title {
+
 	.hentry .entry-content {
+
 		& > *:first-child {
+
 			&.alignfull {
 				margin-top: -#{map-deep-get($config-global, "spacing", "unit")};
 
@@ -310,21 +324,25 @@ a {
 
 // Remove margin if alignfull is first element and header is hidden.
 @include media(mobile) {
+
 	.home.page.hide-homepage-header.hide-homepage-title .hentry .entry-content {
 
-			> .wp-block-image.alignfull:first-child,
-			> .wp-block-cover.alignfull:first-child,
-			> .wp-block-media-text.alignfull:first-child,
-			> .wp-block-group.has-background.alignfull:first-child {
-				margin-top: -#{2.75 * map-deep-get($config-global, "spacing", "unit")};
-			}
+		> .wp-block-image.alignfull:first-child,
+		> .wp-block-cover.alignfull:first-child,
+		> .wp-block-media-text.alignfull:first-child,
+		> .wp-block-group.has-background.alignfull:first-child {
+			margin-top: -#{2.75 * map-deep-get($config-global, "spacing", "unit")};
+		}
 	}
 }
 
 // Remove margin if alignfull is last element
 .page:not(.logged-in) {
+
 	.hentry .entry-content {
+
 		& > *:last-child {
+
 			&.alignfull {
 				margin-bottom: -#{map-deep-get($config-global, "spacing", "vertical")};
 
@@ -352,6 +370,7 @@ a {
 // Cover & Hero block
 .wp-block-cover .wp-block-cover__inner-container,
 .wp-block-coblocks-hero .wp-block-coblocks-hero__box {
+
 	& > * {
 		margin-top: #{0.666 * map-deep-get($config-global, "spacing", "vertical")};
 		margin-bottom: #{0.666 * map-deep-get($config-global, "spacing", "vertical")};
@@ -383,6 +402,7 @@ a {
 // Table block
 table,
 .wp-block-table {
+
 	td,
 	th {
 		border-color: #{map-deep-get($config-global, "color", "border", "default")};
@@ -424,8 +444,11 @@ table,
  * Blog Posts (Newspack)
  */
 .wp-block-newspack-blocks-homepage-articles {
+
 	article {
-		.entry-title a{
+
+		.entry-title a {
+
 			&:active,
 			&:focus,
 			&:hover {
@@ -447,7 +470,9 @@ table,
 	}
 
 	&.image-alignbehind article {
-		.entry-title a{
+
+		.entry-title a {
+
 			&:active,
 			&:focus,
 			&:hover {
@@ -460,8 +485,11 @@ table,
 .has-background:not(.has-background-background-color),
 [class*="background-color"]:not(.has-background-background-color),
 [style*="background-color"] {
+
 	.wp-block-newspack-blocks-homepage-articles article {
-		.entry-title a{
+
+		.entry-title a {
+
 			&:active,
 			&:focus,
 			&:hover {
@@ -479,6 +507,7 @@ table,
 }
 
 .comment-list {
+
 	> li:first-child {
 		border-top-width: 2px;
 	}
@@ -492,6 +521,7 @@ table,
 }
 
 .comment-meta .comment-metadata {
+
 	@include font-family( map-deep-get($config-global, "font", "family", "ui") );
 	font-size: #{map-deep-get($config-global, "font", "size", "sm")};
 	font-weight: bold;
@@ -512,6 +542,7 @@ table,
 }
 
 .comment-respond {
+
 	.form-submit {
 		display: flex;
 		justify-content: center;
@@ -519,6 +550,7 @@ table,
 }
 
 @include media(tablet) {
+
 	.comment-meta {
 		border-right: 1px solid #{map-deep-get($config-global, "color", "border", "default")};
 		display: block;
@@ -538,7 +570,8 @@ table,
 		}
 	}
 
-	.comment-content, .reply {
+	.comment-content,
+	.reply {
 		float: right;
 		width: 75%;
 		width: calc(80% - #{map-deep-get($config-global, "spacing", "horizontal")} - 1px);
@@ -557,8 +590,8 @@ table,
 .widget-area {
 	width: 100%;
 
-	&:before {
-		background: map-deep-get($config-global, "color", "border", "default");;
+	&::before {
+		background: map-deep-get($config-global, "color", "border", "default");
 		height: 1px;
 		content: "";
 		display: block;
@@ -574,6 +607,7 @@ table,
 	.widget-title,
 	.widgettitle {
 		font-size: #{map-deep-get($config-global, "font", "size", "base")};
+
 		@include font-family( map-deep-get($config-global, "font", "family", "ui") );
 		margin-bottom: #{0.5 * map-deep-get($config-global, "spacing", "vertical")};
 
@@ -600,6 +634,7 @@ table,
 // Widgets
 .widget_calendar,
 .widget_calendar {
+
 	caption {
 		font-weight: bold;
 	}
@@ -625,6 +660,7 @@ table,
 .widget_jp_blogs_i_follow,
 .widget_top-click,
 .widget_upcoming_events_widget {
+
 	ul {
 		border-bottom: 1px solid map-deep-get($config-global, "color", "border", "default");
 		list-style: none;
@@ -651,6 +687,7 @@ table,
 }
 
 .widget_rss {
+
 	cite,
 	.rssSummary,
 	.rss-date {
@@ -659,6 +696,7 @@ table,
 }
 
 .widget_search {
+
 	input[type="search"] {
 		display: block;
 		margin-bottom: #{0.25 * map-deep-get($config-global, "spacing", "vertical")};
@@ -712,11 +750,12 @@ table,
 		text-align: inherit;
 
 		> li {
-			&:not(:first-child):before {
+
+			&:not(:first-child)::before {
 				color: map-deep-get($config-global, "color", "border", "dark");
 				content: "\2022";
 				font-family: Arial, Helvetica, sans-serif; // For browsers without CSS custom properties support.
-				font-family: var( --font-headings, 'Arial, Helvetica, sans-serif' );
+				font-family: var(--font-headings, "Arial, Helvetica, sans-serif");
 			}
 		}
 	}
@@ -747,8 +786,9 @@ table,
 .a8c-posts-list__view-all {
 	position: relative;
 
-	&:before {
+	&::before {
 		border: 2px solid;
+		border-radius: inherit;
 		content: "";
 		display: block;
 		left: 3px;
@@ -766,18 +806,13 @@ input[type="submit"] {
 	outline-offset: -5px;
 }
 
-.is-style-circular .wp-block-button__link {
-	&:before {
-		border-radius: 100px;
-	}
-}
-
 /**
  * AMP Support
  */
 html[amp] {
 
 	@include media( tablet ) {
+
 		#masthead {
 			position: sticky;
 			top: 0;
@@ -787,7 +822,9 @@ html[amp] {
 			top: 32px;
 		}
 	}
+
 	@media screen and ( max-width: 782px ) {
+
 		.logged-in #masthead {
 			top: 46px;
 		}
@@ -797,11 +834,13 @@ html[amp] {
 /**
  * Search block
  */
- .wp-block-search {
+.wp-block-search {
+
 	.wp-block-search__input {
-		margin-right: calc( .1 * #{map-deep-get($config-button, "padding", "horizontal")} );
+		margin-right: calc(0.1 * #{map-deep-get($config-button, "padding", "horizontal")});
 	}
+
 	.wp-block-search__button {
-		margin-left: calc( .1 * #{map-deep-get($config-button, "padding", "horizontal")} );
+		margin-left: calc(0.1 * #{map-deep-get($config-button, "padding", "horizontal")});
 	}
 }

rockfield/sass/style-child-theme-editor.scss

@@ -13,7 +13,9 @@
 */
 @import "global-variables";
 
-:root, body {
+:root,
+body {
+
 	@include global-variables();
 }
 
@@ -50,9 +52,9 @@
 /**
  * Extras
  */
- .editor-post-title__input {
- 	text-align: center;
- }
+.editor-post-title__input {
+	text-align: center;
+}
 
 .wp-block-pullquote {
 	border-bottom-width: 1px;
@@ -61,27 +63,24 @@
 .wp-block-button__link {
 	position: relative;
 
-	&:before {
+	&::before {
 		border: 2px solid;
+		border-radius: inherit;
 		content: "";
 		display: block;
 		left: 3px;
 		margin: 0;
 		position: absolute;
 		top: 3px;
-		height: calc(100% - 6px);
-		width: calc(100% - 6px);
-	}
-}
-
-.is-style-circular .wp-block-button__link {
-	&:before {
-		border-radius: 100px;
+		height: calc(100% - 10px);
+		width: calc(100% - 10px);
 	}
 }
 
 .wp-block-a8c-blog-posts {
+
 	.entry-title a {
+
 		&:active,
 		&:focus,
 		&:hover {
@@ -102,7 +101,9 @@
 	}
 
 	&.image-alignbehind article {
+
 		.entry-title a {
+
 			&:active,
 			&:focus,
 			&:hover {
@@ -115,8 +116,11 @@
 .has-background:not(.has-background-background-color),
 [class*="background-color"]:not(.has-background-background-color),
 [style*="background-color"] {
+
 	.wp-block-a8c-blog-posts {
-		.entry-title a{
+
+		.entry-title a {
+
 			&:active,
 			&:focus,
 			&:hover {
@@ -127,7 +131,7 @@
 }
 
 .wp-block-a8c-blog-posts + .button {
-	font-size: (strip-unit(map-deep-get($config-global, "font", "size", "sm")) + 0em);
+	font-size: (strip-unit(map-deep-get($config-global, "font", "size", "sm")) + 0);
 	outline: 2px solid;
 	outline-offset: -5px;
 }

rockfield/style-editor.css

@@ -123,7 +123,8 @@ $grid-configuration: map-extend($grid-configuration-default, $grid-configuration
 /**
 * Global variables
 */
-:root, body {
+:root,
+body {
 	/* Colors */
 	--wp--preset--color--primary: #222;
 	--wp--preset--color--primary-hover: #444;
@@ -1449,20 +1450,17 @@ pre.wp-block-verse {
 	position: relative;
 }
 
-.wp-block-button__link:before {
+.wp-block-button__link::before {
 	border: 2px solid;
+	border-radius: inherit;
 	content: "";
 	display: block;
 	left: 3px;
 	margin: 0;
 	position: absolute;
 	top: 3px;
-	height: calc(100% - 6px);
-	width: calc(100% - 6px);
-}
-
-.is-style-circular .wp-block-button__link:before {
-	border-radius: 100px;
+	height: calc(100% - 10px);
+	width: calc(100% - 10px);
 }
 
 .wp-block-a8c-blog-posts .entry-title a:active, .wp-block-a8c-blog-posts .entry-title a:focus, .wp-block-a8c-blog-posts .entry-title a:hover {
@@ -1500,7 +1498,7 @@ pre.wp-block-verse {
 }
 
 .wp-block-a8c-blog-posts + .button {
-	font-size: 0.83333em;
+	font-size: 0.83333;
 	outline: 2px solid;
 	outline-offset: -5px;
 }

rockfield/style-rtl.css

@@ -6,7 +6,7 @@ Author: Automattic
 Author URI: https://automattic.com/
 Description: Rockfield is a refined theme designed for restaurants and food-related businesses seeking a classic, elegant look.
 Requires at least: WordPress 4.9.6
-Version: 1.4.15
+Version: 1.4.17
 License: GNU General Public License v2 or later
 License URI: LICENSE
 Template: varia
@@ -3797,7 +3797,7 @@ body:not(.fse-enabled) .footer-menu a {
 	}
 }
 
-.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .widget-area:before, .social-navigation {
+.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .widget-area::before, .social-navigation {
 	margin-right: -16px;
 	margin-left: -16px;
 	width: calc(100% + 32px);
@@ -3806,7 +3806,7 @@ body:not(.fse-enabled) .footer-menu a {
 }
 
 @media only screen and (min-width: 560px) {
-	.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .widget-area:before, .social-navigation {
+	.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .widget-area::before, .social-navigation {
 		margin-right: inherit;
 		margin-left: inherit;
 		width: inherit;
@@ -4160,12 +4160,12 @@ p:not(.site-title) a:hover {
 	.site-description {
 		display: inline;
 	}
-	.site-title:not(:empty) + .site-description:not(:empty):before {
+	.site-title:not(:empty) + .site-description:not(:empty)::before {
 		color: var(--wp--preset--color--foreground-low-contrast);
 		content: "\2022";
 		font-family: Arial, Helvetica, sans-serif;
 		font-family: var(--font-headings, "Arial, Helvetica, sans-serif");
-		margin: 0 .25em;
+		margin: 0 0.25em;
 	}
 }
 
@@ -4218,7 +4218,7 @@ p:not(.site-title) a:hover {
 }
 
 @media only screen and (min-width: 560px) {
-	#site-navigation > div > ul > li:not(:first-child):before {
+	#site-navigation > div > ul > li:not(:first-child)::before {
 		color: var(--wp--preset--color--foreground-low-contrast);
 		content: "\2022";
 		font-family: Arial, Helvetica, sans-serif;
@@ -4231,7 +4231,7 @@ p:not(.site-title) a:hover {
 		padding-bottom: 8px;
 		padding-top: 8px;
 	}
-	#site-navigation > div > ul > li > a:before, #site-navigation > div > ul > li > a:after {
+	#site-navigation > div > ul > li > a::before, #site-navigation > div > ul > li > a::after {
 		margin: 0;
 	}
 	#site-navigation > div > ul > li > .sub-menu {
@@ -4254,7 +4254,7 @@ p:not(.site-title) a:hover {
 	padding: 8px 16px;
 }
 
-#site-navigation #toggle-menu:after {
+#site-navigation #toggle-menu::after {
 	content: "";
 	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'/%3E%3C/svg%3E");
 	display: block;
@@ -4270,7 +4270,7 @@ p:not(.site-title) a:hover {
 	}
 }
 
-#site-navigation #toggle:checked + #toggle-menu:after {
+#site-navigation #toggle:checked + #toggle-menu::after {
 	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'%3E%3C/path%3E%3C/svg%3E");
 }
 
@@ -4564,7 +4564,8 @@ table th,
 		display: block;
 		margin-bottom: 8px;
 	}
-	.comment-content, .reply {
+	.comment-content,
+	.reply {
 		float: left;
 		width: 75%;
 		width: calc(80% - 16px - 1px);
@@ -4583,7 +4584,7 @@ table th,
 	width: 100%;
 }
 
-.widget-area:before {
+.widget-area::before {
 	background: var(--wp--preset--color--border);
 	height: 1px;
 	content: "";
@@ -4592,7 +4593,7 @@ table th,
 }
 
 @media only screen and (min-width: 560px) {
-	.widget-area:before {
+	.widget-area::before {
 		margin-bottom: 64px;
 	}
 }
@@ -4745,7 +4746,7 @@ table th,
 	text-align: inherit;
 }
 
-.footer-navigation .footer-menu > li:not(:first-child):before {
+.footer-navigation .footer-menu > li:not(:first-child)::before {
 	color: var(--wp--preset--color--border-high-contrast);
 	content: "\2022";
 	font-family: Arial, Helvetica, sans-serif;
@@ -4780,11 +4781,12 @@ table th,
 	position: relative;
 }
 
-.button:before,
-.wp-block-button__link:before,
-.wp-block-file__button:before,
-.a8c-posts-list__view-all:before {
+.button::before,
+.wp-block-button__link::before,
+.wp-block-file__button::before,
+.a8c-posts-list__view-all::before {
 	border: 2px solid;
+	border-radius: inherit;
 	content: "";
 	display: block;
 	right: 3px;
@@ -4801,10 +4803,6 @@ input[type="submit"] {
 	outline-offset: -5px;
 }
 
-.is-style-circular .wp-block-button__link:before {
-	border-radius: 100px;
-}
-
 /**
  * AMP Support
  */
@@ -4828,9 +4826,9 @@ input[type="submit"] {
  * Search block
  */
 .wp-block-search .wp-block-search__input {
-	margin-left: calc( .1 * 20px);
+	margin-left: calc(0.1 * 20px);
 }
 
 .wp-block-search .wp-block-search__button {
-	margin-right: calc( .1 * 20px);
+	margin-right: calc(0.1 * 20px);
 }

rockfield/style.css

@@ -3816,7 +3816,7 @@ body:not(.fse-enabled) .footer-menu a {
 	}
 }
 
-.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .widget-area:before, .social-navigation {
+.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .widget-area::before, .social-navigation {
 	margin-left: -16px;
 	margin-right: -16px;
 	width: calc(100% + 32px);
@@ -3825,7 +3825,7 @@ body:not(.fse-enabled) .footer-menu a {
 }
 
 @media only screen and (min-width: 560px) {
-	.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .widget-area:before, .social-navigation {
+	.entry-content > .alignfull, .entry-content > .alignfull.wp-block-jetpack-gif, .entry-content > .alignfull.wp-block-jetpack-tiled-gallery, .widget-area::before, .social-navigation {
 		margin-left: inherit;
 		margin-right: inherit;
 		width: inherit;
@@ -4189,12 +4189,12 @@ p:not(.site-title) a:hover {
 	.site-description {
 		display: inline;
 	}
-	.site-title:not(:empty) + .site-description:not(:empty):before {
+	.site-title:not(:empty) + .site-description:not(:empty)::before {
 		color: var(--wp--preset--color--foreground-low-contrast);
 		content: "\2022";
 		font-family: Arial, Helvetica, sans-serif;
 		font-family: var(--font-headings, "Arial, Helvetica, sans-serif");
-		margin: 0 .25em;
+		margin: 0 0.25em;
 	}
 }
 
@@ -4247,7 +4247,7 @@ p:not(.site-title) a:hover {
 }
 
 @media only screen and (min-width: 560px) {
-	#site-navigation > div > ul > li:not(:first-child):before {
+	#site-navigation > div > ul > li:not(:first-child)::before {
 		color: var(--wp--preset--color--foreground-low-contrast);
 		content: "\2022";
 		font-family: Arial, Helvetica, sans-serif;
@@ -4260,7 +4260,7 @@ p:not(.site-title) a:hover {
 		padding-bottom: 8px;
 		padding-top: 8px;
 	}
-	#site-navigation > div > ul > li > a:before, #site-navigation > div > ul > li > a:after {
+	#site-navigation > div > ul > li > a::before, #site-navigation > div > ul > li > a::after {
 		margin: 0;
 	}
 	#site-navigation > div > ul > li > .sub-menu {
@@ -4283,7 +4283,7 @@ p:not(.site-title) a:hover {
 	padding: 8px 16px;
 }
 
-#site-navigation #toggle-menu:after {
+#site-navigation #toggle-menu::after {
 	content: "";
 	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'/%3E%3C/svg%3E");
 	display: block;
@@ -4299,7 +4299,7 @@ p:not(.site-title) a:hover {
 	}
 }
 
-#site-navigation #toggle:checked + #toggle-menu:after {
+#site-navigation #toggle:checked + #toggle-menu::after {
 	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z'%3E%3C/path%3E%3C/svg%3E");
 }
 
@@ -4593,7 +4593,8 @@ table th,
 		display: block;
 		margin-bottom: 8px;
 	}
-	.comment-content, .reply {
+	.comment-content,
+	.reply {
 		float: right;
 		width: 75%;
 		width: calc(80% - 16px - 1px);
@@ -4612,7 +4613,7 @@ table th,
 	width: 100%;
 }
 
-.widget-area:before {
+.widget-area::before {
 	background: var(--wp--preset--color--border);
 	height: 1px;
 	content: "";
@@ -4621,7 +4622,7 @@ table th,
 }
 
 @media only screen and (min-width: 560px) {
-	.widget-area:before {
+	.widget-area::before {
 		margin-bottom: 64px;
 	}
 }
@@ -4774,7 +4775,7 @@ table th,
 	text-align: inherit;
 }
 
-.footer-navigation .footer-menu > li:not(:first-child):before {
+.footer-navigation .footer-menu > li:not(:first-child)::before {
 	color: var(--wp--preset--color--border-high-contrast);
 	content: "\2022";
 	font-family: Arial, Helvetica, sans-serif;
@@ -4809,11 +4810,12 @@ table th,
 	position: relative;
 }
 
-.button:before,
-.wp-block-button__link:before,
-.wp-block-file__button:before,
-.a8c-posts-list__view-all:before {
+.button::before,
+.wp-block-button__link::before,
+.wp-block-file__button::before,
+.a8c-posts-list__view-all::before {
 	border: 2px solid;
+	border-radius: inherit;
 	content: "";
 	display: block;
 	left: 3px;
@@ -4830,10 +4832,6 @@ input[type="submit"] {
 	outline-offset: -5px;
 }
 
-.is-style-circular .wp-block-button__link:before {
-	border-radius: 100px;
-}
-
 /**
  * AMP Support
  */
@@ -4857,9 +4855,9 @@ input[type="submit"] {
  * Search block
  */
 .wp-block-search .wp-block-search__input {
-	margin-right: calc( .1 * 20px);
+	margin-right: calc(0.1 * 20px);
 }
 
 .wp-block-search .wp-block-search__button {
-	margin-left: calc( .1 * 20px);
+	margin-left: calc(0.1 * 20px);
 }