Set images to public for home page

nuxt-frontend/components/home-new/LandingSection.vue

@@ -2,19 +2,19 @@
   <div
     class="relative bg-gradient-to-t from-pink-5 to-white landing-bg-mobile-clip-path md:landing-bg-clip-path overflow-hidden px-0 pb-[3.125rem] md:pb-[6.25rem] 3xl:outer-container"
   >
-    <!-- <img
+    <img
       :src="background400"
       :srcset="`${background400} 400w, ${background800} 800w, ${background1200} 1200w, ${background2100} 2100w`"
       class="absolute top-0 left-0 w-full h-full -z-[1] object-contain"
       alt="canopas-landing"
       loading="eager"
-    /> -->
-    <NuxtImg
+    />
+    <!-- <NuxtImg
       preload
       src="/landing/bg/background-2100w.webp"
       class="absolute top-0 left-0 w-full h-full -z-[1] object-contain"
       alt="canopas-landing"
-    />
+    /> -->
     <div
       class="relative container flex flex-col items-center lg:flex-row-reverse lg:items-start pb-[1.563rem] lg:pb-[3.125rem]"
     >
@@ -141,26 +141,26 @@
   </div>
 </template>
 <script>
-import landing400 from "@/assets/images/landing/landing-400w.webp";
-import landing800 from "@/assets/images/landing/landing-800w.webp";
+// import landing400 from "@/assets/images/landing/landing-400w.webp";
+// import landing800 from "@/assets/images/landing/landing-800w.webp";
 import client1 from "@/assets/images/landing/client1-100w.webp";
 import client2 from "@/assets/images/landing/client2-100w.webp";
 import client3 from "@/assets/images/landing/client3-100w.webp";
 import client4 from "@/assets/images/landing/client4-100w.webp";
