fix

src/components/home/DameplaySwiperCard.vue

@@ -11,7 +11,7 @@
           stretch: 10,
           depth: 100,
           modifier: 3,
-          slideShadows: true,
+          slideShadows:false,
           scale: 0.98,
         }"
         :pagination="{
@@ -19,7 +19,6 @@
         }"
         :modules="modules"
         :loop="true"
-        :autoplay="{ delay: 3000, disableOnInteraction: false }"
         class="mySwiper"
         ref="myRef"
         :navigation="{
@@ -28,7 +27,8 @@
         }"
       >
         <swiper-slide v-for="(item, index) in imageList" :key="index"
-          ><img :src="item.imgSrc" />
+          >
+          <div class="geme-feature-img"><img :src="item.imgSrc" /></div>
           <div class="mask-next"></div>
           <div class="mask-prev"></div>
         </swiper-slide>
@@ -70,7 +70,7 @@ const imageList = reactive([
   { imgSrc: new URL("@/assets/img/home/game-swiper-card/04.png", import.meta.url).href },
   { imgSrc: new URL("@/assets/img/home/game-swiper-card/05.png", import.meta.url).href },
 ]);
-const modules = [EffectCoverflow, Pagination,Autoplay];
+const modules = [EffectCoverflow, Pagination];
 const boxStyle4 = computed(() => ({
   perspective: "300px",
   transition: "0s",
@@ -86,45 +86,54 @@ const handSlideNext = () => {
 };
 </script>
 <style lang="scss" scoped>
-.swiper {
+.swiper-content {
   width: 100%;
-  padding-top: 50px;
+  // padding-top: 50px;
+  height: 544px;
   padding-bottom: 50px;
 }
 
 .swiper-slide {
-  background-position: center;
-  background-size: cover;
-  width: 300px;
-  height: 300px;
+  // background-position: center;
+  // background-size: cover;
+  //  width: 300px;
+ 
 }
 
 .swiper-slide img {
   display: block;
   width: 100%;
+  height: 100%;
 }
 .swiper-content {
   position: relative;
   .swiper-btn-next {
     position: absolute;
     right: 250px;
-    top: 224px;
+    top: 254px;
     z-index: 5;
     cursor: pointer;
   }
   .swiper-btn-prev {
     position: absolute;
     left: 250px;
-    top: 224px;
+    top: 254px;
     z-index: 5;
     cursor: pointer;
   }
 }
 .mySwiper {
+  .geme-feature-img{
+     height: 544px;
+     img{
+       object-fit: contain;
+     }
+   
+  }
   img {
     // margin: 50px;
     // box-shadow: 30px 30px 30px  #e50c0ca6;
-    animation: glow 2.5s ease-in-out infinite;
+    // animation: glow 2.5s ease-in-out infinite;
   }
 
   @keyframes glow {
@@ -167,7 +176,7 @@ const handSlideNext = () => {
     .mask-next {
       position: absolute;
       left: 0;
-      top: 0;
+      top:69px;
       width: 720px;
       height: 410px;
       z-index: 1;
@@ -180,7 +189,7 @@ const handSlideNext = () => {
     .mask-prev {
       position: absolute;
       left: 0;
-      top: 0;
+      top:69px;
       width: 720px;
       height: 410px;
       z-index: 1;

src/components/home/WhatCebg.vue

@@ -342,7 +342,7 @@ function handleScroll() {
           background: url("@/assets/img/home/pve-btn.png") no-repeat;
           background-size: 100% 100%;
           opacity: 0;
-          transform: scaleX(1.1);
+          // transform: scaleX(1.1);
           clip-path: polygon(50% 50%, 50% 50%, 50% 50%, 50% 50%);
 
           transition: transform 0.25s ease-in-out;

src/components/layout/NavBar.vue

@@ -2,9 +2,9 @@
   <div>
     <div class="header header-top">
       <div class="header-logo">
-        <a href="#">
+        <router-link to="/">
           <img src="../../assets/img/home/header-logo.png" alt=""
-        /></a>
+        /></router-link>
       </div>
       <div class="nav">
         <a

src/router/index.js

@@ -17,27 +17,30 @@ const routes = [
     path: "/gellery",
     name: "gellery",
     component: () =>
-      import(/* webpackChunkName "gellery" */ "././../views/GalleryView.vue"),
+      import(/* webpackChunkName "gellery" */ "@/views/GalleryView.vue"),
   },
   {
     path: "/marketpalce",
     name: "marketpalce",
     component: () =>
       import(
-        /* webpackChunkName "marketpalce" */ "././../views/MarketplaceView.vue"
+        /* webpackChunkName "marketpalce" */ "@/views/MarketplaceView.vue"
       ),
   },
   {
     path: "/contact",
     name: "contact",
     component: () =>
-      import(/* webpackChunkName "contact" */ "././../views/ContactUsView.vue"),
+      import(/* webpackChunkName "contact" */ "@/views/ContactUsView.vue"),
   },
 ];
 
 const router = createRouter({
   history: createWebHistory(),
   routes,
+  scrollBehavior(to, from, savedPosition) {
+    return { top: 0 };
+  },
 });
 
 export default router;