update: payment method fees in one line in settings (#9287)

Co-authored-by: Brett Shumaker <[email protected]>
Automattic · Aug 21, 2024 · 83b00db · 83b00db
1 parent 9b1bb2f
commit 83b00db
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 10 deletions.
diff --git a/changelog/refactor-payment-method-fees-oneline b/changelog/refactor-payment-method-fees-oneline
@@ -0,0 +1,4 @@
+Significance: patch
+Type: update
+
+update: payment method fees in one line
diff --git a/client/settings/payment-methods-list/payment-method.scss b/client/settings/payment-methods-list/payment-method.scss
@@ -27,17 +27,16 @@
 		flex: 1 1 100%;
 		order: 1;
 		display: flex;
-		flex-wrap: nowrap;
 		justify-content: space-between;
+		flex-direction: column;
 
 		@include breakpoint( '>660px' ) {
+			flex-wrap: nowrap;
+			flex-direction: row;
+			align-items: center;
 			flex: 1 1 auto;
 			order: 3;
 		}
-
-		@include breakpoint( '<660px' ) {
-			flex-wrap: wrap;
-		}
 	}
 
 	&__checkbox {
@@ -158,13 +157,12 @@
 
 	&__fees {
 		display: flex;
-		align-items: center;
-		justify-content: flex-end;
 		white-space: nowrap;
-		margin-left: 16px;
 
-		@include breakpoint( '<660px' ) {
-			margin-left: 0;
+		@include breakpoint( '>660px' ) {
+			justify-content: flex-end;
+			margin-left: 16px;
+			flex-shrink: 0;
 		}
 	}