Blockbase: separated mixins from rules for the button block (#3985)

* separated mixins from rules for the button block
* Removed unnecessary stylistic hover styles that were breaking on Chrome

Co-authored-by: Jason Crist <jcrist@pbking.com>

blockbase/assets/ponyfill.css

@@ -261,26 +261,6 @@ input[type=checkbox] + label {
 	fill: var(--wp--custom--button--color--text);
 }
 
-.wp-block-button.wp-block-button__link:hover, .wp-block-button.wp-block-button__link:focus, .wp-block-button.wp-block-button__link.has-focus,
-.wp-block-button .wp-block-button__link:hover,
-.wp-block-button .wp-block-button__link:focus,
-.wp-block-button .wp-block-button__link.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
 .wp-block-button.wp-block-button__link svg,
 .wp-block-button .wp-block-button__link svg {
 	fill: var(--wp--custom--button--color--text);
@@ -323,26 +303,6 @@ input[type=checkbox] + label {
 	fill: var(--wp--custom--button--color--text);
 }
 
-.wp-block-button.is-style-outline.wp-block-button__link:hover, .wp-block-button.is-style-outline.wp-block-button__link:focus, .wp-block-button.is-style-outline.wp-block-button__link.has-focus,
-.wp-block-button.is-style-outline .wp-block-button__link:hover,
-.wp-block-button.is-style-outline .wp-block-button__link:focus,
-.wp-block-button.is-style-outline .wp-block-button__link.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
 .wp-block-button.is-style-outline.wp-block-button__link svg,
 .wp-block-button.is-style-outline .wp-block-button__link svg {
 	fill: var(--wp--custom--button--color--text);
@@ -406,143 +366,6 @@ p.has-drop-cap:not(:focus):first-letter {
 	font-weight: var(--wp--custom--post-author--font-weight);
 }
 
-/**
- * Button
- */
-/**
- * Block Options
- */
-.wp-block-button.wp-block-button__link,
-.wp-block-button .wp-block-button__link {
-	border-width: 0;
-	padding-top: calc( var(--wp--custom--button--spacing--padding--top) + var(--wp--custom--button--border--width));
-	padding-bottom: calc( var(--wp--custom--button--spacing--padding--bottom) + var(--wp--custom--button--border--width));
-	padding-left: calc( var(--wp--custom--button--spacing--padding--left) + var(--wp--custom--button--border--width));
-	padding-right: calc( var(--wp--custom--button--spacing--padding--right) + var(--wp--custom--button--border--width));
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-radius: var(--wp--custom--button--border--radius);
-}
-
-.wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):hover, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):focus, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):hover,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):focus,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus {
-	--wp--custom--button--color--text: var(--wp--custom--button--hover--color--text);
-	--wp--custom--button--color--background: var(--wp--custom--button--hover--color--background);
-	--wp--custom--button--border--color: var(--wp--custom--button--hover--border--color);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-color: var(--wp--custom--button--border--color);
-}
-
-.wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):hover svg, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):focus svg, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):hover svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):focus svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.wp-block-button__link:hover, .wp-block-button.wp-block-button__link:focus, .wp-block-button.wp-block-button__link.has-focus,
-.wp-block-button .wp-block-button__link:hover,
-.wp-block-button .wp-block-button__link:focus,
-.wp-block-button .wp-block-button__link.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
-.wp-block-button.wp-block-button__link svg,
-.wp-block-button .wp-block-button__link svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link,
-.wp-block-button.is-style-outline .wp-block-button__link {
-	--wp--custom--button--color--text: var(--wp--custom--button--border--color);
-	--wp--custom--button--color--background: transparent;
-	border-style: var(--wp--custom--button--border--style);
-	border-width: var(--wp--custom--button--border--width);
-	padding-top: var(--wp--custom--button--spacing--padding--top);
-	padding-bottom: var(--wp--custom--button--spacing--padding--bottom);
-	padding-left: var(--wp--custom--button--spacing--padding--left);
-	padding-right: var(--wp--custom--button--spacing--padding--right);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):hover, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):focus, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):hover,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):focus,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus {
-	--wp--custom--button--color--text: var(--wp--custom--button--hover--color--text);
-	--wp--custom--button--color--background: var(--wp--custom--button--hover--color--background);
-	--wp--custom--button--border--color: var(--wp--custom--button--hover--border--color);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-color: var(--wp--custom--button--border--color);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):hover svg, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):focus svg, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):hover svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):focus svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:hover, .wp-block-button.is-style-outline.wp-block-button__link:focus, .wp-block-button.is-style-outline.wp-block-button__link.has-focus,
-.wp-block-button.is-style-outline .wp-block-button__link:hover,
-.wp-block-button.is-style-outline .wp-block-button__link:focus,
-.wp-block-button.is-style-outline .wp-block-button__link.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link svg,
-.wp-block-button.is-style-outline .wp-block-button__link svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-buttons .wp-block-button:last-child {
-	margin-bottom: 0;
-}
-
 .wp-block-post-comments .comment {
 	font-size: var(--wp--custom--form--typography--font-size);
 }
