Skip to content

杨炀 / dance-pc

Go to a project
Toggle navigation
Toggle navigation pinning
8876746b by yyx
Options

seat page

1 parent 4b6bf2f4
Inline Side-by-side
Showing 11 changed files with 1187 additions and 0 deletions
pnpm-lock.yaml 0 → 100644
This diff could not be displayed because it is too large.
src/permission.js
......@@ -13,6 +13,7 @@ NProgress.configure({ showSpinner: false })
const whiteList = ['/login', '/register', '/regulations']
router.beforeEach((to, from, next) => {
console.log('to2', to)
NProgress.start()
if (getToken()) {
// debugger
......
src/permissionPc.js
......@@ -9,6 +9,7 @@ import useUserStore from '@/store/modules/user'
NProgress.configure({ showSpinner: false })
router.beforeEach((to, from, next) => {
console.log('to', to)
NProgress.start()
if (getToken()) {
// 判断当前用户是否已拉取完user_info信息
......
src/routerPc/en.js
......@@ -500,6 +500,50 @@ export const constantRoutes = [
meta: { title: 'System messages' }
}
]
},
{
path: 'seat',
component: () => import('@/viewsPc/seat/seat'),
name: 'seat',
redirect: '/seat/detail',
children: [
{
path: 'detail',
name: 'seat_detail',
component: () => import('@/viewsPc/seat/ticket-detail'),
meta: { title: '购票详情' }
},
{
path: 'order',
name: 'seat_order',
component: () => import('@/viewsPc/seat/order-list'),
meta: { title: '我的订单' }
},
{
path: 'order_detail',
name: 'order_detail',
component: () => import('@/viewsPc/seat/order-detail'),
meta: { title: '订单详情' }
},
{
path: 'confirm_order',
name: 'confirm_order',
component: () => import('@/viewsPc/seat/confirm-order'),
meta: { title: '确认订单' }
},
{
path: 'add_watch_people',
name: 'add_watch_people',
component: () => import('@/viewsPc/seat/add-watch-people'),
meta: { title: '新增观影人' }
},
{
path: 'people_manage',
name: 'people_manage',
component: () => import('@/viewsPc/seat/people-manage'),
meta: { title: '观影人管理' }
},
]
}
]
},
......
src/viewsPc/seat/add-watch-people.vue 0 → 100644
<script setup></script>
<template>
<div class="container">
<div class="title">新增观影人</div>
<div class="content">
<div class="form-item">
<div>
<div class="label">姓名</div>
<el-input
v-model="input"
style="width: 570px"
placeholder="Please input"
/>
</div>
<div>
<div class="label">证件类型</div>
<el-input
v-model="input"
style="width: 570px"
placeholder="Please input"
readonly
/>
</div>
</div>
<div class="form-item">
<div>
<div class="label">身份证号</div>
<el-input
v-model="input"
style="width: 570px"
placeholder="Please input"
/>
</div>
</div>
</div>
<div class="footer">
<div class="can_pay">取消</div>
<div class="pay">确认</div>
</div>
</div>
</template>
<style scoped lang="scss">
div {
box-sizing: border-box;
}
.container {
padding: 20px 0;
width: 1200px;
margin: 0 auto;
.title {
padding: 11px;
text-align: center;
background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
font-size: 18px;
color: #ffffff;
}
.content {
padding: 46px 20px 24px;
background-color: #fff;
:deep(.el-input) {
height: 48px;
border-radius: 24px !important;
}
.form-item {
display: flex;
gap: 20px;
margin-bottom: 36px;
&:last-child {
margin: 0;
}
.label {
font-size: 18px;
color: #333333;
margin-bottom: 16px;
}
}
}
.footer {
display: flex;
justify-content: center;
align-items: center;
gap: 20px;
height: 70px;
background-color: #fff;
margin-top: 12px;
.pay {
width: 200px;
height: 40px;
background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
border-radius: 20px;
font-weight: 500;
font-size: 16px;
color: #ffffff;
line-height: 40px;
text-align: center;
cursor: pointer;
}
.can_pay {
width: 200px;
height: 40px;
background: #f6f6f6;
border-radius: 20px;
font-weight: 500;
font-size: 16px;
color: #999;
line-height: 40px;
text-align: center;
box-sizing: border-box;
cursor: pointer;
}
}
}
</style>
src/viewsPc/seat/confirm-order.vue 0 → 100644
<script setup></script>
<template>
<div class="container">
<div class="title">订单确认</div>
<div class="content">
<div class="left">
<div class="info">
<div class="name">2024亚洲舞蹈比赛无锡站</div>
<div class="address">无锡会展中心</div>
</div>
<div class="ticket_info">
<div class="tit_box">
<div class="line"></div>
<div class="txt">订票信息</div>
</div>
<div class="form">
<el-form>
<el-form-item label="联系人">
<el-input placeholder="请输入手机号" style="width: 260px" />
</el-form-item>
<el-form-item label="观看人">
<div class="p_box">
<div class="people">
<el-checkbox-group @change="">
<div
v-for="(it, index) in 5"
:key="index"
class="prople_item"
>
<div>
<div class="name">张三</div>
<div class="idcard">412************073</div>
</div>
<el-checkbox> </el-checkbox>
</div>
</el-checkbox-group>
</div>
<!-- button -->
<div class="btn">新增</div>
</div>
</el-form-item>
</el-form>
</div>
</div>
</div>
<div class="right">
<div class="tit_box">
<div class="line"></div>
<div class="txt">订单明细</div>
</div>
<div class="detail">
<div class="detail_top">
<div class="time">2024.03.03 周六</div>
<div class="ticket">80.00元票档 X2张</div>
</div>
<div class="detail_center">
<div v-for="(it, index) in 4" :key="index" class="ticket">
A区 6排14座 (B6馆)
</div>
</div>
<div class="detail_b">
<div class="sum_txt">共计</div>
<div class="price_num">¥160.00</div>
</div>
</div>
</div>
</div>
<div class="footer">
<div>
<span class="label">共计金额：</span><span class="value">¥900.00</span>
</div>
<div class="pay">立即支付</div>
</div>
</div>
</template>
<style scoped lang="scss">
div {
box-sizing: border-box;
}
.container {
padding: 20px 0;
width: 1200px;
margin: 0 auto;
.title {
padding: 11px;
text-align: center;
background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
font-size: 18px;
color: #ffffff;
}
.content {
display: flex;
background-color: #fff;
padding: 20px 0;
}
.line {
width: 4px;
height: 18px;
background: linear-gradient(180deg, #493ceb 0%, #8623fc 100%);
border-radius: 4px;
}
.left {
padding-left: 20px;
.info {
width: 640px;
background: rgba(69, 61, 234, 0.04);
border-radius: 8px;
border: 1px solid #d3d1f6;
padding: 20px 0 28px 33px;
margin-bottom: 20px;
.name {
font-weight: 500;
font-size: 18px;
color: #000000;
margin-bottom: 20px;
}
.address {
font-weight: 400;
font-size: 14px;
color: #929aa0;
}
}
.ticket_info {
.tit_box {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 14px;
.txt {
font-weight: bold;
font-size: 16px;
color: #493ceb;
}
}
.form {
width: 640px;
min-height: 464px;
padding: 20px 60px;
border-radius: 5px;
border: 1px solid #dcdfe6;
.p_box {
display: flex;
gap: 10px;
.people {
width: 298px;
background: #fbfcfd;
border-radius: 2px;
border: 1px solid #dcdfe6;
padding: 0 14px;
.prople_item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 14px 0;
border-bottom: 1px solid #dcdfe6;
&:last-child {
border: none;
}
.name {
font-size: 16px;
color: #929aa0;
margin-bottom: 20px;
}
.idcard {
font-size: 10px;
color: #929aa0;
}
}
}
.btn {
width: 90px;
height: 40px;
background: #fbfcfd;
border-radius: 20px;
border: 1px solid #493ceb;
margin-top: 10px;
font-size: 14px;
color: #493ceb;
line-height: 40px;
text-align: center;
cursor: pointer;
user-select: none;
}
}
}
}
}
.right {
width: 460px;
margin-left: 36px;
.tit_box {
display: flex;
align-items: center;
gap: 10px;
margin-bottom: 20px;
.txt {
font-weight: bold;
font-size: 16px;
color: #493ceb;
}
}
.detail {
padding: 15px 26px;
border-radius: 5px;
border: 1px solid #dcdfe6;
.detail_top {
padding-bottom: 13px;
border-bottom: 1px solid #dcdfe6;
.time {
font-weight: 500;
font-size: 18px;
color: #2d373f;
line-height: 25px;
margin-bottom: 8px;
}
.ticket {
font-size: 16px;
color: #2d373f;
}
}
.detail_center {
margin-top: 14px;
display: flex;
flex-direction: column;
padding-bottom: 13px;
border-bottom: 1px solid #dcdfe6;
gap: 8px;
.ticket {
font-size: 16px;
color: #2d373f;
}
}
.detail_b {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: 16px;
.sum_txt {
font-weight: 600;
font-size: 18px;
color: #2d373f;
line-height: 25px;
}
.price_num {
font-weight: 600;
font-size: 36px;
color: #ff8124;
line-height: 50px;
}
}
}
}
.footer {
display: flex;
justify-content: space-between;
height: 70px;
align-items: center;
background: #ffffff;
box-shadow: 0px 0px 46px 0px rgba(1, 16, 64, 0.08);
margin-top: 9px;
padding: 0 30px;
.label {
font-size: 16px;
color: #7b7f83;
line-height: 22px;
}
.value {
font-size: 22px;
color: #ff8124;
line-height: 30px;
font-weight: 600;
}
.pay {
width: 200px;
height: 40px;
background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
border-radius: 20px;
font-weight: 500;
font-size: 16px;
color: #ffffff;
line-height: 40px;
text-align: center;
cursor: pointer;
}
}
}
</style>
src/viewsPc/seat/order-detail.vue 0 → 100644
<script setup></script>
<template>
<div class="container">
<div class="left">
<!-- 票务信息 -->
<div class="ticket">
<div class="th">
<div style="width: 33%" class="td">票务信息</div>
<div style="width: 25%" class="td">地点</div>
<div style="width: 20%" class="td">单价</div>
<div style="width: 10%" class="td">数量</div>
<div style="width: 12%; text-align: right" class="td">小计</div>
</div>
<div class="line"></div>
<div class="tr">
<div style="width: 30%" class="td">2024年亚洲舞蹈大赛无锡站</div>
<div style="width: 25%" class="td">无锡太湖国际博览中心</div>
<div style="width: 20%" class="td">¥80.00</div>
<div style="width: 12%" class="td">x3</div>
<div style="width: 13%; text-align: right" class="td">¥240.00</div>
</div>
</div>
<!-- 座位 -->
<div class="seat_box">
<div class="th">
<div style="width: 30.33%" class="td">时间座位</div>
<div style="width: 30.33%" class="td">订单信息</div>
<div style="width: 30.33%" class="td">联系方式</div>
</div>
<div class="tr">
<div style="width: 30.33%" class="td flex-col">
<div>2024.05.03 周六</div>
<div>A区 6排16座 (B6馆)</div>
<div>A区 6排16座 (B6馆)</div>
<div>A区 6排16座 (B6馆)</div>
</div>
<div style="width: 30.33%" class="td flex-col">
<div>订单编号：12783893435</div>
<div>创建时间：2024.05.07 16:3</div>
</div>
<div style="width: 30.33%" class="td">
<div>联系电话：12783893435</div>
</div>
</div>
</div>
<!-- 购票人 -->
<div class="pay_ticket">
<div class="title">购票人</div>
<div class="people">
<div v-for="(it, index) in 4" :key="index" class="p_info">
<div>张三</div>
<div class="idcard">身份证：244************0</div>
</div>
</div>
</div>
</div>
<div class="right">
<div class="balance">
<div class="title">结算信息</div>
<div class="cell">
<div class="label">订单状态</div>
<div class="value">待支付</div>
</div>
<div class="cell">
<div class="label">订单金额</div>
<div class="value">待支付</div>
</div>
<!-- button -->
<div class="btn_box">
<div class="can_pay">取消支付</div>
<div class="pay">立即支付</div>
</div>
</div>
<div class="tip">请尽快完成支付，还剩15分00秒</div>
</div>
</div>
</template>
<style scoped lang="scss">
.container {
width: 1200px;
margin: 0 auto;
padding: 20px 0;
display: flex;
gap: 20px;
.left {
width: 780px;
// 票务信息
.ticket {
background-color: #fff;
padding: 0 20px;
.th {
display: flex;
justify-content: space-between;
padding: 20px 0;
.td {
font-weight: bold;
font-size: 16px;
color: #333333;
line-height: 24px;
}
}
.line {
width: 740px;
height: 1px;
background: #eee;
}
.tr {
display: flex;
justify-content: space-between;
padding: 20px 0;
.td {
font-weight: 400;
font-size: 16px;
color: #333333;
line-height: 24px;
}
}
}
// 座位
.seat_box {
background-color: #fff;
padding: 0 20px;
margin-top: 20px;
.th {
display: flex;
justify-content: space-between;
padding: 20px 0;
.td {
font-weight: bold;
font-size: 16px;
color: #333333;
line-height: 24px;
}
}
.tr {
display: flex;
justify-content: space-between;
padding: 20px 0;
.td {
font-weight: 400;
font-size: 16px;
color: #333333;
line-height: 24px;
}
.flex-col {
display: flex;
flex-direction: column;
gap: 16px;
}
}
}
// 购票人
.pay_ticket {
background-color: #fff;
padding: 20px;
margin-top: 20px;
.title {
font-weight: bold;
font-size: 16px;
color: #333333;
margin-bottom: 28px;
}
.people {
display: flex;
justify-content: space-between;
flex-wrap: wrap;
gap: 15px 50px;
.p_info {
font-weight: 400;
font-size: 16px;
color: #333333;
line-height: 24px;
.idcard {
color: #999999;
}
}
}
}
}
.right {
width: 400px;
.balance {
background-color: #fff;
padding: 20px;
.title {
font-weight: bold;
font-size: 20px;
color: #333333;
line-height: 30px;
margin-bottom: 28px;
}
.cell {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
&:last-child {
margin: 0;
}
.label {
font-weight: 400;
font-size: 16px;
color: #333333;
}
.value {
font-weight: 400;
font-size: 16px;
color: #ff8124;
}
}
.btn_box {
border-top: 1px solid #eee;
padding-top: 20px;
display: flex;
gap: 20px;
.pay {
width: 170px;
height: 40px;
background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
border-radius: 20px;
font-weight: 500;
font-size: 16px;
color: #ffffff;
line-height: 40px;
text-align: center;
cursor: pointer;
}
.can_pay {
width: 170px;
height: 40px;
background: #f6f6f6;
border-radius: 20px;
font-weight: 500;
font-size: 16px;
color: #999;
line-height: 40px;
text-align: center;
box-sizing: border-box;
cursor: pointer;
}
}
}
.tip {
font-weight: 400;
font-size: 16px;
color: #ea3d6b;
line-height: 24px;
margin-top: 20px;
text-align: center;
}
}
}
</style>
src/viewsPc/seat/order-list.vue 0 → 100644
<script setup>
const status = reactive({
0: {
txt: "待支付",
color: "#F740A6",
bgColor: "#FFE2F2",
},
1: {
txt: "已支付",
color: "#757575",
bgColor: "#DDDDDD",
},
2: {
txt: "未支付",
color: "#34C759",
bgColor: "#D2FFDD",
},
3: {
txt: "已退款",
color: "#FFCC00",
bgColor: "#FFF7D9",
},
});
</script>
<template>
<div class="container">
<div
v-for="(it, index) in 10"
:key="index"
@click="$router.push({ path: '/seat/order_detail' })"
class="order-item"
>
<div class="info_box">
<img class="cover_img" />
<div class="info">
<div class="title">2024年亚洲舞蹈大赛无锡站</div>
<div class="common">时间：2024.05.06 周六</div>
<div class="common">地址：无锡太湖博览中心</div>
<div class="common">订单编号：739274039504</div>
<div class="common">张数：2张</div>
<div class="common">金额：￥728.00</div>
<div class="status">
<div class="label">订单状态：</div>
<div class="value">
<div
:style="{
borderColor: status[0].color,
background: status[0].bgColor,
color: status[0].color,
}"
class="tag"
>
{{ status[0].txt }}
</div>
<div v-if="true" class="tip">请尽快完成支付，还剩15分00秒</div>
</div>
</div>
</div>
</div>
<div class="btn_box">
<div class="pay">立即支付</div>
<div class="can_pay">取消支付</div>
</div>
</div>
</div>
</template>
<style scoped lang="scss">
.container {
width: 1200px;
margin: 0 auto;
padding: 26px 0;
font-family: SourceHanSansCN, SourceHanSansCN;
.order-item {
display: flex;
justify-content: space-between;
align-items: center;
padding: 36px;
background: #fff;
box-shadow: 0px 0px 46px 0px rgba(1, 16, 64, 0.08);
border-radius: 8px;
margin-bottom: 30px;
.info_box {
display: flex;
gap: 20px;
.cover_img {
width: 155px;
height: 200px;
}
.info {
.title {
font-weight: bold;
font-size: 22px;
color: #000000;
line-height: 33px;
margin-bottom: 25px;
margin-bottom: 10px;
}
.common {
font-weight: 500;
font-size: 16px;
color: #4e4e4e;
margin-bottom: 6px;
}
.status {
display: flex;
.label {
font-weight: 500;
font-size: 16px;
color: #4e4e4e;
line-height: 24px;
}
.value {
display: flex;
align-items: center;
gap: 20px;
.tag {
padding: 6px 14px;
border-radius: 6px;
border: 1px solid #34c759;
}
.tip {
font-size: 16px;
color: #f740a6;
line-height: 24px;
}
}
}
}
}
.btn_box {
display: flex;
flex-direction: column;
gap: 12px;
.pay {
width: 175px;
height: 40px;
background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
border-radius: 20px;
font-weight: 500;
font-size: 16px;
color: #ffffff;
line-height: 40px;
text-align: center;
cursor: pointer;
}
.can_pay {
width: 175px;
height: 40px;
background: #fff;
border-radius: 20px;
font-weight: 500;
font-size: 16px;
color: #493ceb;
line-height: 40px;
border: 1px solid #493ceb;
text-align: center;
box-sizing: border-box;
cursor: pointer;
}
}
}
}
</style>
src/viewsPc/seat/people-manage.vue 0 → 100644
<script setup></script>
<template>
<div class="container">
<div class="title">观影人管理</div>
<div class="content">
<div class="people_box">
<div v-for="(it, index) in 10" :key="index" class="people_item">
<div class="name">朱育杰</div>
<div class="idcard">身份证：244************074</div>
<div class="btn">删除</div>
</div>
</div>
</div>
</div>
</template>
<style scoped lang="scss">
div {
box-sizing: border-box;
}
.container {
padding: 20px 0;
width: 1200px;
margin: 0 auto;
.title {
padding: 11px;
text-align: center;
background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
font-size: 18px;
color: #ffffff;
}
.content {
min-height: 590px;
background-color: #fff;
box-shadow: 0px 0px 46px 0px rgba(1, 16, 64, 0.08);
padding: 20px;
.people_box {
display: flex;
flex-wrap: wrap;
gap: 20px;
.people_item {
width: 275px;
height: 137px;
background: #ffffff;
border: 1px solid #dcdfe6;
padding: 16px;
.name {
font-weight: 600;
font-size: 16px;
color: #2d373f;
line-height: 22px;
}
.idcard {
font-size: 16px;
color: #95a1a6;
line-height: 22px;
margin-top: 12px;
margin-bottom: 17px;
}
.btn {
width: 69px;
height: 32px;
background: #e7e6ff;
font-weight: 400;
font-size: 16px;
color: #493ceb;
line-height: 32px;
text-align: center;
cursor: pointer;
user-select: none;
}
}
}
}
}
</style>
src/viewsPc/seat/seat.vue 0 → 100644
<script setup></script>
<template>
<div class="view">
<router-view />
</div>
</template>
<style scoped lang="scss">
.view {
min-width: 1024px;
max-width: 1920px;
margin: 0 auto;
}
</style>
src/viewsPc/seat/ticket-detail.vue 0 → 100644
<script setup></script>
<template>
<div>
<!-- top -->
<div class="container top">
<img class="cover_img" />
<div class="info">
<div class="title">2024年亚洲舞蹈大赛无锡站</div>
<div class="time">时间：2024.05.02 周六 — 2024.05.08 周一</div>
<div class="address">地址：无锡太湖博览中心</div>
<!-- 时间 -->
<div class="select_item_box">
<div class="label">时间</div>
<div class="select_item">
<div
v-for="(it, index) in 4"
:key="index"
:class="[false ? 'tagActive' : 'tag']"
>
2024.05.02 周六
</div>
</div>
</div>
<!-- 场次 -->
<div class="select_item_box">
<div class="label">场次</div>
<div class="select_item">
<div :class="[true ? 'tagDisabled' : false ? 'tagActive' : 'tag']">
日场
</div>
<div :class="[true ? 'tagDisabled' : false ? 'tagActive' : 'tag']">
日场
</div>
</div>
</div>
<!-- 场馆 -->
<div class="select_item_box">
<div class="label">场馆</div>
<div class="select_item">
<div
v-for="(it, index) in 2"
:key="index"
:class="[true ? 'tagDisabled' : false ? 'tagActive' : 'tag']"
>
B6
</div>
</div>
</div>
<!-- 票档 -->
<div class="select_item_box">
<div class="label">票档</div>
<div class="select_item">
<div
v-for="(it, index) in 3"
:key="index"
:class="[true ? 'tagDisabled' : false ? 'tagActive' : 'tag']"
>
200.00元
</div>
</div>
</div>
<!-- button -->
<div class="btn">选座购票</div>
</div>
</div>
<!-- bottom -->
<div class="container bottom">
<div class="title">活动介绍</div>
<div class="rich_content" v-html="'123123123123123123'"></div>
<div class="title" style="margin-top: 30px">购票须知</div>
<div class="rich_content" v-html="'123123123123123123'"></div>
</div>
</div>
</template>
<style scoped lang="scss">
.container {
width: 1200px;
margin: 0 auto;
background-color: #fff;
box-shadow: 0px 0px 46px 0px rgba(1, 16, 64, 0.08);
border-radius: 8px;
box-sizing: border-box;
font-family: SourceHanSansCN, SourceHanSansCN;
padding-bottom: 20px;
}
.top {
display: flex;
padding: 19px;
margin-top: 26px;
.cover_img {
width: 390px;
height: 517px;
object-fit: fill;
margin-right: 36px;
}
.info {
padding-top: 12px;
.title {
font-weight: bold;
font-size: 28px;
color: #000000;
line-height: 42px;
margin-bottom: 34px;
}
.time {
font-weight: 500;
font-size: 16px;
color: #4a4a4a;
line-height: 24px;
margin-bottom: 16px;
}
.address {
font-weight: 500;
font-size: 16px;
color: #4a4a4a;
line-height: 24px;
margin-bottom: 33px;
}
.select_item_box {
display: flex;
margin-bottom: 30px;
&:last-child {
margin-bottom: 0;
}
.label {
font-weight: 600;
font-size: 16px;
color: #000;
line-height: 24px;
margin-right: 12px;
flex-shrink: 0;
}
.select_item {
display: flex;
flex-wrap: wrap;
gap: 10px;
.tag {
padding: 12px 18px;
background: #eeeeee;
border-radius: 4px;
border: 1px solid #29343c;
font-size: 14px;
color: #4a4a4a;
cursor: pointer;
}
.tagActive {
padding: 12px 18px;
background: #fff;
border-radius: 4px;
border: 1px solid #493ceb;
font-size: 14px;
color: #493ceb;
cursor: pointer;
}
.tagDisabled {
padding: 12px 18px;
background: #878787;
border-radius: 4px;
border: 1px solid #29343c;
font-size: 14px;
color: #4a4a4a;
cursor: no-drop;
}
}
}
.btn {
width: 175px;
height: 40px;
background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
border-radius: 20px;
line-height: 40px;
text-align: center;
font-weight: 500;
font-size: 16px;
color: #ffffff;
cursor: pointer;
}
}
}
.bottom {
padding: 50px;
margin-top: 30px;
.title {
padding: 20px 30px;
background: linear-gradient(270deg, #493ceb 0%, #8623fc 100%);
font-weight: bold;
font-size: 20px;
color: #ffffff;
line-height: 30px;
margin-bottom: 30px;
}
.rich_content {
margin-top: 30px;
}
}
</style>
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!