diff options
-rw-r--r-- | iridescence/src/components/cart/CartItem.vue | 106 | ||||
-rw-r--r-- | iridescence/src/components/cart/Totals.vue | 2 | ||||
-rw-r--r-- | iridescence/src/components/checkout/CheckoutForm.vue | 2 | ||||
-rw-r--r-- | iridescence/src/views/Cart.vue | 6 |
4 files changed, 53 insertions, 63 deletions
diff --git a/iridescence/src/components/cart/CartItem.vue b/iridescence/src/components/cart/CartItem.vue index 0d26f4e..20ddec8 100644 --- a/iridescence/src/components/cart/CartItem.vue +++ b/iridescence/src/components/cart/CartItem.vue @@ -1,69 +1,59 @@ <template> <div> <hr /> - <article class="media" id="cartItem"> - <figure class="media-left"> - <p class="image is-64x64"> - <img :src="thumbnail" :title="product.name" /> - </p> - </figure> - <div class="media-content"> - <nav class="level"> - <div class="level-left"> - <div class="level-item"> - <div class="content"> - <strong> - <p> - {{ product.name }} - </p> - </strong> - </div> - </div> + <nav class="level"> + <div class="level-left"> + <div class="level-item"> + <p class="image is-64x64"> + <img :src="thumbnail" :title="product.name" /> + </p> + </div> + <div class="level-item"> + <div class="content"> + <strong> + <p> + {{ product.name }} + </p> + </strong> </div> - <div class="level-right"> - <div class="level-item">Subtotal: {{ dollars }}</div> - <div class="level-item"> - <div class="field has-addons"> - <p class="control is-expanded"> - <a class="button is-static is-fullwidth is-rounded"> - {{ inCart }} in cart - </a> - </p> - <div class="control"> - <a - @click="incrementCartQuantity(-1)" - class="button is-info is-rounded" - > - <span - class="iconify-inline" - data-icon="mdi-cart-minus" - ></span> - </a> - </div> - <div class="control"> - <a - @click="incrementCartQuantity(1)" - class="button is-info is-rounded" - > - <span - class="iconify-inline" - data-icon="mdi-cart-plus" - ></span> - </a> - </div> - </div> + </div> + </div> + <div class="level-right"> + <div class="level-item">Subtotal: {{ dollars }}</div> + <div class="level-item"> + <div class="field has-addons"> + <p class="control is-expanded"> + <a class="button is-static is-fullwidth is-rounded"> + {{ inCart }} in cart + </a> + </p> + <div class="control"> + <a + @click="incrementCartQuantity(-1)" + class="button is-info is-rounded" + > + <span class="iconify-inline" data-icon="mdi-cart-minus"></span> + </a> </div> - - <div class="level-item"> - <button class="button is-danger is-rounded" @click="removeAll"> - <span class="iconify-inline" data-icon="mdi-cart-remove"></span> - <span>Remove All</span> - </button> + <div class="control"> + <a + @click="incrementCartQuantity(1)" + class="button is-info is-rounded" + > + <span class="iconify-inline" data-icon="mdi-cart-plus"></span> + </a> </div> </div> - </nav> + </div> + + <div class="level-item"> + <button class="button is-danger is-rounded" @click="removeAll"> + <span class="iconify-inline" data-icon="mdi-cart-remove"></span> + <span>Remove</span> + </button> + </div> </div> - </article> + </nav> </div> </template> diff --git a/iridescence/src/components/cart/Totals.vue b/iridescence/src/components/cart/Totals.vue index 5c211ae..36c9e77 100644 --- a/iridescence/src/components/cart/Totals.vue +++ b/iridescence/src/components/cart/Totals.vue @@ -10,7 +10,7 @@ to="/checkout" class="button is-success is-fullwidth is-rounded is-medium" > - Checkout Now + Continue to Checkout </router-link> </div> </template> diff --git a/iridescence/src/components/checkout/CheckoutForm.vue b/iridescence/src/components/checkout/CheckoutForm.vue index d64d747..cf73149 100644 --- a/iridescence/src/components/checkout/CheckoutForm.vue +++ b/iridescence/src/components/checkout/CheckoutForm.vue @@ -82,7 +82,7 @@ <div class="control has-icons-left"> <div class="select is-rounded"> <select required> - <option selected>United States</option> + <option selected>USA</option> </select> </div> <span class="icon is-left"> diff --git a/iridescence/src/views/Cart.vue b/iridescence/src/views/Cart.vue index 8fa8752..26949f5 100644 --- a/iridescence/src/views/Cart.vue +++ b/iridescence/src/views/Cart.vue @@ -3,6 +3,9 @@ <div class="container"> <div v-if="items.length" class="section"> <div class="columns"> + <div class="column is-one-third"> + <Totals></Totals> + </div> <div class="column"> <h1 class="subtitle">Your Shopping Cart</h1> <CartItem @@ -12,9 +15,6 @@ v-bind:in-cart="item[1]" ></CartItem> </div> - <div class="column is-one-third"> - <Totals></Totals> - </div> </div> </div> <div v-else class="section"> |