tphilippot/shopify-storefront
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

blog added

Browse Source
This commit is contained in:
thomas
2020-02-28 23:34:43 +01:00
parent 8ef2c5ff30
commit a1f2a5bf02
16 changed files with 295 additions and 250 deletions
Download Patch File Download Diff File Expand all files Collapse all files
components/ProductCardList.vue
+32 -36
View File
@@ -1,42 +1,36 @@
<template>
<div class="columns">
<div v-for="product in products" :key="product.id" class="column is-one-third">
<div class="card">
<div class="card-image">
<figure class="image is-4by3">
<img :src="product.images[0].src" :alt="product.images[0].altText">
</figure>
</div>
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-4">
{{ product.title }}
</p>
<p class="subtitle is-6">
{{ product.variants[0].price }} €
</p>
<div class="columns is-multiline">
<div v-for="product in products" :key="product.id" class="column is-half-tablet is-one-third-widescreen">
<nuxt-link :to="`/products/${product.handle}`">
<div class="card">
<div class="card-image">
<figure class="image is-4by3">
<img :src="product.images[0].src" :alt="product.images[0].altText">
</figure>
</div>
<div class="card-content">
<div class="media">
<div class="media-content">
<p class="title is-4">
{{ product.title }}
</p>
<p class="subtitle is-6">
{{ product.variants[0].price }} €
</p>
</div>
</div>
<div class="content">
<b-button
type="is-primary"
icon-left="cart"
@click="addToCart(product.variants[0].id, 1)"
>
Buy
</b-button>
</div>
</div>
<div class="content">
<b-button
tag="router-link"
:to="'/products/' + product.handle"
type="is-primary"
>
See
</b-button>
<b-button
type="is-primary"
icon-left="cart"
@click="addToCart(product.variants[0].id, 1)"
>
Buy
</b-button>
</div>
</div>
</div>
</nuxt-link>
</div>
</div>
</template>
@@ -57,5 +51,7 @@ export default {
</script>
<style scoped>
.card-image {
height: 22rem;
}
</style>