Introduce hover-effect() mixin

woocommerce · Nov 1, 2023 · 0abd028 · 0abd028
1 parent 23794a8
commit 0abd028
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 6 deletions.
diff --git a/assets/css/abstracts/_mixins.scss b/assets/css/abstracts/_mixins.scss
@@ -171,18 +171,22 @@ $fontSizes: (
 	text-decoration: underline;
 }
 
+@mixin hover-effect() {
+	&:hover {
+		text-decoration: none;
+		color: inherit;
+		cursor: pointer;
+	}
+}
+
 // Reset <button> style so we can use link style for action buttons in filter blocks
 @mixin filter-link-button() {
 	@include link-button();
+	@include hover-effect();
 	@include font-size(small);
 	text-decoration: underline;
 	font-weight: normal;
 	color: inherit;
-
-	&:hover {
-		text-decoration: none;
-		color: inherit;
-	}
 }
 
 // Makes sure long words are broken if they overflow the container.

diff --git a/assets/js/base/components/cart-checkout/cart-line-items-table/style.scss b/assets/js/base/components/cart-checkout/cart-line-items-table/style.scss
@@ -34,7 +34,8 @@ table.wc-block-cart-items {
 		}
 		.wc-block-cart-item__quantity {
 			.wc-block-cart-item__remove-link {
-				@include link-button;
+				@include link-button();
+				@include hover-effect();
 				@include font-size( smaller );
 
 				text-transform: none;