1 files changed, 55 insertions, 0 deletions
diff --git a/iridescence/src/components/checkout/CheckoutForm.vue b/iridescence/src/components/checkout/CheckoutForm.vue
new file mode 100644
index 0000000..a2ddfad
--- /dev/null
+++ b/iridescence/src/components/checkout/CheckoutForm.vue
@@ -0,0 +1,55 @@
+<template>
+  <div class="container">
+    <section class="section">
+      <h1 class="title">Customer Info</h1>
+      <hr />
+
+      <div class="field is-horizontal">
+        <div class="field-label">
+          <label class="label">Name</label>
+        </div>
+        <div class="field-body">
+          <div class="field">
+            <p class="control is-expanded ">
+              <input class="input" type="text" placeholder="given name" />
+            </p>
+          </div>
+          <div class="field">
+            <p class="control is-expanded">
+              <input class="input" type="text" placeholder="surname" />
+            </p>
+          </div>
+        </div>
+      </div>
+
+      <div class="field is-horizontal">
+        <div class="field-label">
+          <label class="label">E-mail Address</label>
+        </div>
+        <div class="field-body">
+          <div class="field">
+            <p class="control is-expanded">
+              <input class="input" type="email" placeholder="email address" />
+            </p>
+          </div>
+        </div>
+      </div>
+    </section>
+    <section class="section">
+      <h1 class="title">Payment</h1>
+      <hr />
+    </section>
+    <section class="section">
+      <h1 class="title">Delivery</h1>
+      <hr />
+    </section>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "CheckoutForm",
+  computed: {},
+  methods: {}
+};
+</script>