@@ -588,23 +411,6 @@ p.has-drop-cap:not(:focus):first-letter {
 	fill: var(--wp--custom--button--color--text);
 }
 
-.wp-block-post-comments input[type="submit"]:hover, .wp-block-post-comments input[type="submit"]:focus, .wp-block-post-comments input[type="submit"].has-focus, .wp-block-post-comments .reply a:hover, .wp-block-post-comments .reply a:focus, .wp-block-post-comments .reply a.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
 .wp-block-post-comments .reply a {
 	display: inline-block;
 }
@@ -700,143 +506,6 @@ p.has-drop-cap:not(:focus):first-letter {
 	font-style: var(--wp--custom--quote--citation--typography--font-style);
 }
 
-/**
- * Button
- */
-/**
- * Block Options
- */
-.wp-block-button.wp-block-button__link,
-.wp-block-button .wp-block-button__link {
-	border-width: 0;
-	padding-top: calc( var(--wp--custom--button--spacing--padding--top) + var(--wp--custom--button--border--width));
-	padding-bottom: calc( var(--wp--custom--button--spacing--padding--bottom) + var(--wp--custom--button--border--width));
-	padding-left: calc( var(--wp--custom--button--spacing--padding--left) + var(--wp--custom--button--border--width));
-	padding-right: calc( var(--wp--custom--button--spacing--padding--right) + var(--wp--custom--button--border--width));
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-radius: var(--wp--custom--button--border--radius);
-}
-
-.wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):hover, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):focus, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):hover,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):focus,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus {
-	--wp--custom--button--color--text: var(--wp--custom--button--hover--color--text);
-	--wp--custom--button--color--background: var(--wp--custom--button--hover--color--background);
-	--wp--custom--button--border--color: var(--wp--custom--button--hover--border--color);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-color: var(--wp--custom--button--border--color);
-}
-
-.wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):hover svg, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):focus svg, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):hover svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):focus svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.wp-block-button__link:hover, .wp-block-button.wp-block-button__link:focus, .wp-block-button.wp-block-button__link.has-focus,
-.wp-block-button .wp-block-button__link:hover,
-.wp-block-button .wp-block-button__link:focus,
-.wp-block-button .wp-block-button__link.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
-.wp-block-button.wp-block-button__link svg,
-.wp-block-button .wp-block-button__link svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link,
-.wp-block-button.is-style-outline .wp-block-button__link {
-	--wp--custom--button--color--text: var(--wp--custom--button--border--color);
-	--wp--custom--button--color--background: transparent;
-	border-style: var(--wp--custom--button--border--style);
-	border-width: var(--wp--custom--button--border--width);
-	padding-top: var(--wp--custom--button--spacing--padding--top);
-	padding-bottom: var(--wp--custom--button--spacing--padding--bottom);
-	padding-left: var(--wp--custom--button--spacing--padding--left);
-	padding-right: var(--wp--custom--button--spacing--padding--right);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):hover, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):focus, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):hover,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):focus,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus {
-	--wp--custom--button--color--text: var(--wp--custom--button--hover--color--text);
-	--wp--custom--button--color--background: var(--wp--custom--button--hover--color--background);
-	--wp--custom--button--border--color: var(--wp--custom--button--hover--border--color);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-color: var(--wp--custom--button--border--color);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):hover svg, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):focus svg, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):hover svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):focus svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:hover, .wp-block-button.is-style-outline.wp-block-button__link:focus, .wp-block-button.is-style-outline.wp-block-button__link.has-focus,
-.wp-block-button.is-style-outline .wp-block-button__link:hover,
-.wp-block-button.is-style-outline .wp-block-button__link:focus,
-.wp-block-button.is-style-outline .wp-block-button__link.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link svg,
-.wp-block-button.is-style-outline .wp-block-button__link svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-buttons .wp-block-button:last-child {
-	margin-bottom: 0;
-}
-
 .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper {
 	padding: var(--wp--custom--form--padding);
 	border: var(--wp--custom--form--border--width) var(--wp--custom--form--border--style) var(--wp--custom--form--border--color);
@@ -897,26 +566,6 @@ p.has-drop-cap:not(:focus):first-letter {
 	fill: var(--wp--custom--button--color--text);
 }
 
-.wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button:hover, .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button:focus, .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-focus,
-.wp-block-search .wp-block-search__button:hover,
-.wp-block-search .wp-block-search__button:focus,
-.wp-block-search .wp-block-search__button.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
 .wp-block-search.wp-block-search__button-inside .wp-block-search__inside-wrapper .wp-block-search__button.has-icon,
 .wp-block-search .wp-block-search__button.has-icon {
 	line-height: 0;
@@ -931,143 +580,6 @@ p.has-drop-cap:not(:focus):first-letter {
 	width: var(--wp--custom--separator--width);
 }
 
-/**
- * Button
- */
-/**
- * Block Options
- */
-.wp-block-button.wp-block-button__link,
-.wp-block-button .wp-block-button__link {
-	border-width: 0;
-	padding-top: calc( var(--wp--custom--button--spacing--padding--top) + var(--wp--custom--button--border--width));
-	padding-bottom: calc( var(--wp--custom--button--spacing--padding--bottom) + var(--wp--custom--button--border--width));
-	padding-left: calc( var(--wp--custom--button--spacing--padding--left) + var(--wp--custom--button--border--width));
-	padding-right: calc( var(--wp--custom--button--spacing--padding--right) + var(--wp--custom--button--border--width));
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-radius: var(--wp--custom--button--border--radius);
-}
-
-.wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):hover, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):focus, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):hover,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):focus,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus {
-	--wp--custom--button--color--text: var(--wp--custom--button--hover--color--text);
-	--wp--custom--button--color--background: var(--wp--custom--button--hover--color--background);
-	--wp--custom--button--border--color: var(--wp--custom--button--hover--border--color);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-color: var(--wp--custom--button--border--color);
-}
-
-.wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):hover svg, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):focus svg, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):hover svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):focus svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.wp-block-button__link:hover, .wp-block-button.wp-block-button__link:focus, .wp-block-button.wp-block-button__link.has-focus,
-.wp-block-button .wp-block-button__link:hover,
-.wp-block-button .wp-block-button__link:focus,
-.wp-block-button .wp-block-button__link.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
-.wp-block-button.wp-block-button__link svg,
-.wp-block-button .wp-block-button__link svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link,
-.wp-block-button.is-style-outline .wp-block-button__link {
-	--wp--custom--button--color--text: var(--wp--custom--button--border--color);
-	--wp--custom--button--color--background: transparent;
-	border-style: var(--wp--custom--button--border--style);
-	border-width: var(--wp--custom--button--border--width);
-	padding-top: var(--wp--custom--button--spacing--padding--top);
-	padding-bottom: var(--wp--custom--button--spacing--padding--bottom);
-	padding-left: var(--wp--custom--button--spacing--padding--left);
-	padding-right: var(--wp--custom--button--spacing--padding--right);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):hover, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):focus, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):hover,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):focus,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus {
-	--wp--custom--button--color--text: var(--wp--custom--button--hover--color--text);
-	--wp--custom--button--color--background: var(--wp--custom--button--hover--color--background);
-	--wp--custom--button--border--color: var(--wp--custom--button--hover--border--color);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-color: var(--wp--custom--button--border--color);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):hover svg, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):focus svg, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):hover svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):focus svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:hover, .wp-block-button.is-style-outline.wp-block-button__link:focus, .wp-block-button.is-style-outline.wp-block-button__link.has-focus,
-.wp-block-button.is-style-outline .wp-block-button__link:hover,
-.wp-block-button.is-style-outline .wp-block-button__link:focus,
-.wp-block-button.is-style-outline .wp-block-button__link.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link svg,
-.wp-block-button.is-style-outline .wp-block-button__link svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-buttons .wp-block-button:last-child {
-	margin-bottom: 0;
-}
-
 .wp-block-file .wp-block-file__button {
 	border-width: 0;
 	padding-top: calc( var(--wp--custom--button--spacing--padding--top) + var(--wp--custom--button--border--width));
@@ -1106,23 +618,6 @@ p.has-drop-cap:not(:focus):first-letter {
 	fill: var(--wp--custom--button--color--text);
 }
 
-.wp-block-file .wp-block-file__button:hover, .wp-block-file .wp-block-file__button:focus, .wp-block-file .wp-block-file__button.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
 .wp-block-table figcaption {
 	font-size: var(--wp--custom--table--figcaption--typography--font-size);
 	text-align: center;

blockbase/sass/base/_mixins.scss

@@ -11,4 +11,4 @@
 	position: absolute;
 	width: 1px;
 	word-wrap: normal !important;
-}
+}

