fix(default-theme): fixed some margins on shipping path (#1104)

packages/default-theme/components/SwAddress.vue

@@ -55,18 +55,22 @@ export default {
 
 <style lang="scss" scoped>
 .sw-address {
+  align-items: flex-start;
   display: flex;
   justify-content: space-between;
-  align-items: flex-start;
+  margin: var(--spacer-sm);
+
   &__title {
     font-size: var(--font-sm);
     margin-bottom: var(--spacer-sm);
     color: var(--c-text);
   }
+
   &__content {
     font-size: var(--font-xs);
   }
 }
+
 .content {
   margin: 0;
   color: var(--c-text-muted);

packages/default-theme/components/SwCheckoutMethod.vue

@@ -26,15 +26,18 @@ export default {
 
 <style lang="scss" scoped>
 .sw-generic-method {
-  margin-bottom: var(--spacer-sm);
+  align-items: flex-start;
   display: flex;
   justify-content: space-between;
-  align-items: flex-start;
+  margin-bottom: var(--spacer-sm);
+  margin: var(--spacer-sm);
+
   &__title {
     font-size: var(--font-sm);
     margin-bottom: var(--spacer-xs);
     color: var(--c-text);
   }
+
   &__content {
     font-size: var(--font-xs);
     color: var(--c-text-muted);

packages/default-theme/components/SwFooter.vue

@@ -81,6 +81,7 @@ export default {
   }
 
   &__bottom-navigation {
+    margin-bottom: var(--spacer-sm);
     width: 100%;
   }
 }

packages/default-theme/components/SwPersonalDetails.vue

@@ -36,19 +36,22 @@ export default {
 
 <style lang="scss" scoped>
 .sw-personal-details {
+  align-items: flex-start;
   display: flex;
   justify-content: space-between;
-  align-items: flex-start;
+  margin: var(--spacer-sm);
 
   &__title {
+    color: var(--c-text);
     font-size: var(--font-sm);
     margin-bottom: var(--spacer-sm);
-    color: var(--c-text);
   }
+
   &__content {
     font-size: var(--font-xs);
   }
 }
+
 .content {
   margin: 0;
   color: var(--c-text-muted);

packages/default-theme/components/checkout/steps/guest/PersonalDetailsGuestForm.vue

@@ -48,9 +48,7 @@
         data-cy="proper-email"
       />
       <div class="info">
-        <p class="info__heading">
-          Enjoy these perks with your free account!
-        </p>
+        <p class="info__heading">Enjoy these perks with your free account!</p>
         <SfCharacteristic
           v-for="(characteristic, key) in characteristics"
           :key="key"
@@ -104,13 +102,7 @@
   </div>
 </template>
 <script>
-import {
-  SfCheckbox,
-  SfHeading,
-  SfCharacteristic,
-  SfSelect,
-  SfProductOption,
-} from "@storefront-ui/vue"
+import { SfCheckbox, SfHeading, SfCharacteristic } from "@storefront-ui/vue"
 import SwPluginSlot from "sw-plugins/SwPluginSlot"
 import SwButton from "@shopware-pwa/default-theme/components/atoms/SwButton"
 import SwInput from "@shopware-pwa/default-theme/components/atoms/SwInput"
@@ -315,34 +307,6 @@ export default {
       email,
     },
   },
-  methods: {
-    async toShipping() {
-      // run the validators against the provided data
-      // consider using $touch event on $blur event in each input
-      this.validate()
-      if (this.validations.$invalid) {
-        return
-      }
-
-      if (this.createAccount) {
-        const isRegistered = await this.registerUser(this.customer)
-        if (!isRegistered) {
-          return
-        }
-        // extra login step won't be necessary once the register has a autologin option
-        await this.login({
-          username: this.email,
-          password: this.password,
-        })
-        if (!this.isLoggedIn) {
-          return
-        }
-        this.$router.push(this.$i18n.path('/checkout?step="SHIPPING"'))
-      } else {
-        return this.$emit("proceed")
-      }
-    },
-  },
 }
 </script>
 <style lang="scss" scoped>
@@ -416,4 +380,12 @@ export default {
     }
   }
 }
+
+.form__action {
+  margin: var(--spacer-sm) 0;
+
+  .sf-button + .sf-button {
+    margin-top: var(--spacer-sm);
+  }
+}
 </style>