-import background400 from "@/assets/images/landing/bg/background-400w.webp";
-import background800 from "@/assets/images/landing/bg/background-800w.webp";
-import background1200 from "@/assets/images/landing/bg/background-1200w.webp";
-import background2100 from "@/assets/images/landing/bg/background-2100w.webp";
+// import background400 from "@/assets/images/landing/bg/background-400w.webp";
+// import background800 from "@/assets/images/landing/bg/background-800w.webp";
+// import background1200 from "@/assets/images/landing/bg/background-1200w.webp";
+// import background2100 from "@/assets/images/landing/bg/background-2100w.webp";
 import AspectRatio from "../utils/AspectRatio.vue";
 export default {
   data() {
     return {
-      landing400,
-      landing800,
-      background400,
-      background800,
-      background1200,
-      background2100,
+      landing400: "/images/landing/landing-400w.webp",
+      landing800: "/images/landing/landing-800w.webp",
+      background400: "/images/landing/bg/background-400w.webp",
+      background800: "/images/landing/bg/background-800w.webp",
+      background1200: "/images/landing/bg/background-1200w.webp",
+      background2100: "/images/landing/bg/background-2100w.webp",
       clients: [
         {
           className: "z-0",

nuxt-frontend/components/home-new/PortfolioSection.vue

@@ -88,29 +88,29 @@
 </template>
 
 <script type="module">
-import justly_1_400w from "@/assets/images/portfolio/new-portfolio/justly-1-400w.webp";
-import justly_1_800w from "@/assets/images/portfolio/new-portfolio/justly-1-800w.webp";
+// import justly_1_400w from "@/assets/images/portfolio/new-portfolio/justly-1-400w.webp";
+// import justly_1_800w from "@/assets/images/portfolio/new-portfolio/justly-1-800w.webp";
 
-import tognessMp4 from "@/assets/images/portfolio/new-portfolio/togness.mp4";
-import tognessWebm from "@/assets/images/portfolio/new-portfolio/togness.webm";
+// import tognessMp4 from "@/assets/images/portfolio/new-portfolio/togness.mp4";
+// import tognessWebm from "@/assets/images/portfolio/new-portfolio/togness.webm";
 
-import luxeradio_1_400w from "@/assets/images/portfolio/new-portfolio/luxeradio-1-400w.webp";
-import luxeradio_1_800w from "@/assets/images/portfolio/new-portfolio/luxeradio-1-800w.webp";
+// import luxeradio_1_400w from "@/assets/images/portfolio/new-portfolio/luxeradio-1-400w.webp";
+// import luxeradio_1_800w from "@/assets/images/portfolio/new-portfolio/luxeradio-1-800w.webp";
 
-import luxeradio_2_400w from "@/assets/images/portfolio/new-portfolio/luxeradio-2-400w.webp";
-import luxeradio_2_800w from "@/assets/images/portfolio/new-portfolio/luxeradio-2-800w.webp";
+// import luxeradio_2_400w from "@/assets/images/portfolio/new-portfolio/luxeradio-2-400w.webp";
+// import luxeradio_2_800w from "@/assets/images/portfolio/new-portfolio/luxeradio-2-800w.webp";
 
-import smileMp4 from "@/assets/images/portfolio/new-portfolio/smile.mp4";
-import smileWebm from "@/assets/images/portfolio/new-portfolio/smile.webm";
+// import smileMp4 from "@/assets/images/portfolio/new-portfolio/smile.mp4";
+// import smileWebm from "@/assets/images/portfolio/new-portfolio/smile.webm";
 
-import justly_2_400w from "@/assets/images/portfolio/new-portfolio/justly-2-400w.webp";
-import justly_2_800w from "@/assets/images/portfolio/new-portfolio/justly-2-800w.webp";
+// import justly_2_400w from "@/assets/images/portfolio/new-portfolio/justly-2-400w.webp";
+// import justly_2_800w from "@/assets/images/portfolio/new-portfolio/justly-2-800w.webp";
 
-import togness_1_400w from "@/assets/images/portfolio/new-portfolio/togness-1-400w.webp";
-import togness_1_800w from "@/assets/images/portfolio/new-portfolio/togness-1-800w.webp";
+// import togness_1_400w from "@/assets/images/portfolio/new-portfolio/togness-1-400w.webp";
+// import togness_1_800w from "@/assets/images/portfolio/new-portfolio/togness-1-800w.webp";
 
-import justly_3_400w from "@/assets/images/portfolio/new-portfolio/justly-3-400w.webp";
-import justly_3_800w from "@/assets/images/portfolio/new-portfolio/justly-3-800w.webp";
+// import justly_3_400w from "@/assets/images/portfolio/new-portfolio/justly-3-400w.webp";
+// import justly_3_800w from "@/assets/images/portfolio/new-portfolio/justly-3-800w.webp";
 
 import config from "@/config.js";
 import lozad from "lozad";
@@ -121,7 +121,10 @@ export default {
       portfolios: [
         {
           id: 1,
-          images: [justly_1_400w, justly_1_800w],
+          images: [
+            "/images/portfolio/new-portfolio/justly-1-400w.webp",
+            "/images/portfolio/new-portfolio/justly-1-800w.webp",
+          ],
           classes: "flex-[40%] bg-[#F6EAD0] lg:rounded-none lg:rounded-tl-xl",
           title: "Justly",
           description:
@@ -131,7 +134,10 @@ export default {
         },
         {
           id: 2,
-          video: [tognessMp4, tognessWebm],
+          video: [
+            "/images/portfolio/new-portfolio/togness.mp4",
+            "/images/portfolio/new-portfolio/togness.webm",
+          ],
           classes: "flex-[40%] bg-[#E1F1FF] lg:rounded-none",
           title: "Togness",
           description:
@@ -141,7 +147,10 @@ export default {
         },
         {
           id: 3,
-          images: [luxeradio_1_400w, luxeradio_1_800w],
+          images: [
+            "/images/portfolio/new-portfolio/luxeradio-1-400w.webp",
+            "/images/portfolio/new-portfolio/luxeradio-1-800w.webp",
+          ],
           classes:
             "flex-[20%] hidden lg:block bg-[#EBB7DB] lg:rounded-none lg:rounded-tr-xl",
           title: "Luxeradio",
@@ -150,7 +159,10 @@ export default {
         },
         {
           id: 4,
-          images: [luxeradio_2_400w, luxeradio_2_800w],
+          images: [
+            "/images/portfolio/new-portfolio/luxeradio-2-400w.webp",
+            "/images/portfolio/new-portfolio/luxeradio-2-800w.webp",
+          ],
           classes: "flex-[50%] bg-[#F1E8F2] lg:rounded-none",
           title: "Luxeradio",
           description:
@@ -160,7 +172,10 @@ export default {
         },
         {
           id: 5,
-          video: [smileMp4, smileWebm],
+          video: [
+            "/images/portfolio/new-portfolio/smile.mp4",
+            "/images/portfolio/new-portfolio/smile.webm",
+          ],
           classes: "flex-[50%] bg-[#FFE9E5] lg:rounded-none",
           title: "Smile+",
           description:
@@ -171,7 +186,10 @@ export default {
         },
         {
           id: 6,
-          images: [justly_2_400w, justly_2_800w],
+          images: [
+            "/images/portfolio/new-portfolio/justly-2-400w.webp",
+            "/images/portfolio/new-portfolio/justly-2-800w.webp",
+          ],
           classes:
             "flex-[25%] hidden lg:block bg-[#CDE3F7] lg:rounded-none lg:rounded-bl-xl",
           title: "Justly",
@@ -180,7 +198,10 @@ export default {
         },
         {
           id: 7,
-          images: [togness_1_400w, togness_1_800w],
+          images: [
+            "/images/portfolio/new-portfolio/togness-1-400w.webp",
+            "/images/portfolio/new-portfolio/togness-1-800w.webp",
+          ],
           classes: "flex-[50%] hidden lg:block bg-[#E6F0D0] lg:rounded-none",
           title: "Togness",
           description:
@@ -190,7 +211,10 @@ export default {
         },
         {
           id: 8,
-          images: [justly_3_400w, justly_3_800w],
+          images: [
+            "/images/portfolio/new-portfolio/justly-3-400w.webp",
+            "/images/portfolio/new-portfolio/justly-3-800w.webp",
+          ],
           classes:
             "flex-[25%] hidden lg:block bg-[#AED2F6] lg:rounded-none lg:rounded-br-xl",
           title: "Justly",