blockbase/sass/blocks/_button-mixins.scss

@@ -0,0 +1,64 @@
+// NOTE: These remain for the styling of buttons that are NOT blocks and is used elsewhere.  This can be removed when those no longer exist.
+@mixin button-main-styles {
+	@include button-padding-styles;
+	@include button-typography-styles;
+	@include button-color-styles;
+	border-radius: var(--wp--custom--button--border--radius);
+}
+
+@mixin button-color-styles {
+	opacity: 1;
+	color: var(--wp--custom--button--color--text);
+	background-color: var(--wp--custom--button--color--background);
+	border-color: currentColor;
+	svg {
+		fill: var(--wp--custom--button--color--text);
+	}
+}
+
+//standard Button padding.  Account for desired padding size and the size of the border width (so that the total height of
+//standard and outline buttons are equal.
+@mixin button-padding-styles {
+	border-width: 0;
+	padding-top: calc( var(--wp--custom--button--spacing--padding--top) + var(--wp--custom--button--border--width) );
+	padding-bottom: calc( var(--wp--custom--button--spacing--padding--bottom) + var(--wp--custom--button--border--width) );
+	padding-left: calc( var(--wp--custom--button--spacing--padding--left) + var(--wp--custom--button--border--width) );
+	padding-right: calc( var(--wp--custom--button--spacing--padding--right) + var(--wp--custom--button--border--width) );
+}
+
+@mixin button-typography-styles {
+	font-weight: var(--wp--custom--button--typography--font-weight);
+	font-family: var(--wp--custom--button--typography--font-family);
+	font-size: var(--wp--custom--button--typography--font-size);
+	line-height: var(--wp--custom--button--typography--line-height);
+	text-decoration: none; // Needed because link styles inside .entry-content add a text decoration
+}
+
+//apply outline styles. apply padding that does NOT account for border width (as the border width is applied here).
+@mixin button-border-styles {
+	border-style: var(--wp--custom--button--border--style);
+	border-width: var(--wp--custom--button--border--width);
+	padding-top: var(--wp--custom--button--spacing--padding--top);
+	padding-bottom: var(--wp--custom--button--spacing--padding--bottom);
+	padding-left: var(--wp--custom--button--spacing--padding--left);
+	padding-right: var(--wp--custom--button--spacing--padding--right);
+}
+
+
+// NOTE: These remain for the hover styling of blocks.  This can be removed when the button block has configurable hover states.
+// The mechanism below ONLY CHANGES CSS VARIABLES that are already applied to properties (above)
+@mixin button-hover-styles {
+	//The following changes should ONLY be changed if the user has NOT set a custom color
+	&:not(.has-background):not(.has-text-color) {
+		&:hover,
+		&:focus,
+		&.has-focus {
+			//change the color variables to the hover equivalent
+			--wp--custom--button--color--text: var(--wp--custom--button--hover--color--text);
+			--wp--custom--button--color--background: var(--wp--custom--button--hover--color--background);
+			--wp--custom--button--border--color: var(--wp--custom--button--hover--border--color);
+			@include button-color-styles;
+			border-color: var(--wp--custom--button--border--color);
+		}
+	}
+}

