💄 Style the new LearnMore links

woocommerce · Jan 29, 2025 · dda23b3 · dda23b3
1 parent 77badd3
commit dda23b3
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 22 deletions.
diff --git a/modules/ppcp-settings/resources/css/components/reusable-components/_badge-box.scss b/modules/ppcp-settings/resources/css/components/reusable-components/_badge-box.scss
@@ -28,6 +28,12 @@
 		width: fit-content;
 	}
 
+	.components-button.is-tertiary {
+		padding: 0;
+		margin: 0 0 0 4px;
+		height: 1em;
+	}
+
 	@media screen and (max-width: 480px) {
 		display: flex;
 		justify-content: center;

diff --git a/modules/ppcp-settings/resources/css/components/screens/onboarding/_step-payment-methods.scss b/modules/ppcp-settings/resources/css/components/screens/onboarding/_step-payment-methods.scss
@@ -6,33 +6,31 @@
 	}
 }
 
-.ppcp-r-optional-payment-methods {
-	&__wrapper {
-		.ppcp-r-badge-box {
-			margin: 0 0 24px 0;
-			&:last-child {
-				margin: 0;
-			}
-		}
+.ppcp-r-optional-payment-methods__wrapper {
+	.ppcp-r-badge-box {
+		margin: 0 0 24px 0;
 
-		.ppcp-r-badge-box__description {
-			margin: 12px 0 0 0;
-			@include font(14, 20, 400);
+		&:last-child {
+			margin: 0;
 		}
 	}
 
-	&__description {
-		margin: 32px 0 0 0;
-		text-align: center;
-		@include font(14, 22, 400);
-		font-style: italic;
-
-		a {
-			color: $color-gray-700;
-		}
+	.ppcp-r-badge-box__description {
+		margin: 12px 0 0 0;
 	}
+}
 
-	&__separator {
-		margin: 0 0 24px 0;
+.ppcp-r-optional-payment-methods__description {
+	@include font(14, 22, 400);
+	margin: 32px 0 0 0;
+	text-align: center;
+	font-style: italic;
+
+	a {
+		color: $color-gray-700;
 	}
 }
+
+.ppcp-r-optional-payment-methods__separator {
+	margin: 0 0 24px 0;
+}