|
|
@@ -12,14 +12,18 @@
|
|
|
</div>
|
|
|
<div class="item-right">
|
|
|
<div class="title" v-scroll-reveal.reset="{ delay: 250, origin: 'top', distance: '40px', easing: 'ease-in-out', duration: 1000 }">{{item.title}}</div>
|
|
|
- <div class="dec" v-scroll-reveal.reset="{ delay: 350, origin: 'bottom', distance: '30px', duration: 1000 }">{{item.desc}}</div>
|
|
|
+ <div class="dec" v-scroll-reveal.reset="{ delay: 350, origin: 'bottom', distance: '30px', duration: 1000 }">
|
|
|
+ <p>{{item.desc}}</p>
|
|
|
+ </div>
|
|
|
<div class="btn" v-scroll-reveal.reset="{ delay: 450, easing: 'ease-in-out', scale: 0.85 }" @click="navPage(item)">了解详情</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="item-content" v-else>
|
|
|
<div class="item-left">
|
|
|
<div class="title" v-scroll-reveal.reset="{ origin: 'right', distance: '80px', duration: 1000, easing: 'ease-in-out' }" data-scroll-reveal="enter right and move 80px over 1s" >{{item.title}}</div>
|
|
|
- <div class="dec" v-scroll-reveal.reset="{ delay: 350, origin: 'left', distance: '40px', duration: 1000 }" data-scroll-reveal="wait 0.35s, then enter left and move 40px over 1s">{{item.desc}}</div>
|
|
|
+ <div class="dec" v-scroll-reveal.reset="{ delay: 350, origin: 'left', distance: '40px', duration: 1000 }" data-scroll-reveal="wait 0.35s, then enter left and move 40px over 1s">
|
|
|
+ <p>{{item.desc}}</p>
|
|
|
+ </div>
|
|
|
<div class="btn" v-scroll-reveal.reset="{ delay: 450, easing: 'ease-in-out', scale: 0.85 }" @click="navPage(item)">了解详情</div>
|
|
|
</div>
|
|
|
<div class="item-right">
|
|
|
@@ -211,8 +215,10 @@ $bg-white: #FFFFFF;
|
|
|
font-size: 14px;
|
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
|
font-weight: 400;
|
|
|
- color: #666666;
|
|
|
line-height: 24px;
|
|
|
+ p {
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
}
|
|
|
.btn {
|
|
|
width: 100px;
|
|
|
@@ -233,9 +239,17 @@ $bg-white: #FFFFFF;
|
|
|
font-size: 0;
|
|
|
display: flex;
|
|
|
flex-direction: column;
|
|
|
+ text-align: right;
|
|
|
.title {
|
|
|
text-align: right;
|
|
|
}
|
|
|
+ .dec {
|
|
|
+ text-align: right;
|
|
|
+ p {
|
|
|
+ text-align: justify;
|
|
|
+ display: inline-block;
|
|
|
+ }
|
|
|
+ }
|
|
|
.btn {
|
|
|
align-self: flex-end;
|
|
|
}
|