Browse Source

Merge pull request #22136 from overleaf/mf-fix-spacing-checkout-page-redesign

[web] Fix spacing on checkout page redesign form

GitOrigin-RevId: eb85a37cf8ba9c2e32a78fa6585b5102b8c01bce
M Fahru 1 năm trước cách đây
mục cha
commit
6f0b839354

+ 28 - 1
services/web/frontend/stylesheets/bootstrap-5/pages/subscription.scss

@@ -245,11 +245,31 @@
 
     h1 {
       @include heading-md;
+
+      margin-bottom: var(--spacing-08);
     }
 
     .student-disclaimer {
       @include body-sm;
     }
+
+    .form-group {
+      &:not(.payment-method-toggle) {
+        margin-bottom: var(--spacing-05);
+      }
+
+      &.address-1 {
+        margin-bottom: var(--spacing-04);
+      }
+    }
+
+    .form-check {
+      margin-bottom: 0; // override bootstrap5 default margin-bottom of 0.125rem
+    }
+
+    .checkout-form-submit {
+      margin-top: var(--spacing-08);
+    }
   }
 }
 
@@ -312,7 +332,13 @@
 
 .payment-method-toggle {
   .form-check {
-    margin-bottom: var(--spacing-05);
+    &:first-of-type {
+      margin-bottom: var(--spacing-05);
+    }
+
+    label {
+      margin-bottom: 0; // override .website-redesign default
+    }
   }
 
   .payment-method-logos {
@@ -327,6 +353,7 @@
 
 .address2-button {
   text-decoration: none;
+  margin-bottom: var(--spacing-05);
   padding: 0;
 
   :hover {