Merge pull request #40 from lnbits/fix_multiple_images

Fix multiple images

static/components/product-card/product-card.html

@@ -1,6 +1,6 @@
 <q-card class="card--product">
   <q-img
-    :src="product.images ? product.images[0] : '/nostrmarket/static/images/placeholder.png'"
+    :src="(product.images && product.images.length > 0 && product.images[0]) ? product.images[0] : '/nostrmarket/static/images/placeholder.png'"
     alt="Product Image"
     loading="lazy"
     spinner-color="white"

static/components/product-detail/product-detail.html

@@ -1,20 +1,21 @@
 <div class="row q-mt-sm">
   <div class="col-lg-5 col-md-5 col-sm-12 col-xs-12">
-    <div class="q-pa-md">
+    <div class="q-pa-md" v-if="product.images && product.images[0]">
       <q-carousel
-        v-if="product.images"
         swipeable
         animated
         v-model="slide"
         thumbnails
         infinite
-        v-for="(img, i) in product.images"
-        :key="i"
+        arrows
+        transition-prev="slide-right"
+        transition-next="slide-left"
       >
         <q-carousel-slide
+          v-for="(img, i) in product.images"
           :name="i + 1"
+          :key="i"
           :img-src="img"
-          style="/*background-size: contain; background-repeat: no-repeat*/"
         ></q-carousel-slide>
       </q-carousel>
       <q-img