Explorar o código

remove padding include from button styles

MaggieCabrera %!s(int64=3) %!d(string=hai) anos
pai
achega
67504b5229

+ 6 - 10
blockbase/assets/ponyfill.css

@@ -357,10 +357,6 @@ input[type=checkbox] + label {
 .wp-block-button .wp-block-button__link, .wp-block-button__link.wp-block-button__link,
 .wp-block-button__link .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));
   text-decoration: none;
   font-weight: var(--wp--custom--button--typography--font-weight);
 }
@@ -377,7 +373,7 @@ input[type=checkbox] + label {
   opacity: 1;
   color: var(--wp--custom--button--color--text);
   background-color: var(--wp--custom--button--color--background);
-  border-color: currentColor;
+  border-color: currentcolor;
   border-color: currentcolor;
   border-color: var(--wp--custom--button--border--color);
 }
@@ -404,7 +400,7 @@ input[type=checkbox] + label {
   opacity: 1;
   color: var(--wp--custom--button--color--text);
   background-color: var(--wp--custom--button--color--background);
-  border-color: currentColor;
+  border-color: currentcolor;
   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,
@@ -420,7 +416,7 @@ input[type=checkbox] + label {
   opacity: 1;
   color: var(--wp--custom--button--color--text);
   background-color: var(--wp--custom--button--color--background);
-  border-color: currentColor;
+  border-color: currentcolor;
   border-color: currentcolor;
   border-color: var(--wp--custom--button--border--color);
 }
@@ -749,7 +745,7 @@ div.wp-block-query-pagination .wp-block-query-pagination-numbers .current {
   opacity: 1;
   color: var(--wp--custom--button--color--text);
   background-color: var(--wp--custom--button--color--background);
-  border-color: currentColor;
+  border-color: currentcolor;
   border-color: currentcolor;
   border-color: var(--wp--custom--button--border--color);
 }
@@ -768,7 +764,7 @@ div.wp-block-query-pagination .wp-block-query-pagination-numbers .current {
   opacity: 0.66;
 }
 .wp-block-search.is-style-small-search {
-  --wp--custom--button--typography--font-size: calc( 0.8 * var(--wp--preset--font-size--small));
+  --wp--custom--button--typography--font-size: calc(0.8 * var(--wp--preset--font-size--small));
 }
 .wp-block-search.is-style-small-search .wp-block-search__input {
   padding: calc(0.5 * var(--wp--custom--form--padding));
@@ -802,7 +798,7 @@ p.wp-block-site-tagline {
   opacity: 1;
   color: var(--wp--custom--button--color--text);
   background-color: var(--wp--custom--button--color--background);
-  border-color: currentColor;
+  border-color: currentcolor;
   border-color: currentcolor;
   border-color: var(--wp--custom--button--border--color);
 }

+ 1 - 1
blockbase/sass/blocks/_button-mixins.scss

@@ -1,5 +1,6 @@
 // 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.
 // See https://github.com/WordPress/gutenberg/issues/29167
+//We are keeping the mixin in case it's used by any child themes, but this isn't used by Blockbase any more
 @mixin button-main-styles {
 
 	@include button-padding-styles;
@@ -30,7 +31,6 @@
 	padding-right: calc(var(--wp--custom--button--spacing--padding--right) + var(--wp--custom--button--border--width));
 }
 
-//We are keeping the mixin in case it's used by any child themes, but this isn't used by Blockbase any more
 @mixin button-typography-styles {
 	font-weight: var(--wp--custom--button--typography--font-weight);
 	font-family: inherit;

+ 43 - 2
blockbase/sass/blocks/_button.scss

@@ -1,3 +1,44 @@
-.wp-block-button:not(.is-style-outline) > a.has-background {
-	border-style: none;
+@import "button-mixins";
+
+/**
+ * Button
+ */
+
+/**
+ * Block Options
+ */
+.wp-block-button,
+.wp-block-button__link {
+
+	&.wp-block-button__link,
+	.wp-block-button__link {
+
+		@include button-hover-styles;
+		border-width: 0;
+		text-decoration: none;
+		font-weight: var(--wp--custom--button--typography--font-weight);
+	}
+
+	&.is-style-outline {
+
+		&.wp-block-button__link,
+		.wp-block-button__link {
+			--wp--custom--button--color--text: var(--wp--custom--button--border--color);
+			--wp--custom--button--color--background: transparent;
+
+			@include button-border-styles;
+			@include button-hover-styles;
+			@include button-color-styles;
+		}
+	}
+}
+
+// TODO: I'm not sure what the end goal should be here, but since we are unable to use
+// a button block OUTSIDE of the context of the button collection block (grrrrrrrrr)
+// then there are undesired margins to be dealt with somehow.
+.wp-block-buttons {
+
+	.wp-block-button:last-child {
+		margin-bottom: 0;
+	}
 }