Collection fetching and scss colors personalisation

pages/products/_handle/index.vue

@@ -38,9 +38,10 @@
             </div>
             <div class="columns">
               <div class="column">
-                <p class="subtitle">
-                  {{ product.description }}
-                </p>
+                <p
+                  class="subtitle"
+                  v-html="product.descriptionHtml"
+                />
               </div>
             </div>
             <div class="columns">

pages/products/index.vue

@@ -1,51 +1,20 @@
 <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>
-          </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>
-    </div>
+  <div>
+    <product-card-list
+      :products="products"
+    />
   </div>
 </template>
 
 <script>
 import cartMixins from '../../mixins/cartMixins'
+import ProductCardList from '../../components/productCardList'
 
 export default {
   name: 'Index',
+  components: {
+    ProductCardList
+  },
   mixins: [
     cartMixins
   ],