Update image format from "wep" to "webp" in multiple components

beljp · Apr 21, 2024 · e6911b7 · e6911b7
1 parent 6331728
commit e6911b7
Show file tree

Hide file tree

Showing 7 changed files with 8 additions and 8 deletions.
diff --git a/woonuxt_base/components/CategoryCard.vue b/woonuxt_base/components/CategoryCard.vue
@@ -17,7 +17,7 @@ const props = defineProps(['node']);
       :alt="node.image?.altText || node.name"
       :title="node.image?.title || node.name"
       loading="lazy"
-      format="wep"
+      format="webp"
       fit="outside" />
     <div class="absolute inset-x-0 bottom-0 opacity-50 bg-gradient-to-t from-black to-transparent h-1/2" />
     <span class="relative z-10 mt-auto mb-2 text-sm font-semibold text-white capitalize md:text-base md:mb-4" v-html="node.name" />

diff --git a/woonuxt_base/components/cartElements/CartCard.vue b/woonuxt_base/components/cartElements/CartCard.vue
@@ -48,7 +48,7 @@ const salePercentage = computed(() => {
           class="w-16 h-16 rounded-md skeleton"
           :alt="productType.image?.altText || productType.name"
           :title="productType.image?.title || productType.name"
-          format="wep"
+          format="webp"
           loading="lazy" />
       </NuxtLink>
       <div class="flex-1">

diff --git a/woonuxt_base/components/generalElements/HeroBanner.vue b/woonuxt_base/components/generalElements/HeroBanner.vue
@@ -9,7 +9,7 @@
       loading="eager"
       fit="outside"
       sizes="sm:100vw lg:1400px"
-      format="wep"
+      format="webp"
       fetchpriority="high"
       preload />
     <div class="container absolute inset-0 flex flex-col items-start justify-center bg-gradient-to-l from-gray-200 md:bg-none p-8">

diff --git a/woonuxt_base/components/productElements/ProductCard.vue b/woonuxt_base/components/productElements/ProductCard.vue
@@ -51,7 +51,7 @@ const colorVariableImage = computed(() => {
         :loading="index <= 3 ? 'eager' : 'lazy'"
         fit="outside"
         class="skeleton"
-        format="wep" />
+        format="webp" />
       <img
         v-if="colorVariableImage"
         :src="colorVariableImage.producCardSourceUrl"

diff --git a/woonuxt_base/components/productElements/ProductImageGallery.vue b/woonuxt_base/components/productElements/ProductImageGallery.vue
@@ -48,7 +48,7 @@ watch(
       :title="imageToShow.title || node.name"
       :src="imageToShow.sourceUrl || '/images/placeholder.jpg'"
       fetchpriority="high"
-      format="wep" />
+      format="webp" />
     <div v-if="gallery.nodes.length" class="my-4 gallery-images">
       <NuxtImg
         v-for="galleryImg in galleryImages"
@@ -62,7 +62,7 @@ watch(
         :title="galleryImg.title || node.name"
         @click.native="changeImage(galleryImg)"
         loading="lazy"
-        format="wep" />
+        format="webp" />
     </div>
   </div>
 </template>

diff --git a/woonuxt_base/package.json b/woonuxt_base/package.json
@@ -1,6 +1,6 @@
 {
   "name": "woonuxt",
-  "version": "3.5.2",
+  "version": "3.5.3",
   "main": "./nuxt.config.ts",
   "type": "module"
 }
diff --git a/woonuxt_base/pages/product/[slug].vue b/woonuxt_base/pages/product/[slug].vue
@@ -83,7 +83,7 @@ const disabledAddToCart = computed(() => {
         :gallery="product.galleryImages!"
         :node="type"
         :activeVariation="activeVariation || {}" />
-      <NuxtImg v-else class="relative flex-1 skeleton" format="wep" src="/images/placeholder.jpg" :alt="product?.name || 'Product'" />
+      <NuxtImg v-else class="relative flex-1 skeleton" format="webp" src="/images/placeholder.jpg" :alt="product?.name || 'Product'" />
 
       <div class="lg:max-w-md xl:max-w-lg md:py-2 w-full">
         <div class="flex justify-between mb-4">