feat: improve list styling

impress-org · Aug 4, 2023 · 5abad50 · 5abad50
1 parent 11ab737
commit 5abad50
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 17 deletions.
diff --git a/assets/src/css/admin/paypal-commerce.scss b/assets/src/css/admin/paypal-commerce.scss
@@ -50,14 +50,15 @@
 .paypal-commerce-connection-account-type-selection-modal{
 		color: #0E0E0E;
 
-	p.welcome-text{
-		color: #404040;
-	}
+	ul{
+		margin-left: 22px;
 
-	li{
-		font-size: 0.8em;
-		color: #666;
+		li{
+			font-size: 0.8em;
+			color: #666;
+		}
 	}
+
     ul.flex2x2 {
         display: flex;
         flex-wrap: wrap;
@@ -75,6 +76,10 @@
 
 	p{
 		font-size: 16px;
+
+		&.welcome-text{
+			color: #404040;
+		}
 	}
 
     span{

diff --git a/assets/src/js/admin/paypal-commerce/index.js b/assets/src/js/admin/paypal-commerce/index.js
@@ -130,26 +130,26 @@ window.addEventListener( 'DOMContentLoaded', function() {
                                     id="paypal_donations_connection_account_type_ppcp"
                                     value="PPCP">&nbsp;${ __( 'Advancded Card Processing', 'givewp') }
                             </label>
-                            <ul>
-                                <li>${__( 'Accept Credit & Debit Cards', 'givewp')}</li>
-                                <li>${__( 'Seller Protection', 'givewp')}</li>
-                            </ul>
                         </p>
+                        <ul>
+                            <li>${__( 'Accept Credit & Debit Cards', 'givewp')}</li>
+                            <li>${__( 'Seller Protection', 'givewp')}</li>
+                        </ul>
                         <p>
                             <label for="paypal_donations_connection_account_type_express_checkout">
                                 <input type="radio"
                                     name="paypal_donations_connection_account_type"
                                     id="paypal_donations_connection_account_type_express_checkout"
                                     value="EXPRESS_CHECKOUT">&nbsp;${__( 'Standard Card Processing', 'give')}
-                                <span>${__( 'Requires Application Approval', 'give')}</span>
                             </label>
-                            <ul class="flex2x2">
-                                <li>${__( 'Accept Credit & Debit Cards', 'give')}</li>
-                                <li>${__( 'Seller Protection', 'give')}</li>
-                                <li>${__( 'Fraud Protection', 'give')}</li>
-                                <li>${__( 'Chargeback Protection', 'give')}</li>
-                            </ul>
+                            <span>${__( 'Requires Application Approval', 'give')}</span>
                         </p>
+                         <ul class="flex2x2">
+                            <li>${__( 'Accept Credit & Debit Cards', 'give')}</li>
+                            <li>${__( 'Seller Protection', 'give')}</li>
+                            <li>${__( 'Fraud Protection', 'give')}</li>
+                            <li>${__( 'Chargeback Protection', 'give')}</li>
+                        </ul>
                         <div class="give-field-description">
                             <a href="https://docs.givewp.com/connection-comparison" target="_blank">
                                 ${__('Read more about the connection types', 'give')}