From ae5f1ea03be87c76e0eefd0a00c34dab4163ec56 Mon Sep 17 00:00:00 2001
From: gaoluyang <2820782392@qq.com>
Date: 星期二, 02 九月 2025 15:01:05 +0800
Subject: [PATCH] 启动页样式修改
---
src/pages_template/pages/coupon/components/meituan-coupon.vue | 127 ++++++++++++++++++++++++++++++++++++++++++
1 files changed, 127 insertions(+), 0 deletions(-)
diff --git a/src/pages_template/pages/coupon/components/meituan-coupon.vue b/src/pages_template/pages/coupon/components/meituan-coupon.vue
new file mode 100644
index 0000000..f56e5df
--- /dev/null
+++ b/src/pages_template/pages/coupon/components/meituan-coupon.vue
@@ -0,0 +1,127 @@
+<template>
+ <view class="meituan">
+ <view class="content">
+ <view class="left">
+ <view class="sum">
+ 锟�<text class="num">8</text>
+ </view>
+ <view class="type">鎶电敤鍒�</view>
+ </view>
+ <view class="centre">
+ <view class="title">銆愭礂鐗欍��8鍏冩棤闂ㄦ绾㈠寘</view>
+ <view class="valid-date">浠婃棩鍒版湡</view>
+ </view>
+ <view class="right">
+ <view size="mini" class="immediate-use" :round="true">绔嬪嵆浣跨敤</view>
+ </view>
+ </view>
+ <view class="tips">
+ <view class="circle-left"></view>
+ <view class="circle-right"></view>
+ <view class="explain u-line-1">婊�8.1鍏冨彲鐢ㄣ�侀檺鏈�鏂扮増鏈鎴风浣跨敤</view>
+ <view class="rule">
+ <text>浣跨敤瑙勫垯</text>
+ <u-icon name="arrow-right" color="" :size="20" @click=""></u-icon>
+ </view>
+ </view>
+ </view>
+</template>
+<style scoped lang="scss">
+.meituan {
+ margin: 30rpx auto;
+ background-color: #ffffff;
+ width: 700rpx;
+ // border: 10rpx;
+ color: $u-warning;
+ font-size: 28rpx;
+
+ .content {
+ display: flex;
+ align-items: center;
+ padding: 80rpx 20rpx;
+ border: 10rpx;
+ background-color: #fff5f4;
+
+ .left {
+ .sum {
+ font-size: 32rpx;
+
+ .num {
+ font-size: 60rpx;
+ font-weight: bold;
+ }
+ }
+ }
+
+ .centre {
+ margin-left: 40rpx;
+
+ .title {
+ font-size: 32rpx;
+ font-weight: bold;
+ color: $u-main-color;
+ margin-bottom: 20rpx;
+ }
+ }
+
+ .right {
+ margin-left: 30rpx;
+
+ .immediate-use {
+ padding: 0 20rpx;
+ height: 50rpx;
+ border-radius: 25rpx;
+ line-height: 50rpx;
+ background-color: $u-warning !important;
+ color: #ffffff !important;
+ font-size: 24rpx;
+ border: none;
+ word-break: keep-all;
+ }
+ }
+ }
+
+ .tips {
+ padding: 0 20rpx;
+ border: 10rpx;
+ background-color: $u-info-light;
+ position: relative;
+ color: $u-tips-color;
+ display: flex;
+ justify-content: space-between;
+ line-height: 60rpx;
+ font-size: 24rpx;
+
+ .circle-left,
+ .circle-right {
+ position: absolute;
+ height: 36rpx;
+ width: 18rpx;
+ background-color: #f2f2f2;
+ }
+
+ .circle-right {
+ border-radius: 40rpx 0 0 40rpx;
+ right: 0;
+ top: -18rpx;
+ }
+
+ .circle-left {
+ border-radius: 0 40rpx 40rpx 0;
+ left: 0;
+ top: -18rpx;
+ }
+
+ .rule {
+ font-size: 24rpx;
+ display: flex;
+ align-items: center;
+
+ text {
+ margin-right: 10rpx;
+ flex: 1;
+ }
+ }
+ }
+}
+</style>
\ No newline at end of file
--
Gitblit v1.9.3