Fix checkbox styling in 2020 and 2017 themes by setting input font size

woocommerce · Apr 7, 2021 · b75fc4d · b75fc4d
1 parent b14eaa1
commit b75fc4d
Showing 1 changed file with 8 additions and 1 deletion.
diff --git a/assets/js/base/components/checkbox-control/style.scss b/assets/js/base/components/checkbox-control/style.scss
@@ -6,6 +6,7 @@
 	position: relative;
 
 	.wc-block-components-checkbox__input[type="checkbox"] {
+		font-size: 1em;
 		appearance: none;
 		border: 2px solid $input-border-gray;
 		border-radius: 2px;
@@ -24,6 +25,11 @@
 			border-color: $input-border-gray;
 		}
 
+		&::before,
+		&::after {
+			content: "";
+		}
+
 		&:not(:checked) + .wc-block-components-checkbox__mark {
 			display: none;
 		}
@@ -75,7 +81,8 @@
 	}
 
 	.wc-block-components-checkbox__input[type="checkbox"]:checked,
-	.has-dark-controls .wc-block-components-checkbox__input[type="checkbox"]:checked {
+	.has-dark-controls
+	.wc-block-components-checkbox__input[type="checkbox"]:checked {
 		background-color: #fff;
 		border-color: var(--form--border-color);
 	}