diff --git a/src/style.scss b/src/style.scss
index 1c09cbc..ff4dd89 100644
--- a/src/style.scss
+++ b/src/style.scss
@@ -112,19 +112,86 @@ body {
.header_swiper {
position: relative;
.swiper-pagination {
- display: block;
+ display: flex;
+ flex-direction: row;
position: absolute;
right: 0 !important;
- left: 90vw !important;
- bottom: 90px !important;
- width: 68px !important;
+ left: 87px !important;
+ bottom: 0px !important;
+ width: 250px !important;
+ height: 100px;
.swiper-pagination-bullet {
- width: 5px;
- height: 5px;
- background-color: $point_default;
+ width: 50px;
+ height: 3px !important;
+ background: #c2c2c2 !important;
+ opacity: 1 !important;
+ // height: 5px;
+ border-radius: 2px !important;
+ .home_swiper_page_num {
+ position: absolute;
+ bottom: 90px;
+ display: flex;
+ height: 14px;
+ font-size: 20px;
+ font-family: 'ZonaPro';
+ font-weight: 900;
+ color: #c2c2c2;
+ line-height: 67px;
+ width: 40px;
+ justify-content: center;
+ }
+ }
+ .active-class-1 {
+ background: $theme_color !important;
+ opacity: 1 !important;
+ .home_swiper_page_num {
+ position: absolute;
+ bottom: 90px;
+ display: flex;
+ height: 14px;
+ font-size: 20px;
+ font-family: 'ZonaPro';
+ font-weight: 900;
+ color: $theme_color;
+ line-height: 67px;
+ width: 40px;
+ justify-content: center;
+ }
+ }
+
+ .active-class-2 {
+ background: #fff !important;
+ opacity: 1 !important;
+ .home_swiper_page_num {
+ position: absolute;
+ bottom: 90px;
+ display: flex;
+ height: 14px;
+ font-size: 20px;
+ font-family: 'ZonaPro';
+ font-weight: 900;
+ color: #fff;
+ line-height: 67px;
+ width: 40px;
+ justify-content: center;
+ }
}
.swiper-pagination-bullet-active {
- background-color: $theme_color;
+ background: $theme_color !important;
+ opacity: 1 !important;
+ .home_swiper_page_num {
+ position: absolute;
+ bottom: 90px;
+ display: flex;
+ height: 14px;
+ font-size: 20px;
+ font-family: 'ZonaPro';
+ font-weight: 900;
+ color: $theme_color;
+ line-height: 67px;
+ width: 40px;
+ justify-content: center;
+ }
}
}
}
diff --git a/src/views/Index/components/HeaderSwiper/SlideFive/index.vue b/src/views/Index/components/HeaderSwiper/SlideFive/index.vue
index 405cc56..17b71a4 100644
--- a/src/views/Index/components/HeaderSwiper/SlideFive/index.vue
+++ b/src/views/Index/components/HeaderSwiper/SlideFive/index.vue
@@ -95,7 +95,7 @@
}
.bottom_statement {
position: absolute;
- left: 84px;
+ right: 87px;
white-space: nowrap;
z-index: 999;
bottom: 75px;
diff --git a/src/views/Index/components/HeaderSwiper/SlideFour/index.vue b/src/views/Index/components/HeaderSwiper/SlideFour/index.vue
index d1bbe45..3206c5e 100644
--- a/src/views/Index/components/HeaderSwiper/SlideFour/index.vue
+++ b/src/views/Index/components/HeaderSwiper/SlideFour/index.vue
@@ -82,7 +82,7 @@
}
.bottom_statement {
position: absolute;
- left: 87px;
+ right: 87px;
white-space: nowrap;
bottom: 75px;
font-size: 12px;
diff --git a/src/views/Index/components/HeaderSwiper/SlideOne/index.vue b/src/views/Index/components/HeaderSwiper/SlideOne/index.vue
index e833045..2cb8007 100644
--- a/src/views/Index/components/HeaderSwiper/SlideOne/index.vue
+++ b/src/views/Index/components/HeaderSwiper/SlideOne/index.vue
@@ -89,7 +89,7 @@
.bottom_statement {
position: absolute;
white-space: nowrap;
- left: 87px;
+ right: 87px;
bottom: 77px;
width: 165px;
height: 11px;
diff --git a/src/views/Index/components/HeaderSwiper/SlideThree/index.vue b/src/views/Index/components/HeaderSwiper/SlideThree/index.vue
index f516ecb..ad5a128 100644
--- a/src/views/Index/components/HeaderSwiper/SlideThree/index.vue
+++ b/src/views/Index/components/HeaderSwiper/SlideThree/index.vue
@@ -75,7 +75,7 @@ import Gif from '@/assets/img/banner/nation/logo.png'
.bottom_statement {
position: absolute;
white-space: nowrap;
- left: 87px;
+ right: 87px;
bottom: 77px;
font-size: 12px;
font-family: 'ZonaPro';
diff --git a/src/views/Index/components/HeaderSwiper/SlideTwo/index.vue b/src/views/Index/components/HeaderSwiper/SlideTwo/index.vue
index 65f33bf..380ae67 100644
--- a/src/views/Index/components/HeaderSwiper/SlideTwo/index.vue
+++ b/src/views/Index/components/HeaderSwiper/SlideTwo/index.vue
@@ -74,14 +74,14 @@ import HeaderPng from '@/assets/img/banner/lilun/biaotitubiao.png'
.bottom_statement {
position: absolute;
white-space: nowrap;
- left: 87px;
+ right: 87px;
bottom: 75px;
width: 165px;
height: 11px;
font-size: 12px;
font-family: 'ZonaPro';
font-weight: 400;
- color: #646a73;
+ color: #fff;
letter-spacing: 1px;
}
}
diff --git a/src/views/Index/components/HeaderSwiper/index.vue b/src/views/Index/components/HeaderSwiper/index.vue
index c22f8dc..71578de 100644
--- a/src/views/Index/components/HeaderSwiper/index.vue
+++ b/src/views/Index/components/HeaderSwiper/index.vue
@@ -6,10 +6,6 @@
:virtual="true"
:spaceBetween="0"
:loop="true"
- :autoplay="{
- delay: 5000,
- disableOnInteraction: false,
- }"
@swiper="onSwiper"
@slideChange="onSlideChange"
:keyboard="{
@@ -17,6 +13,10 @@
onlyInViewport: false,
pageUpDown: true,
}"
+ :autoplay="{
+ delay: 5000,
+ disableOnInteraction: false,
+ }"
@autoplayTimeLeft="onAutoplayTimeLeft"
class="header_swiper ignore-min-width"
>
@@ -35,13 +35,6 @@
0${ + index + 1 + }