blockbase/sass/blocks/_button.scss

@@ -1,87 +1,8 @@
+@import 'button-mixins';
 /**
  * Button
  */
 
-// NOTE: These remain for the styling of buttons that are NOT blocks and is used elsewhere.  This can be removed when those no longer exist.
-@mixin button-main-styles {
-	@include button-padding-styles;
-	@include button-typography-styles;
-	@include button-color-styles;
-	border-radius: var(--wp--custom--button--border--radius);
-}
-
-@mixin button-color-styles {
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	svg {
-		fill: var(--wp--custom--button--color--text);
-	}
-}
-
-//standard Button padding.  Account for desired padding size and the size of the border width (so that the total height of
-//standard and outline buttons are equal.
-@mixin button-padding-styles {
-	border-width: 0;
-	padding-top: calc( var(--wp--custom--button--spacing--padding--top) + var(--wp--custom--button--border--width) );
-	padding-bottom: calc( var(--wp--custom--button--spacing--padding--bottom) + var(--wp--custom--button--border--width) );
-	padding-left: calc( var(--wp--custom--button--spacing--padding--left) + var(--wp--custom--button--border--width) );
-	padding-right: calc( var(--wp--custom--button--spacing--padding--right) + var(--wp--custom--button--border--width) );
-}
-
-@mixin button-typography-styles {
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none; // Needed because link styles inside .entry-content add a text decoration
-}
-
-//apply outline styles. apply padding that does NOT account for border width (as the border width is applied here).
-@mixin button-border-styles {
-	border-style: var(--wp--custom--button--border--style);
-	border-width: var(--wp--custom--button--border--width);
-	padding-top: var(--wp--custom--button--spacing--padding--top);
-	padding-bottom: var(--wp--custom--button--spacing--padding--bottom);
-	padding-left: var(--wp--custom--button--spacing--padding--left);
-	padding-right: var(--wp--custom--button--spacing--padding--right);
-}
-
-
-// NOTE: These remain for the hover styling of blocks.  This can be removed when the button block has configurable hover states.
-// The mechanism below ONLY CHANGES CSS VARIABLES that are already applied to properties (above)
-@mixin button-hover-styles {
-	//The following changes should ONLY be changed if the user has NOT set a custom color
-	&:not(.has-background):not(.has-text-color) {
-		&:hover,
-		&:focus,
-		&.has-focus {
-			//change the color variables to the hover equivalent
-			--wp--custom--button--color--text: var(--wp--custom--button--hover--color--text);
-			--wp--custom--button--color--background: var(--wp--custom--button--hover--color--background);
-			--wp--custom--button--border--color: var(--wp--custom--button--hover--border--color);
-			@include button-color-styles;
-			border-color: var(--wp--custom--button--border--color);
-		}
-	}
-	//The following styles can ALWAYS be changed, even if the user has set a custom color.
-	&:hover,
-	&:focus,
-	&.has-focus {
-		--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-		--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-		--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-		--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-		--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
- 		--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-		--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-		--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-		@include button-typography-styles;
-	}
-}
-
 /**
  * Block Options
  */

