|
|
@@ -2,17 +2,20 @@
|
|
|
<view>
|
|
|
<ujp-navbar title="包月卡购买"></ujp-navbar>
|
|
|
<!-- 卡片 -->
|
|
|
- <view class="monthly-card">
|
|
|
- <view class="main">
|
|
|
- <view class="title-1">
|
|
|
- 充电服务费包月卡
|
|
|
- </view>
|
|
|
- <view class="title-2">
|
|
|
- 有效期内，合约充电站使用度数无上限
|
|
|
+ <view class="monthly-card-bgc">
|
|
|
+ <view class="monthly-card">
|
|
|
+ <view class="main">
|
|
|
+ <view class="title-1">
|
|
|
+ 充电服务费包月卡
|
|
|
+ </view>
|
|
|
+ <view class="title-2">
|
|
|
+ 有效期内，合约充电站使用度数无上限
|
|
|
+ </view>
|
|
|
</view>
|
|
|
+ <img class="cover" src="../../assets/img/cover@3.png" alt="">
|
|
|
</view>
|
|
|
- <img class="cover" src="../../assets/img/cover@3.png" alt="">
|
|
|
</view>
|
|
|
+
|
|
|
<view class="slogan-1">
|
|
|
充电服务费包月卡
|
|
|
</view>
|
|
|
@@ -379,14 +382,20 @@
|
|
|
page {
|
|
|
background-color: #2a2c31;
|
|
|
}
|
|
|
+ .monthly-card-bgc{
|
|
|
+ padding: 20px;
|
|
|
+ background-color: #101010;
|
|
|
+ height: 150px;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
|
|
|
// 卡片
|
|
|
.monthly-card {
|
|
|
- margin: 20px;
|
|
|
+
|
|
|
border-radius: 16px;
|
|
|
height: 150px;
|
|
|
background: linear-gradient(#F2E6CA, #C9A87B);
|
|
|
- position: relative;
|
|
|
+
|
|
|
|
|
|
.main {
|
|
|
padding: 24px 0 24px 24px;
|
|
|
@@ -412,15 +421,16 @@
|
|
|
}
|
|
|
|
|
|
.cover {
|
|
|
- width: 102%;
|
|
|
+ width: 100%;
|
|
|
position: absolute;
|
|
|
- bottom: -10px;
|
|
|
- left: -2px;
|
|
|
+ bottom: -30px;
|
|
|
+ left: 0px;
|
|
|
right: 0;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
.slogan-1 {
|
|
|
+ margin-top: 50px;
|
|
|
height: 36px;
|
|
|
color: rgba(234, 217, 180, 100);
|
|
|
font-size: 48rpx;
|
