From c8c6c6ad1515fc66de9b737ed5660b7f4aedf394 Mon Sep 17 00:00:00 2001
From: Zenit Shkreli <69572953+zenit2001@users.noreply.github.com>
Date: Wed, 29 Nov 2023 15:42:30 +0100
Subject: [PATCH] Improved ui of the installment configurator to align config
 page (#1015)

---
 .../default/css/configurationSettings.css     | 12 +++++--
 .../settingCards/cardSettings.isml            | 32 ++++++++-----------
 2 files changed, 23 insertions(+), 21 deletions(-)

diff --git a/src/cartridges/bm_adyen/cartridge/static/default/css/configurationSettings.css b/src/cartridges/bm_adyen/cartridge/static/default/css/configurationSettings.css
index 155d217cd..1aa230d40 100644
--- a/src/cartridges/bm_adyen/cartridge/static/default/css/configurationSettings.css
+++ b/src/cartridges/bm_adyen/cartridge/static/default/css/configurationSettings.css
@@ -498,12 +498,18 @@ ul{
 
 #addRuleButton{
     position: absolute;
-    bottom: 15px;
-    left: 60px;
+    bottom: 35px;
+    left:70px;
 }
 
 #removeRuleButton {
     border: none;
     background-color: transparent;
     outline: none;
-}
\ No newline at end of file
+}
+
+#adyen_installments_div{
+    font-family: 'Fakt';
+    font-style: normal;
+    font-size: 14px;
+}
diff --git a/src/cartridges/bm_adyen/cartridge/templates/default/adyenSettings/settingCards/cardSettings.isml b/src/cartridges/bm_adyen/cartridge/templates/default/adyenSettings/settingCards/cardSettings.isml
index 4f47e2e97..03c501ec8 100644
--- a/src/cartridges/bm_adyen/cartridge/templates/default/adyenSettings/settingCards/cardSettings.isml
+++ b/src/cartridges/bm_adyen/cartridge/templates/default/adyenSettings/settingCards/cardSettings.isml
@@ -27,30 +27,26 @@
             </div>
          </div>
          <div class="form-group">
-            <div class="row">
-               <div class="form-group">
-                  <label class="form-title mb-0" for="installments">Enable Credit card installments <small class="text-secondary">(optional)</small></label>
-                  <small id="installmentsHelp" class="form-text mb-1">
-                     If you’re offering an installments option to your shoppers, please configure them below.
-                  </small>
-                  <div class="input-fields">
-                     <input type="hidden" class="form-control" name="AdyenCreditCardInstallments" id="installments" aria-describedby="installmentsHelp" value="${AdyenConfigs.getCreditCardInstallments() || ''}">    
-                  </div>
-                  <div class="adyen-installments-settings collapse ${AdyenConfigs.getAdyenInstallmentsEnabled() ? 'show': ''}">
-                     <div class="input-fields" id="adyen_installments_div">
-                           <div class="d-grid gap-2 d-md-flex justify-content-md-end form-buttons">
-                              <button type="button" id="addRuleButton" class="btn btn-primary border formButton">Add Rule</button>
-                           </div>
-                     </div>
-                  </div>
-               </div>
+            <div class='row'>
                <div class="switch-button">
                   <div class="form-check form-switch">
                      <input class="form-check-input" type="checkbox" name="AdyenInstallments_enabled" id="flexSwitchCheckChecked" data-bs-toggle="collapse" data-bs-target=".adyen-installments-settings" ${AdyenConfigs.getAdyenInstallmentsEnabled() ? 'checked': 'unchecked'}>
                   </div>
                </div>
             </div>
-         </div>   
+            <label class="form-title mb-0" for="installments">Enable credit card installments <small class="text-secondary">(optional)</small></label>
+            <small class="form-text mb-1" id="installmentsHelp">If you’re offering an installments option to your shoppers, please configure them below.</small>
+         </div>
+         <div class="input-fields">
+            <input type="hidden" class="form-control" name="AdyenCreditCardInstallments" id="installments" value="${AdyenConfigs.getCreditCardInstallments() || ''}">    
+         </div>
+         <div class="adyen-installments-settings collapse ${AdyenConfigs.getAdyenInstallmentsEnabled() ? 'show': ''}">
+            <div class="input-fields" id="adyen_installments_div">
+               <div class="d-grid gap-2 d-md-flex justify-content-md-end form-buttons">
+                  <button type="button" id="addRuleButton" class="btn btn-primary border formButton">Add Rule</button>
+               </div>
+            </div>
+         </div>
       </div>
    </div>
 </div>