blockbase/sass/blocks/_file.scss

@@ -1,4 +1,4 @@
-@import 'button';
+@import 'button-mixins';
 
 // TODO: Remove when https://github.com/WordPress/gutenberg/issues/27760 is fixed
 .wp-block-file .wp-block-file__button {

blockbase/sass/blocks/_post-comments.scss

@@ -1,4 +1,4 @@
-@import 'button';
+@import 'button-mixins';
 
 .wp-block-post-comments {
 	.comment {

blockbase/sass/blocks/_search.scss

@@ -1,4 +1,4 @@
-@import 'button';
+@import 'button-mixins';
 
 .wp-block-search {
 

blockbase/theme.json

@@ -64,6 +64,7 @@
 				},
 				"hover": {
 					"color": {
+						"text": "var(--wp--custom--color--background)",
 						"background": "#006ba1"
 					},
 					"border": {

mayland-blocks/theme.json

@@ -72,6 +72,7 @@
 				},
 				"hover": {
 					"color": {
+						"text": "var(--wp--custom--color--background)",
 						"background": "var(--wp--custom--color--tertiary)"
 					},
 					"border": {
@@ -167,8 +168,8 @@
 			},
 			"post-content": {
 				"padding": {
-					"left": "var(--wp--custom--margin--horizontal)",
-					"right": "var(--wp--custom--margin--horizontal)"
+					"left": "20px",
+					"right": "20px"
 				}
 			},
 			"pullquote": {

quadrat/assets/theme.css

@@ -209,143 +209,6 @@ ul ul {
 	align-items: flex-end;
 }
 
-/**
- * Button
- */
-/**
- * Block Options
- */
-.wp-block-button.wp-block-button__link,
-.wp-block-button .wp-block-button__link {
-	border-width: 0;
-	padding-top: calc( var(--wp--custom--button--spacing--padding--top) + var(--wp--custom--button--border--width));
-	padding-bottom: calc( var(--wp--custom--button--spacing--padding--bottom) + var(--wp--custom--button--border--width));
-	padding-left: calc( var(--wp--custom--button--spacing--padding--left) + var(--wp--custom--button--border--width));
-	padding-right: calc( var(--wp--custom--button--spacing--padding--right) + var(--wp--custom--button--border--width));
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-radius: var(--wp--custom--button--border--radius);
-}
-
-.wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):hover, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):focus, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):hover,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):focus,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus {
-	--wp--custom--button--color--text: var(--wp--custom--button--hover--color--text);
-	--wp--custom--button--color--background: var(--wp--custom--button--hover--color--background);
-	--wp--custom--button--border--color: var(--wp--custom--button--hover--border--color);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-color: var(--wp--custom--button--border--color);
-}
-
-.wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):hover svg, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color):focus svg, .wp-block-button.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):hover svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color):focus svg,
-.wp-block-button .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.wp-block-button__link:hover, .wp-block-button.wp-block-button__link:focus, .wp-block-button.wp-block-button__link.has-focus,
-.wp-block-button .wp-block-button__link:hover,
-.wp-block-button .wp-block-button__link:focus,
-.wp-block-button .wp-block-button__link.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
-.wp-block-button.wp-block-button__link svg,
-.wp-block-button .wp-block-button__link svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link,
-.wp-block-button.is-style-outline .wp-block-button__link {
-	--wp--custom--button--color--text: var(--wp--custom--button--border--color);
-	--wp--custom--button--color--background: transparent;
-	border-style: var(--wp--custom--button--border--style);
-	border-width: var(--wp--custom--button--border--width);
-	padding-top: var(--wp--custom--button--spacing--padding--top);
-	padding-bottom: var(--wp--custom--button--spacing--padding--bottom);
-	padding-left: var(--wp--custom--button--spacing--padding--left);
-	padding-right: var(--wp--custom--button--spacing--padding--right);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):hover, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):focus, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):hover,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):focus,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus {
-	--wp--custom--button--color--text: var(--wp--custom--button--hover--color--text);
-	--wp--custom--button--color--background: var(--wp--custom--button--hover--color--background);
-	--wp--custom--button--border--color: var(--wp--custom--button--hover--border--color);
-	opacity: 1;
-	color: var(--wp--custom--button--color--text);
-	background-color: var(--wp--custom--button--color--background);
-	border-color: currentColor;
-	border-color: var(--wp--custom--button--border--color);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):hover svg, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color):focus svg, .wp-block-button.is-style-outline.wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):hover svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color):focus svg,
-.wp-block-button.is-style-outline .wp-block-button__link:not(.has-background):not(.has-text-color).has-focus svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link:hover, .wp-block-button.is-style-outline.wp-block-button__link:focus, .wp-block-button.is-style-outline.wp-block-button__link.has-focus,
-.wp-block-button.is-style-outline .wp-block-button__link:hover,
-.wp-block-button.is-style-outline .wp-block-button__link:focus,
-.wp-block-button.is-style-outline .wp-block-button__link.has-focus {
-	--wp--custom--button--border--radius: var(--wp--custom--button--hover--border--radius);
-	--wp--custom--button--spacing--padding--top: var(--wp--custom--button--hover--spacing--padding--top);
-	--wp--custom--button--spacing--padding--bottom: var(--wp--custom--button--hover--spacing--padding--bottom);
-	--wp--custom--button--spacing--padding--left: var(--wp--custom--button--hover--spacing--padding--left);
-	--wp--custom--button--spacing--padding--right: var(--wp--custom--button--hover--spacing--padding--right);
-	--wp--custom--button--typography--font-weight: var(--wp--custom--button--hover--typography--font-weight)
-		--wp--custom--button--typography--font-family: var(--wp--custom--button--hover--typography--font-family);
-	--wp--custom--button--typography--font-size: var(--wp--custom--button--hover--typography--font-size);
-	--wp--custom--button--typography--line-height: var(--wp--custom--button--hover--typography--line-height);
-	font-weight: var(--wp--custom--button--typography--font-weight);
-	font-family: var(--wp--custom--button--typography--font-family);
-	font-size: var(--wp--custom--button--typography--font-size);
-	line-height: var(--wp--custom--button--typography--line-height);
-	text-decoration: none;
-}
-
-.wp-block-button.is-style-outline.wp-block-button__link svg,
-.wp-block-button.is-style-outline .wp-block-button__link svg {
-	fill: var(--wp--custom--button--color--text);
-}
-
-.wp-block-buttons .wp-block-button:last-child {
-	margin-bottom: 0;
-}
-
 .wp-block-post-comments {
 	font-size: var(--wp--preset--font-size--normal);
 	line-height: var(--wp--custom--line-height--body);
@@ -530,19 +393,11 @@ ul ul {
 	border-top: 1px solid var(--wp--custom--color--primary);
 }
 
-.wp-block-query-pagination .wp-block-query-pagination-previous {
-	justify-self: start;
-}
-
 .wp-block-query-pagination .wp-block-query-pagination-previous::before {
 	content: "←";
 	margin-right: 0.5em;
 }
 
-.wp-block-query-pagination .wp-block-query-pagination-next {
-	justify-self: end;
-}
-
 .wp-block-query-pagination .wp-block-query-pagination-next::after {
 	content: "→";
 	margin-left: 0.5em;

quadrat/sass/blocks/_post-comments.scss

@@ -1,4 +1,4 @@
-@import "../../../blockbase/sass/blocks/button";
+@import "../../../blockbase/sass/blocks/button-mixins";
 
 .wp-block-post-comments {
 

quadrat/theme.json

@@ -8,10 +8,6 @@
 		{
 			"name": "footer",
 			"area": "footer"
-		},
-		{
-			"name": "navigation",
-			"area": "navigation"
 		}
 	],
 	"settings": {
@@ -68,8 +64,8 @@
 				},
 				"hover": {
 					"color": {
-						"background": "var(--wp--custom--color--background)",
-						"text": "var(--wp--custom--color--foreground)"
+						"text": "var(--wp--custom--color--foreground)",
+						"background": "var(--wp--custom--color--background)"
 					},
 					"border": {
 						"color": "var(--wp--custom--color--foreground)"

seedlet-blocks/theme.json

@@ -110,6 +110,7 @@
 				},
 				"hover": {
 					"color": {
+						"text": "var(--wp--custom--color--background)",
 						"background": "#336D58"
 					},
 					"border": {
@@ -205,8 +206,8 @@
 			},
 			"post-content": {
 				"padding": {
-					"left": "var(--wp--custom--margin--horizontal)",
-					"right": "var(--wp--custom--margin--horizontal)"
+					"left": "20px",
+					"right": "20px"
 				}
 			},
 			"pullquote": {
@@ -371,7 +372,7 @@
 			},
 			"core/navigation": {
 				"typography": {
-					"fontSize": "var(--wp--preset--font-size--small)"
+					"fontSize": "var(--wp--preset--font-size--normal)"
 				}
 			},
 			"core/navigation-link": {