diff options
| author | Adam T. Carpenter <atc@53hor.net> | 2020-12-10 08:26:38 -0500 |
|---|---|---|
| committer | Adam T. Carpenter <atc@53hor.net> | 2020-12-10 08:26:38 -0500 |
| commit | b34e03909d0c1c459414568028012d1a02ae23e4 (patch) | |
| tree | ea58c939a0944d2ea139561fbc1bdbedf9a4e37a | |
| parent | da43cd8d3be0e2d53d27d7cc924eb445a482abf3 (diff) | |
| download | theglassyladies-b34e03909d0c1c459414568028012d1a02ae23e4.tar.xz theglassyladies-b34e03909d0c1c459414568028012d1a02ae23e4.zip | |
started checkout form
| -rw-r--r-- | iridescence/src/components/checkout/CheckoutForm.vue | 55 | ||||
| -rw-r--r-- | iridescence/src/views/Checkout.vue | 13 |
2 files changed, 66 insertions, 2 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> diff --git a/iridescence/src/views/Checkout.vue b/iridescence/src/views/Checkout.vue index ab28517..3b66fbf 100644 --- a/iridescence/src/views/Checkout.vue +++ b/iridescence/src/views/Checkout.vue @@ -1,12 +1,21 @@ <template> <div id="checkout"> - checkout + <ul> + <li>get user info (name, address, email, phone)</li> + <li>payment option (mailed check, paypal, cash or check on delivery)</li> + <li> + pickup option (pick up at studio, pick up at simply vintage, ship to + address) + </li> + </ul> + <CheckoutForm></CheckoutForm> </div> </template> <script> +import CheckoutForm from "@/components/checkout/CheckoutForm.vue"; export default { name: "Checkout", - components: {} + components: { CheckoutForm } }; </script> |