admin/sale
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: move carousel indicators inside the banner

Browse Source
This commit is contained in:
小萝
2026-04-29 10:46:46 +00:00
parent 7ef1918c87
commit 522dfced1a
1 changed files with 9 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
frontend/src/views/scheme4/Home.vue
+9 -3
View File
@@ -1,7 +1,7 @@
<template>
<div class="home-page">
<div class="banner-section">
<el-carousel height="280px" :interval="5000" arrow="hover" indicator-position="outside">
<el-carousel height="280px" :interval="5000" arrow="hover" indicator-position="inside">
<el-carousel-item v-for="(banner, index) in banners" :key="index">
<div class="banner-slide" :style="{ background: banner.bg }">
<div class="banner-content">
@@ -480,15 +480,21 @@ onMounted(async () => {
flex-shrink: 0;
}
:deep(.el-carousel__indicators--outside) {
margin-top: 12px;
:deep(.el-carousel__indicators--inside) {
bottom: 12px;
}
:deep(.el-carousel__indicator--horizontal .el-carousel__button) {
width: 8px;
height: 8px;
border-radius: 50%;
background: rgba(255, 255, 255, 0.2);
transition: all 0.3s;
}
:deep(.el-carousel__indicator--horizontal.is-active .el-carousel__button) {
width: 24px;
border-radius: 4px;
background: #4e6ef2;
}