2025-02-18 17:11:31 +08:00
|
|
|
|
<template>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<view :class="darkFans?`darkbackgroundContainer`:`backgroundContainer`">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<view class="left-container">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<view class="left-head" @click="gotoLogin">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<image class="left-head-img" src="/static/index/oldman.png" />
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<text :class="darkFans?`left-head-font-dark`:`left-head-font`">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
王金凤
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="left-img-container">
|
|
|
|
|
|
<view v-for="(item,index) in iconList" :key="index" class="blue-circle-pos">
|
|
|
|
|
|
<view class="blue-circle" v-show="index === menuIndex">
|
|
|
|
|
|
<image class="blue-circle-size" :src="`/static/index/ray.png`" />
|
|
|
|
|
|
</view>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<image class="left-img" :src="index === menuIndex ? item.targetUrl : item.url"
|
|
|
|
|
|
@click="changeMenu(index)" />
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="right-container">
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<view class="right-container-title-nav">
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<text :class="darkFans?`right-container-title-no-dark`:`right-container-title-no`">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
ID：12345678
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</text>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<text :class="darkFans?`right-container-title-no-dark`:`right-container-title-no`">
|
|
|
|
|
|
名称：未命名01
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</text>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<view class="right-icons">
|
|
|
|
|
|
<image class="right-icons-img" :src="`/static/index/undericons/man.png`" />
|
|
|
|
|
|
<view :class="darkFans?`right-icons-font-dark`: `right-icons-font` ">王金福</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<image class="right-icons-img-icon"
|
|
|
|
|
|
:src="darkFans?`/static/index/undericons/face.png`:`/static/index/undericons/facelight.png`" />
|
|
|
|
|
|
<image class="right-icons-img-icon"
|
|
|
|
|
|
:src="darkFans?`/static/index/undericons/hand.png`:`/static/index/undericons/handlight.png`" />
|
|
|
|
|
|
<image class="right-icons-img-icon"
|
|
|
|
|
|
:src="darkFans?`/static/index/undericons/out.png`:`/static/index/undericons/outlight.png`" />
|
2025-02-25 17:23:40 +08:00
|
|
|
|
</view>
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<view class="right-container-title-class-anhei-button" @click="darkFans=!darkFans" v-show="!darkFans">
|
|
|
|
|
|
<text class="right-container-title-class-anhei">
|
|
|
|
|
|
切换到暗黑模式
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<view class="right-container-title-class-anhei-button"
|
|
|
|
|
|
:style="darkFans ? { backgroundColor:'#fff' } : {}" @click="darkFans=!darkFans" v-show="darkFans">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<text class="right-container-title-class-anhei" :style="darkFans ? { color: 'black' } : {}">
|
|
|
|
|
|
取消暗黑模式
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="right-container-fir">
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<view class="right-container-fir-left-nav">
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<view :class="darkFans?`right-container-fir-left-card-dark`:`right-container-fir-left-card`">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<image class="right-container-fir-left-card-hulilei" :src="`/static/index/hulilei.png`" />
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<div class="right-container-fir-left-card-hulilei-font" @click="showPopup">护理类</div>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<image v-if="darkFans" class="card-upfaguang" :src="`/static/index/cardbgc/uplight.png`" />
|
|
|
|
|
|
<view class="right-container-fir-left-carousel">
|
|
|
|
|
|
<view class="carousel">
|
|
|
|
|
|
<view class="dots">
|
|
|
|
|
|
<span v-for="(item, index) in [1, 2, 3]" :key="index"
|
|
|
|
|
|
:class="darkFans?`dot-dark`:`dot`"
|
|
|
|
|
|
:style="index===firstcurrentIndexup?{backgroundColor:`#01A0FE`}:{}"></span>
|
|
|
|
|
|
</view>
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<view class="right-container-fir-left-card-main">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<swiper :current="firstcurrentIndexup" class="swiper savehundred" circular
|
|
|
|
|
|
:indicator-dots="false" :vertical="true" :interval="4000" :duration="500"
|
|
|
|
|
|
@change="onSwiperChange">
|
|
|
|
|
|
<swiper-item class="swiper-item-flex" v-for="(item,index) in [1,2 ,3]" :key="index">
|
|
|
|
|
|
<view class="right-container-fir-left-card-flex">
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<view class="uni-margin-wrap-fir">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
|
|
|
|
|
<swiper :current="firstcurrentIndex" class="swiper" circular
|
|
|
|
|
|
:indicator-dots="false" :interval="4000" :duration="500">
|
|
|
|
|
|
<swiper-item class="swiper-item-flex" v-for="(item,index) in [1,2 ,3]"
|
|
|
|
|
|
:key="index">
|
|
|
|
|
|
<view class="right-container-fir-left-card-card">
|
|
|
|
|
|
<view class="right-container-fir-left-card-zhixing">
|
|
|
|
|
|
<div class="right-container-fir-left-card-zhixing-font">待执行
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<image class="right-container-fir-left-card-img"
|
2025-02-27 17:15:17 +08:00
|
|
|
|
:src="`/static/index/teeth.png`" @click="showPopup" />
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<view class="right-container-fir-left-card-main-laba-video">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<image class="right-container-fir-left-card-main-laba"
|
|
|
|
|
|
:src="darkFans?`/static/index/darkicon/labadark.png`:`/static/index/laba.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`right-container-fir-left-card-main-font-dark`:`right-container-fir-left-card-main-font`">
|
|
|
|
|
|
准备洁具（口腔）
|
|
|
|
|
|
</text>
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<image class="right-container-fir-left-card-main-video"
|
|
|
|
|
|
:src="darkFans?`/static/index/indexvideo.png`:`/static/index/indexvideo.png`" />
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<view class="split-line">
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="time-tra-fir">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<view :class="darkFans?`time-font-dark`:`time-font`">
|
|
|
|
|
|
10:00 - 10:10
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view :class="darkFans?`time-text-dark`:`time-text`">
|
|
|
|
|
|
为老人提供口腔清洁器具，牙膏、牙刷及水杯，看护完成
|
|
|
|
|
|
</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="time-people-two">
|
|
|
|
|
|
<view class="time-people-fir">
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/darkicon/zhixingpeopledark.png`:`/static/index/cardicons/zhixing.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-people-font-dark`:`time-people-font`">
|
|
|
|
|
|
单人执行
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="time-people-sec">
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/medium/dopeopledark.png`:`/static/index/cardicons/zhifa.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-people-font-dark`:`time-people-font`">
|
|
|
|
|
|
--
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<view class="time-button-view">
|
|
|
|
|
|
<view class="time-button-start">
|
|
|
|
|
|
开始服务
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view
|
|
|
|
|
|
:class="darkFans?`time-button-end-dark`:`time-button-end`">
|
|
|
|
|
|
服务结束
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
</swiper-item>
|
|
|
|
|
|
</swiper>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
</view>
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view class="split-line-white-right-left" :style="darkFans ? `background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #386997 50%, rgba(0, 0, 0, 0) 100%);`:``">
|
2025-02-25 17:23:40 +08:00
|
|
|
|
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<image v-if="darkFans" class="split-line-white-img"
|
|
|
|
|
|
:src="`/static/index/cardbgc/leftlight.png`" />
|
2025-02-19 17:33:12 +08:00
|
|
|
|
</view>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</swiper-item>
|
|
|
|
|
|
</swiper>
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<view class="right-huli-sec">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<image class="right-huli-shang" :src="`/static/index/hulilist/shang.png`" />
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<scroll-view v-if="!darkFans" :show-scrollbar="false" scroll-y="true"
|
|
|
|
|
|
class="right-huli-view">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<view v-for="(item,index) in huliList" :key="index" class="right-huli-view-dis">
|
|
|
|
|
|
<image class="right-huli-img" :src="item.url" />
|
|
|
|
|
|
<text class="right-huli-text">{{item.name}}</text>
|
|
|
|
|
|
</view>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</scroll-view>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<!-- 暗黑模式 -->
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<scroll-view v-if="darkFans" :show-scrollbar="false" scroll-y="true"
|
|
|
|
|
|
class="right-huli-view">
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<view v-for="(item,index) in huliListDark" :key="index" class="right-huli-view-dis">
|
|
|
|
|
|
<image class="right-huli-img" :src="item.url" />
|
|
|
|
|
|
<text class="right-huli-text-dark">{{item.name}}</text>
|
|
|
|
|
|
</view>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</scroll-view>
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<image class="right-huli-xia" :src="`/static/index/hulilist/xia.png`" />
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<view :class="darkFans?`right-container-fir-right-dark`:`right-container-fir-right`">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<view class="right-container-card">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="right-container-card-right">
|
|
|
|
|
|
<view class="" v-for="(item,index) in [1,2,3,4]" :key="index">
|
|
|
|
|
|
<image class="right-container-card-right-img" src="/static/index/customer.png" />
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<text :class="darkFans?`right-container-title-dark`:`right-container-title`">
|
|
|
|
|
|
{{ currentTime }}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</text>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<text :class="darkFans?`right-container-date-dark`:`right-container-date`">
|
|
|
|
|
|
{{ fullDate }}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</text>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<text :class="darkFans?`right-container-day-dark`:`right-container-day`">
|
|
|
|
|
|
{{ weekDay }}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</text>
|
|
|
|
|
|
<view class="right-container-tem">
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<image class="right-container-tem-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/darkicon/wendudark.png`:`/static/index/roomicons/wendu.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`right-container-tem-text-dark`:`right-container-tem-text`">23°C</text>
|
|
|
|
|
|
<image class="right-container-tem-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/roomicons/shidu.png`:`/static/index/darkicon/shidudark.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`right-container-tem-text-dark`:`right-container-tem-text`">39%</text>
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<!-- 分割线 -->
|
|
|
|
|
|
<view class="right-container-fenge"></view>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
<view class="right-container-button" v-if="!darkFans">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<view v-for="(item,index) in roomBtttonList" :key="index"
|
|
|
|
|
|
class="right-container-button-any">
|
|
|
|
|
|
<image v-show="roomTar.includes(index)" class="right-container-button-ray"
|
|
|
|
|
|
:src="`/static/index/cardicons/ray2.png`" />
|
|
|
|
|
|
<image class="right-container-button-img"
|
|
|
|
|
|
:src="roomTar.includes(index)?item.targetUrl : item.url" @click="saveItem(index)" />
|
|
|
|
|
|
<text class="right-container-button-text"
|
|
|
|
|
|
:style="roomTar.includes(index)?{color: '#167ED7'}:{}">{{item.name}}</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<!-- 暗黑模式 -->
|
|
|
|
|
|
<view class="right-container-button" v-if="darkFans">
|
|
|
|
|
|
<view v-for="(item,index) in roomBtttonListdark" :key="index"
|
|
|
|
|
|
class="right-container-button-any">
|
|
|
|
|
|
<image v-show="roomTar.includes(index)" class="right-container-button-ray"
|
|
|
|
|
|
:src="`/static/index/cardicons/ray2.png`" />
|
|
|
|
|
|
<image class="right-container-button-img"
|
|
|
|
|
|
:src="roomTar.includes(index)?item.targetUrl : item.url" @click="saveItem(index)" />
|
|
|
|
|
|
<text class="right-container-button-text"
|
|
|
|
|
|
:style="roomTar.includes(index)?{color: '#167ED7'}:{color: '#fff'}">{{item.name}}</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="right-container-sec">
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<view :class="darkFans?`right-container-left-dark`:`right-container-left`">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<image class="right-container-left-type" :src="`/static/index/yiliao/yiliaolei.png`" />
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<div class="right-container-left-font" @click="showPopupsec">医疗类</div>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<view class="right-container-fir-left-carousel">
|
|
|
|
|
|
<view class="carousel">
|
|
|
|
|
|
<view class="dots">
|
|
|
|
|
|
<span v-for="(item, index) in [1, 2, 3]" :key="index" :class="darkFans?`dot-dark`:`dot`"
|
2025-02-27 17:15:17 +08:00
|
|
|
|
:style="index===secondcurrentIndexup?{backgroundColor:`#01A0FE`}:{}"></span>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</view>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<image v-if="darkFans" class="card-upfaguang-down" :src="`/static/index/cardbgc/uplight.png`" />
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<swiper :current="secondcurrentIndexup" class="swiper savehundred" circular :indicator-dots="false"
|
|
|
|
|
|
:vertical="true" :interval="4000" :duration="500" @change="onSwiperChangesec">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<swiper-item class="swiper-item-flex" v-for="(item,index) in [1,2 ,3]" :key="index">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<div class="right-container-fir-left-card-flex-sec">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<view class="uni-margin-wrap">
|
|
|
|
|
|
<swiper :current="secondcurrentIndex" class="swiper" circular
|
2025-02-27 17:15:17 +08:00
|
|
|
|
:indicator-dots="false" :autoplay="false" :interval="4000" :duration="500">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<swiper-item class="swiper-item-flex" v-for="(item,index) in [1,2 ,3]"
|
|
|
|
|
|
:key="index">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<div class="right-container-left-font-spec">进行中
|
|
|
|
|
|
</div>
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<view class="time-tra-sec">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<view :class="darkFans?`time-font-dark`:`time-font`">
|
|
|
|
|
|
10:00 - 10:10
|
|
|
|
|
|
</view>
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<view class="time-people-thi">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<image class="time-people-img"
|
2025-02-25 17:23:40 +08:00
|
|
|
|
:src="darkFans?`/static/index/medium/doctorsaydark.png`:`/static/index/medium/doctorsay.png`" />
|
|
|
|
|
|
<text :class="darkFans?`time-people-font-dark`:`time-people-font`">
|
2025-03-03 17:43:20 +08:00
|
|
|
|
医嘱类型:药品
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</text>
|
2025-02-25 17:23:40 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="time-people-thi">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<image class="time-people-img"
|
2025-02-25 17:23:40 +08:00
|
|
|
|
:src="darkFans?`/static/index/medium/howtododark.png`:`/static/index/medium/howtodo.png`" />
|
|
|
|
|
|
<text :class="darkFans?`time-people-font-dark`:`time-people-font`">
|
2025-03-03 17:43:20 +08:00
|
|
|
|
处置方式:肌肉注射
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<view class="time-people-thi">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<image class="time-people-img"
|
2025-02-25 17:23:40 +08:00
|
|
|
|
:src="darkFans?`/static/index/medium/useMed.png`:`/static/index/medium/yongyao.png`" />
|
|
|
|
|
|
<text :class="darkFans?`time-people-font-dark`:`time-people-font`">
|
2025-03-03 17:43:20 +08:00
|
|
|
|
用药类型:抗生素类
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</text>
|
2025-02-25 17:23:40 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view class="time-people-thi">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<image class="time-people-img"
|
2025-02-25 17:23:40 +08:00
|
|
|
|
:src="darkFans?`/static/index/medium/domanydark.png`:`/static/index/medium/domany.png`" />
|
|
|
|
|
|
<text :class="darkFans?`time-people-font-dark`:`time-people-font`">
|
2025-03-03 17:43:20 +08:00
|
|
|
|
执行方式:周期一日执行一次
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="time-people-thi">
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/darkicon/zhixingpeopledark.png`:`/static/index/cardicons/zhixing.png`" />
|
|
|
|
|
|
<text :class="darkFans?`time-people-font-dark`:`time-people-font`">
|
|
|
|
|
|
单人执行
|
|
|
|
|
|
</text>
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/medium/dopeopledark.png`:`/static/index/cardicons/zhifa.png`" />
|
|
|
|
|
|
<text :class="darkFans?`time-people-font-dark`:`time-people-font`">
|
|
|
|
|
|
赵宇
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<view class="time-button-view">
|
|
|
|
|
|
<view class="time-button-start">
|
|
|
|
|
|
开始服务
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view :class="darkFans?`time-button-end-dark`:`time-button-end`">
|
|
|
|
|
|
服务结束
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="right-container-photo">
|
|
|
|
|
|
<image class="right-container-photo-img"
|
|
|
|
|
|
:src="`/static/index/yiliao/project2.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`right-container-photo-text-dark`:`right-container-photo-text`">
|
|
|
|
|
|
脑膜炎(1/2)
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</swiper-item>
|
|
|
|
|
|
</swiper>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</swiper-item>
|
|
|
|
|
|
</swiper>
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view class="split-line-white-sec" :style="darkFans ? `background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #386997 50%, rgba(0, 0, 0, 0) 100%);`:``">
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<image v-if="darkFans" class="split-line-white-img"
|
|
|
|
|
|
:src="`/static/index/cardbgc/leftlight.png`" />
|
|
|
|
|
|
</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="right-huli-fir">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<image class="right-huli-shang" :src="`/static/index/hulilist/shang.png`" />
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<scroll-view v-if="!darkFans" :show-scrollbar="false" scroll-y="true" class="right-huli-view">
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<view v-for="(item,index) in mediumList" :key="index" class="right-huli-view-dis">
|
|
|
|
|
|
<image class="right-huli-img" :src="item.url" />
|
|
|
|
|
|
<text class="right-huli-text">{{item.name}}</text>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<div class="progress-bar-container" v-show="item.number !== 0">
|
|
|
|
|
|
<div :style="{width:`${item.number}%`}" class="progress-bar"></div>
|
|
|
|
|
|
</div>
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</view>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</scroll-view>
|
|
|
|
|
|
<scroll-view v-if="darkFans" :show-scrollbar="false" scroll-y="true" class="right-huli-view">
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<view v-for="(item,index) in mediumListdark" :key="index" class="right-huli-view-dis">
|
|
|
|
|
|
<image class="right-huli-img" :src="item.url" />
|
|
|
|
|
|
<text class="right-huli-text-dark">{{item.name}}</text>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
<div class="progress-bar-container" v-show="item.number !== 0">
|
|
|
|
|
|
<div :style="{width:`${item.number}%`}" class="progress-bar"></div>
|
|
|
|
|
|
</div>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
</view>
|
2025-02-20 17:21:36 +08:00
|
|
|
|
</scroll-view>
|
2025-02-18 17:11:31 +08:00
|
|
|
|
<image class="right-huli-xia" :src="`/static/index/hulilist/xia.png`" />
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view :class="darkFans ? `right-container-right-father-dark`:`right-container-right-father`"
|
|
|
|
|
|
>
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<view class="right-container-right-down-father">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<div class="right-container-fir-left-card-flex-sec">
|
|
|
|
|
|
<image class="right-container-fir-left-card-flex-sec-img"
|
|
|
|
|
|
:src="`/static/index/baojielei.png`" />
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<div class="right-container-fir-left-card-flex-sec-font" @click="showPopupthi">保洁类</div>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
|
|
|
|
|
<image class="right-container-fir-left-card-flex-sec-imgright-fir"
|
|
|
|
|
|
:src="`/static/index/baojieleft.png`" />
|
|
|
|
|
|
<image class="right-container-fir-left-card-flex-sec-imgright-sec"
|
|
|
|
|
|
:src="`/static/index/baojieright.png`" />
|
|
|
|
|
|
<view class="uni-margin-wrap">
|
|
|
|
|
|
<swiper :current="secondcurrentIndex" class="swiper" circular :indicator-dots="false"
|
|
|
|
|
|
:autoplay="false" :interval="4000" :duration="500">
|
|
|
|
|
|
<swiper-item class="swiper-item-flex" v-for="(item,index) in [1,2 ,3]" :key="index">
|
|
|
|
|
|
<view class="time-tra-thi">
|
|
|
|
|
|
<view class="time-tra-thi-zhixing">
|
|
|
|
|
|
<div class="time-tra-thi-zhixing-font">待执行
|
|
|
|
|
|
</div>
|
2025-02-19 17:33:12 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
<view :class="darkFans?`time-font-dark`:`time-font`">
|
|
|
|
|
|
10:00 - 10:10
|
|
|
|
|
|
</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view :class="darkFans?`time-text-dark`:`time-text`">
|
|
|
|
|
|
为老人提供口腔清洁器具，牙膏、牙刷及水杯，看护完成
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="time-people-two">
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<image class="time-people-img"
|
2025-02-27 17:15:17 +08:00
|
|
|
|
:src="darkFans?`/static/index/darkicon/zhixingpeopledark.png`:`/static/index/cardicons/zhixing.png`" />
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<text :class="darkFans?`time-people-font-dark`:`time-people-font`">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
单人执行
|
2025-02-19 17:33:12 +08:00
|
|
|
|
</text>
|
|
|
|
|
|
<image class="time-people-img"
|
2025-02-27 17:15:17 +08:00
|
|
|
|
:src="darkFans?`/static/index/medium/dopeopledark.png`:`/static/index/cardicons/zhifa.png`" />
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<text :class="darkFans?`time-people-font-dark`:`time-people-font`">
|
2025-02-19 17:33:12 +08:00
|
|
|
|
王金福 / 李贵田
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="time-button-view">
|
2025-02-19 17:33:12 +08:00
|
|
|
|
<view class="time-button-start">
|
|
|
|
|
|
开始服务
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view :class="darkFans?`time-button-end-dark`:`time-button-end`">
|
|
|
|
|
|
服务结束
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="time-tra-thi-photo">
|
|
|
|
|
|
<image class="time-tra-thi-photo-img" :src="`/static/index/project3.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-tra-thi-photo-font-dark`:`time-tra-thi-photo-font`">
|
|
|
|
|
|
更换纸尿裤
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</swiper-item>
|
|
|
|
|
|
</swiper>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</div>
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="under-father">
|
|
|
|
|
|
<view class="under-father-view" v-for="(item,index) in undericonList" :key="index"
|
|
|
|
|
|
@click="changeMenuUnder(index)">
|
|
|
|
|
|
<image class="under-father-light" src="/static/index/undericons/upguang.png"
|
|
|
|
|
|
v-show="index === undermenuIndex" />
|
2025-02-25 17:23:40 +08:00
|
|
|
|
<image class="under-father-img" :src="index === undermenuIndex ? item.targetUrl : item.url" />
|
|
|
|
|
|
</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<!-- 弹出层左上角 -->
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view v-if="isPopupVisible" class="popup-overlay" @click="closePopup"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{backgroundColor:`rgba(89, 109, 154, 0.5)`}:`{}`">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="popup-overlay-content" @click.stop
|
|
|
|
|
|
:style="{ width: widthCom + 'rpx',height: heightCom + 'rpx',top: topCom + 'rpx',left: leftCom + 'rpx' }">
|
|
|
|
|
|
<view class="right-container-fir-left-nav-open">
|
|
|
|
|
|
<view :class="darkFans?`right-container-fir-left-card-dark`:`right-container-fir-left-card`">
|
|
|
|
|
|
<image class="right-container-fir-left-card-hulilei" :src="`/static/index/hulilei.png`" />
|
|
|
|
|
|
<div class="right-container-fir-left-card-hulilei-font" @click="closePopup">护理类</div>
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<image v-if="darkFans" class="card-upfaguang"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{top:`680rpx`}:`{}`"
|
|
|
|
|
|
:src="`/static/index/cardbgc/uplight.png`" />
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="right-container-fir-left-card-main">
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view class="swiper savehundred">
|
|
|
|
|
|
<view class="swiper-item-flex" v-for="(item,index) in [1]" :key="index">
|
|
|
|
|
|
<view class="right-container-fir-left-card-flex"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{marginTop:`70rpx`}:{marginTop:`0rpx`}">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="uni-margin-wrap-fir">
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view class="swiper"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{height:`700rpx`}:`{}`">
|
|
|
|
|
|
<view class="swiper-item-flex" v-for="(item,index) in [1]"
|
|
|
|
|
|
:key="index">
|
2025-03-03 17:43:20 +08:00
|
|
|
|
<view class="right-container-fir-left-card-card"
|
|
|
|
|
|
style="margin-top: 100rpx;">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="right-container-fir-left-card-zhixing"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{top:`40rpx`,left:`1300rpx`}:`{}`">
|
|
|
|
|
|
<div class="right-container-fir-left-card-zhixing-font"
|
2025-03-03 17:43:20 +08:00
|
|
|
|
:style="isPopupVisiblefiropen?{top:`-60rpx`,left:`0rpx`,width: `150rpx`,height: `60rpx`,fontSize: `35rpx`,borderRadius: `8rpx`}:`{}`">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
待执行
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<image class="right-container-fir-left-card-img"
|
2025-03-04 17:29:52 +08:00
|
|
|
|
:style="isPopupVisiblefiropen?{width:`600rpx`,height:`500rpx`}:{marginTop:`-90rpx`}"
|
2025-02-28 17:27:27 +08:00
|
|
|
|
:src="`/static/index/teeth.png`" @click="closePopup" />
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="right-container-fir-left-card-main-laba-video">
|
|
|
|
|
|
<image class="right-container-fir-left-card-main-laba"
|
2025-03-03 17:43:20 +08:00
|
|
|
|
:style="isPopupVisiblefiropen?{width:`65rpx`,height:`65rpx`}:{}"
|
2025-02-27 17:15:17 +08:00
|
|
|
|
:src="darkFans?`/static/index/darkicon/labadark.png`:`/static/index/laba.png`" />
|
|
|
|
|
|
<text
|
2025-02-28 17:27:27 +08:00
|
|
|
|
:style="isPopupVisiblefiropen?{fontSize:`46rpx`,width:`400rpx`}:`{}`"
|
2025-02-27 17:15:17 +08:00
|
|
|
|
:class="darkFans?`right-container-fir-left-card-main-font-dark`:`right-container-fir-left-card-main-font`">
|
|
|
|
|
|
准备洁具（口腔）
|
|
|
|
|
|
</text>
|
|
|
|
|
|
<image class="right-container-fir-left-card-main-video"
|
2025-03-03 17:43:20 +08:00
|
|
|
|
:style="isPopupVisiblefiropen?{width:`65rpx`,height:`65rpx`}:{marginLeft:`-150rpx`}"
|
2025-02-27 17:15:17 +08:00
|
|
|
|
:src="darkFans?`/static/index/indexvideo.png`:`/static/index/indexvideo.png`" />
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<!-- <view class="split-line" style="height: 300rpx;" :style="isPopupVisiblefiropen?{marginTop:`200rpx`}:`{}`"
|
|
|
|
|
|
> -->
|
|
|
|
|
|
<!-- </view> -->
|
2025-03-03 17:43:20 +08:00
|
|
|
|
<view class="time-tra-fir"
|
2025-03-04 17:29:52 +08:00
|
|
|
|
:style="isPopupVisiblefiropen?`{}`:{marginTop:`0rpx`,marginLeft:`30rpx`}">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view :class="darkFans?`time-font-dark`:`time-font`"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{fontSize:`100rpx`}:`{}`">
|
|
|
|
|
|
10:00 - 10:10
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view :class="darkFans?`time-text-dark`:`time-text`"
|
2025-02-28 17:27:27 +08:00
|
|
|
|
:style="isPopupVisiblefiropen?{fontSize:`45rpx`,lineHeight: `70rpx`,width: `800rpx`,marginTop:`50rpx`,marginBottom:`50rpx`}:`{}`">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
为老人提供口腔清洁器具，牙膏、牙刷及水杯，看护完成
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="time-people-two"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{marginBottom:'60rpx'}:`{}`">
|
|
|
|
|
|
<view class="time-people-fir">
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/darkicon/zhixingpeopledark.png`:`/static/index/cardicons/zhixing.png`"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{width:`55rpx`,height:`55rpx`}:`{}`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-people-font-dark`:`time-people-font`"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{fontSize:`42rpx`,marginRight:'40rpx'}:`{}`">
|
|
|
|
|
|
单人执行
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="time-people-sec">
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/medium/dopeopledark.png`:`/static/index/cardicons/zhifa.png`"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{width:`55rpx`,height:`55rpx`}:`{}`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-people-font-dark`:`time-people-font`"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{fontSize:`42rpx`}:`{}`">
|
|
|
|
|
|
--
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
|
|
|
|
|
<view class="time-button-view">
|
|
|
|
|
|
<view class="time-button-start"
|
2025-02-28 17:27:27 +08:00
|
|
|
|
:style="isPopupVisiblefiropen?{width:`350rpx`,height:`110rpx`,borderRadius:`80rpx`,fontSize:`50rpx`}:`{}`">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
开始服务
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view
|
|
|
|
|
|
:class="darkFans?`time-button-end-dark`:`time-button-end`"
|
2025-02-28 17:27:27 +08:00
|
|
|
|
:style="isPopupVisiblefiropen?{width:`350rpx`,height:`110rpx`,borderRadius:`80rpx`,fontSize:`50rpx`}:`{}`">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
服务结束
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
|
|
|
|
|
</view>
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view class="split-line-white-right-left" :style="darkFans ? `background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #386997 50%, rgba(0, 0, 0, 0) 100%);`:``">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<image v-if="darkFans" class="split-line-white-img"
|
|
|
|
|
|
:src="`/static/index/cardbgc/leftlight.png`" />
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-03-04 17:29:52 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view class="right-huli-sec">
|
|
|
|
|
|
<image class="right-huli-shang" :src="`/static/index/hulilist/shang.png`" />
|
|
|
|
|
|
<scroll-view v-if="!darkFans" :show-scrollbar="false" scroll-y="true"
|
2025-03-03 17:43:20 +08:00
|
|
|
|
class="right-huli-view" :style="isPopupVisiblefiropen?{height:`600rpx`}:`{}`">
|
|
|
|
|
|
<view v-for="(item,index) in huliList" :key="index" class="right-huli-view-dis"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{height:`200rpx`}:`{}`">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<image class="right-huli-img" :src="item.url" />
|
|
|
|
|
|
<text class="right-huli-text">{{item.name}}</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</scroll-view>
|
|
|
|
|
|
<!-- 暗黑模式 -->
|
|
|
|
|
|
<scroll-view v-if="darkFans" :show-scrollbar="false" scroll-y="true"
|
2025-03-03 17:43:20 +08:00
|
|
|
|
class="right-huli-view" :style="isPopupVisiblefiropen?{height:`600rpx`}:`{}`">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<view v-for="(item,index) in huliListDark" :key="index"
|
2025-03-03 17:43:20 +08:00
|
|
|
|
class="right-huli-view-dis"
|
|
|
|
|
|
:style="isPopupVisiblefiropen?{height:`200rpx`}:`{}`">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
<image class="right-huli-img" :src="item.url" />
|
|
|
|
|
|
<text class="right-huli-text-dark">{{item.name}}</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</scroll-view>
|
|
|
|
|
|
<image class="right-huli-xia" :src="`/static/index/hulilist/xia.png`" />
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-25 17:23:40 +08:00
|
|
|
|
</view>
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</view>
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<!-- 弹出层左上角结束 -->
|
|
|
|
|
|
<!-- 弹出层左下角 -->
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view v-if="isPopupVisiblesec" class="popup-overlay" @click="closePopupsec"
|
|
|
|
|
|
:style="isPopupVisiblefiropensec?{backgroundColor:`rgba(89, 109, 154, 0.5)`}:`{}`">
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<view class="popup-overlay-content" @click.stop
|
|
|
|
|
|
:style="{ width: widthComsec + 'rpx',height: heightComsec + 'rpx',top: topComsec + 'rpx',left: leftComsec + 'rpx' }">
|
|
|
|
|
|
<view :class="darkFans?`right-container-left-dark`:`right-container-left`">
|
|
|
|
|
|
<image class="right-container-left-type" :src="`/static/index/yiliao/yiliaolei.png`" />
|
|
|
|
|
|
<div class="right-container-left-font" @click="closePopupsec">医疗类</div>
|
2025-03-03 17:43:20 +08:00
|
|
|
|
<image v-if="darkFans" class="card-upfaguang-down"
|
|
|
|
|
|
:style="isPopupVisiblefiropensec?{left:`1000rpx`,top:`680rpx`}:`{}`"
|
|
|
|
|
|
:src="`/static/index/cardbgc/uplight.png`" />
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view class="swiper savehundred">
|
|
|
|
|
|
<view class="swiper-item-flex" v-for="(item,index) in [1]" :key="index">
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<div class="right-container-fir-left-card-flex-sec">
|
|
|
|
|
|
<view class="uni-margin-wrap">
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view class="swiper">
|
|
|
|
|
|
<view class="swiper-item-flex" v-for="(item,index) in [1]" :key="index">
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<div class="right-container-left-font-spec"
|
2025-03-04 17:29:52 +08:00
|
|
|
|
:style="isPopupVisiblefiropensec?{top:`160rpx`,left:`900rpx`,width: `150rpx`,height: `60rpx`,fontSize: `35rpx`,borderRadius: `8rpx`}:`{}`">
|
2025-02-28 17:27:27 +08:00
|
|
|
|
进行中
|
|
|
|
|
|
</div>
|
|
|
|
|
|
<view class="time-tra-sec"
|
2025-03-04 17:29:52 +08:00
|
|
|
|
:style="isPopupVisiblefiropensec?{width:`800rpx`,marginTop:`70rpx`,marginLeft:`120rpx`}:`{}`">
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<view :style="isPopupVisiblefiropensec?{fontSize:`120rpx`}:`{}`"
|
|
|
|
|
|
:class="darkFans?`time-font-dark`:`time-font`">
|
|
|
|
|
|
10:00 - 10:10
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view
|
|
|
|
|
|
:class="!isPopupVisiblefiropensec?`time-people-thi`:`time-people-thi-change`">
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/medium/doctorsaydark.png`:`/static/index/medium/doctorsay.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-people-font-dark`:`time-people-font`">
|
2025-03-04 17:29:52 +08:00
|
|
|
|
医嘱类型:药品
|
2025-02-28 17:27:27 +08:00
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view
|
|
|
|
|
|
:class="!isPopupVisiblefiropensec?`time-people-thi`:`time-people-thi-change`">
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/medium/howtododark.png`:`/static/index/medium/howtodo.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-people-font-dark`:`time-people-font`">
|
2025-03-04 17:29:52 +08:00
|
|
|
|
处置方式:肌肉注射
|
2025-02-28 17:27:27 +08:00
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view
|
|
|
|
|
|
:class="!isPopupVisiblefiropensec?`time-people-thi`:`time-people-thi-change`">
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/medium/useMed.png`:`/static/index/medium/yongyao.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-people-font-dark`:`time-people-font`">
|
2025-03-04 17:29:52 +08:00
|
|
|
|
用药类型:抗生素类
|
2025-02-28 17:27:27 +08:00
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view
|
|
|
|
|
|
:class="!isPopupVisiblefiropensec?`time-people-thi`:`time-people-thi-change`">
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/medium/domanydark.png`:`/static/index/medium/domany.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-people-font-dark`:`time-people-font`">
|
2025-03-04 17:29:52 +08:00
|
|
|
|
执行方式:周期一日执行一次
|
2025-02-28 17:27:27 +08:00
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view
|
|
|
|
|
|
:class="!isPopupVisiblefiropensec?`time-people-thi`:`time-people-thi-change`">
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/darkicon/zhixingpeopledark.png`:`/static/index/cardicons/zhixing.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-people-font-dark`:`time-people-font`">
|
|
|
|
|
|
单人执行
|
|
|
|
|
|
</text>
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:src="darkFans?`/static/index/medium/dopeopledark.png`:`/static/index/cardicons/zhifa.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-people-font-dark`:`time-people-font`">
|
|
|
|
|
|
赵宇
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
2025-03-03 17:43:20 +08:00
|
|
|
|
<view class="time-button-view"
|
|
|
|
|
|
:style="isPopupVisiblefiropensec?{marginTop:`50rpx`}:`{}`">
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<view class="time-button-start"
|
|
|
|
|
|
:style="isPopupVisiblefiropensec?{width:`350rpx`,height:`110rpx`,borderRadius:`80rpx`,fontSize:`50rpx`}:`{}`">
|
|
|
|
|
|
开始服务
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view :class="darkFans?`time-button-end-dark`:`time-button-end`"
|
|
|
|
|
|
:style="isPopupVisiblefiropensec?{width:`350rpx`,height:`110rpx`,borderRadius:`80rpx`,fontSize:`50rpx`}:`{}`">
|
|
|
|
|
|
服务结束
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view
|
|
|
|
|
|
:class="isPopupVisiblefiropensec?`right-container-photo-change`:`right-container-photo`">
|
|
|
|
|
|
<image class="right-container-photo-img"
|
|
|
|
|
|
:src="`/static/index/yiliao/project2.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`right-container-photo-text-dark`:`right-container-photo-text`">
|
|
|
|
|
|
脑膜炎(1/2)
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
2025-03-04 17:29:52 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
2025-02-28 17:27:27 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</div>
|
2025-03-04 17:29:52 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="split-line-white-sec" :style="darkFans ? `background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #386997 50%, rgba(0, 0, 0, 0) 100%);`:``">
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<image v-if="darkFans" class="split-line-white-img"
|
|
|
|
|
|
:src="`/static/index/cardbgc/leftlight.png`" />
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="right-huli-fir" :style="isPopupVisiblefiropensec?{width:`350rpx`}:`{}`">
|
|
|
|
|
|
<image class="right-huli-shang" :src="`/static/index/hulilist/shang.png`" />
|
|
|
|
|
|
<scroll-view v-if="!darkFans" :show-scrollbar="false" scroll-y="true"
|
|
|
|
|
|
class="right-huli-view">
|
|
|
|
|
|
<view v-for="(item,index) in mediumList" :key="index" class="right-huli-view-dis">
|
|
|
|
|
|
<image class="right-huli-img" :src="item.url" />
|
|
|
|
|
|
<text class="right-huli-text">{{item.name}}</text>
|
|
|
|
|
|
<div class="progress-bar-container" v-show="item.number !== 0">
|
|
|
|
|
|
<div :style="{width:`${item.number}%`}" class="progress-bar"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</scroll-view>
|
|
|
|
|
|
<scroll-view v-if="darkFans" :show-scrollbar="false" scroll-y="true"
|
|
|
|
|
|
class="right-huli-view">
|
|
|
|
|
|
<view v-for="(item,index) in mediumListdark" :key="index" class="right-huli-view-dis">
|
|
|
|
|
|
<image class="right-huli-img" :src="item.url" />
|
|
|
|
|
|
<text class="right-huli-text-dark">{{item.name}}</text>
|
|
|
|
|
|
<div class="progress-bar-container" v-show="item.number !== 0">
|
|
|
|
|
|
<div :style="{width:`${item.number}%`}" class="progress-bar"></div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</scroll-view>
|
|
|
|
|
|
<image class="right-huli-xia" :src="`/static/index/hulilist/xia.png`" />
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<!-- 弹出层左下角结束 -->
|
|
|
|
|
|
<!-- 弹出层右下角 -->
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view v-if="isPopupVisiblethi" class="popup-overlay" @click="closePopupthi"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{backgroundColor:`rgba(89, 109, 154, 0.5)`}:`{}`">
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<view class="popup-overlay-content" @click.stop
|
|
|
|
|
|
:style="{ width: widthComthi + 'rpx',height: heightComthi + 'rpx',top: topComthi + 'rpx',left: leftComthi + 'rpx' }">
|
2025-03-04 17:29:52 +08:00
|
|
|
|
<view :class="darkFans ? `right-container-right-father-dark`:`right-container-right-father`">
|
2025-03-03 17:43:20 +08:00
|
|
|
|
<view class="right-container-right-down-father">
|
|
|
|
|
|
<div class="right-container-fir-left-card-flex-sec">
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<image class="right-container-fir-left-card-flex-sec-img"
|
|
|
|
|
|
:src="`/static/index/baojielei.png`" />
|
|
|
|
|
|
<div class="right-container-fir-left-card-flex-sec-font" @click="closePopupthi">保洁类
|
|
|
|
|
|
</div>
|
2025-03-03 17:43:20 +08:00
|
|
|
|
<view class="uni-margin-wrap"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{marginLeft:`100rpx`}:`{}`">
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<div class="swiper" circular :indicator-dots="false" disable-touch>
|
|
|
|
|
|
<div class="swiper-item-flex" v-for="(item,index) in [1]" :key="index">
|
|
|
|
|
|
<view class="time-tra-thi-open"
|
2025-03-04 17:29:52 +08:00
|
|
|
|
:style="isPopupVisiblefiropenthi?{width:`800rpx`,marginLeft:`150rpx`}:`{}`">
|
2025-02-28 17:27:27 +08:00
|
|
|
|
<view class="time-tra-thi-zhixing">
|
|
|
|
|
|
<div class="time-tra-thi-zhixing-font"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{top:`90rpx`,left:`200rpx`,width: `150rpx`,height: `60rpx`,fontSize: `35rpx`,borderRadius: `8rpx`}:`{}`">
|
|
|
|
|
|
待执行
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view :class="darkFans?`time-font-dark`:`time-font`"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{fontSize:`100rpx`}:`{}`">
|
|
|
|
|
|
10:00 - 10:10
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view :class="darkFans?`time-text-dark`:`time-text`"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{width:`800rpx`,fontSize:`45rpx`,marginTop:`100rpx`,lineHeight:`60rpx`}:`{}`">
|
|
|
|
|
|
为老人提供口腔清洁器具，牙膏、牙刷及水杯，看护完成
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="time-people-two"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{marginTop:`100rpx`,marginBottom:`100rpx`}:`{}`">
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{width:`55rpx`,height:`55rpx`}:`{}`"
|
|
|
|
|
|
:src="darkFans?`/static/index/darkicon/zhixingpeopledark.png`:`/static/index/cardicons/zhixing.png`" />
|
|
|
|
|
|
<text :class="darkFans?`time-people-font-dark`:`time-people-font`"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{fontSize:`42rpx`,marginRight:'40rpx'}:`{}`">
|
|
|
|
|
|
单人执行
|
|
|
|
|
|
</text>
|
|
|
|
|
|
<image class="time-people-img"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{width:`55rpx`,height:`55rpx`}:`{}`"
|
|
|
|
|
|
:src="darkFans?`/static/index/medium/dopeopledark.png`:`/static/index/cardicons/zhifa.png`" />
|
|
|
|
|
|
<text :class="darkFans?`time-people-font-dark`:`time-people-font`"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{fontSize:`42rpx`,marginRight:'40rpx'}:`{}`">
|
|
|
|
|
|
王金福 / 李贵田
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view class="time-button-view">
|
|
|
|
|
|
<view class="time-button-start"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{width:`350rpx`,height:`110rpx`,borderRadius:`80rpx`,fontSize:`50rpx`}:`{}`">
|
|
|
|
|
|
开始服务
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view :class="darkFans?`time-button-end-dark`:`time-button-end`"
|
|
|
|
|
|
:style="isPopupVisiblefiropenthi?{width:`350rpx`,height:`110rpx`,borderRadius:`80rpx`,fontSize:`50rpx`}:`{}`">
|
|
|
|
|
|
服务结束
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<view
|
|
|
|
|
|
:class="isPopupVisiblefiropenthi?`time-tra-thi-photo-change`:`time-tra-thi-photo`">
|
2025-03-03 17:43:20 +08:00
|
|
|
|
<image class="time-tra-thi-photo-img"
|
|
|
|
|
|
style="margin-top: 150rpx;margin-left: -80rpx;"
|
2025-02-28 17:27:27 +08:00
|
|
|
|
:src="`/static/index/project3.png`" />
|
|
|
|
|
|
<text
|
|
|
|
|
|
:class="darkFans?`time-tra-thi-photo-font-dark`:`time-tra-thi-photo-font`">
|
|
|
|
|
|
更换纸尿裤
|
|
|
|
|
|
</text>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</div>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
<!-- 右下角结束 -->
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</view>
|
|
|
|
|
|
</view>
|
|
|
|
|
|
</template>
|
|
|
|
|
|
|
|
|
|
|
|
<script setup lang="ts">
|
2025-02-27 17:15:17 +08:00
|
|
|
|
import { ref, onMounted, onBeforeUnmount, computed, nextTick } from 'vue';
|
|
|
|
|
|
|
2025-02-28 17:27:27 +08:00
|
|
|
|
//点击后动画效果（左上角）
|
2025-02-27 17:15:17 +08:00
|
|
|
|
const isPopupVisible = ref(false);
|
|
|
|
|
|
const widthCom = ref(1320);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
const heightCom = ref(540);
|
2025-03-04 17:29:52 +08:00
|
|
|
|
const topCom = ref(145);
|
2025-02-27 17:15:17 +08:00
|
|
|
|
const leftCom = ref(233);
|
|
|
|
|
|
const isPopupVisiblefiropen = ref(false);
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-28 17:27:27 +08:00
|
|
|
|
//点击后动画效果（左下角）
|
|
|
|
|
|
const isPopupVisiblesec = ref(false);
|
|
|
|
|
|
const widthComsec = ref(1150);
|
|
|
|
|
|
const heightComsec = ref(630);
|
|
|
|
|
|
const topComsec = ref(730);
|
|
|
|
|
|
const leftComsec = ref(233);
|
|
|
|
|
|
const isPopupVisiblefiropensec = ref(false);
|
|
|
|
|
|
|
|
|
|
|
|
//点击后动画效果（右下角）
|
|
|
|
|
|
const isPopupVisiblethi = ref(false);
|
|
|
|
|
|
const widthComthi = ref(880);
|
|
|
|
|
|
const heightComthi = ref(630);
|
|
|
|
|
|
const topComthi = ref(730);
|
|
|
|
|
|
const leftComthi = ref(1420);
|
|
|
|
|
|
const isPopupVisiblefiropenthi = ref(false);
|
2025-02-19 17:33:12 +08:00
|
|
|
|
// 定义响应式数据现在时间
|
|
|
|
|
|
const currentTime = ref('');
|
|
|
|
|
|
const fullDate = ref('');
|
|
|
|
|
|
const weekDay = ref('');
|
2025-02-18 17:11:31 +08:00
|
|
|
|
// 定义 Link 类型
|
|
|
|
|
|
type Link = {
|
|
|
|
|
|
url : string;
|
|
|
|
|
|
targetUrl : string;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// 初始化左侧菜单列表
|
|
|
|
|
|
const iconList = ref<Link[]>([
|
|
|
|
|
|
{ url: '/static/index/lefticon/index.png', targetUrl: '/static/index/lefticontarget/blueindex.png' },
|
|
|
|
|
|
{ url: '/static/index/lefticon/nurse.png', targetUrl: '/static/index/lefticontarget/bluenurse.png' },
|
|
|
|
|
|
{ url: '/static/index/lefticon/doctor.png', targetUrl: '/static/index/lefticontarget/bluedoctor.png' },
|
2025-02-25 17:23:40 +08:00
|
|
|
|
{ url: '/static/index/lefticon/give.png', targetUrl: '/static/index/lefticontarget/givedark.png' },
|
2025-02-18 17:11:31 +08:00
|
|
|
|
{ url: '/static/index/lefticon/wifi.png', targetUrl: '/static/index/lefticontarget/bluewifi.png' },
|
|
|
|
|
|
{ url: '/static/index/lefticon/back.png', targetUrl: '/static/index/lefticontarget/blueback.png' }
|
|
|
|
|
|
]);
|
2025-02-25 17:23:40 +08:00
|
|
|
|
// 初始化下面侧单列表
|
|
|
|
|
|
const undericonList = ref<Link[]>([
|
|
|
|
|
|
{ url: '/static/index/undericons/alarm.png', targetUrl: '/static/index/undericons/alarmdark.png' },
|
|
|
|
|
|
{ url: '/static/index/undericons/linshitime.png', targetUrl: '/static/index/undericons/linshitimedark.png' },
|
2025-02-27 17:15:17 +08:00
|
|
|
|
{ url: '/static/index/darkicon/zhaomingdark.png', targetUrl: '/static/index/roomicons/zhaomingtar.png' },
|
|
|
|
|
|
{ url: '/static/index/darkicon/kontiaodark.png', targetUrl: '/static/index/roomicons/kongtiaotar.png' },
|
|
|
|
|
|
{ url: '/static/index/darkicon/nuanfengdark.png', targetUrl: '/static/index/roomicons/nuanfengtar.png' },
|
|
|
|
|
|
{ url: '/static/index/darkicon/dianqidark.png', targetUrl: '/static/index/roomicons/dianqitar.png' },
|
2025-02-25 17:23:40 +08:00
|
|
|
|
]);
|
2025-02-18 17:11:31 +08:00
|
|
|
|
// 定义 Link 类型
|
|
|
|
|
|
type huliListType = {
|
|
|
|
|
|
url : string;
|
|
|
|
|
|
name : string
|
|
|
|
|
|
}
|
2025-02-20 17:21:36 +08:00
|
|
|
|
// 定义 药品类型
|
|
|
|
|
|
type medType = {
|
|
|
|
|
|
url : string;
|
|
|
|
|
|
name : string,
|
|
|
|
|
|
number : number
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
// 初始化第一个卡片列表
|
|
|
|
|
|
const huliList = ref<huliListType[]>([
|
|
|
|
|
|
{ url: '/static/index/hulilist/zhuandan.png', name: "转单执行" },
|
|
|
|
|
|
{ url: '/static/index/hulilist/xiezhu.png', name: "协助执行" },
|
2025-02-28 17:27:27 +08:00
|
|
|
|
{ url: '/static/index/hulilist/zhongdian.png', name: "重点追踪" },
|
2025-02-19 17:33:12 +08:00
|
|
|
|
]);
|
|
|
|
|
|
// 初始化第一个卡片列表 暗黑模式
|
|
|
|
|
|
const huliListDark = ref<huliListType[]>([
|
|
|
|
|
|
{ url: '/static/index/darkicon/zhuandandark.png', name: "转单执行" },
|
|
|
|
|
|
{ url: '/static/index/darkicon/xiezhudark.png', name: "协助执行" },
|
2025-02-28 17:27:27 +08:00
|
|
|
|
{ url: '/static/index/darkicon/zhongdiandark.png', name: "重点追踪" },
|
2025-02-18 17:11:31 +08:00
|
|
|
|
]);
|
|
|
|
|
|
// 初始化第二排第一个卡片列表
|
2025-02-20 17:21:36 +08:00
|
|
|
|
const mediumList = ref<medType[]>([
|
|
|
|
|
|
{ url: '/static/index/medium/yaopin.png', name: "药品信息", number: 0 },
|
|
|
|
|
|
{ url: '/static/index/medium/qingling.png', name: "请领指令", number: 60 },
|
|
|
|
|
|
{ url: '/static/index/medium/peiyao.png', name: "配药指令", number: 100 },
|
|
|
|
|
|
{ url: '/static/index/medium/xinxi.png', name: "信息反馈", number: 0 },
|
|
|
|
|
|
{ url: '/static/index/medium/xinxi.png', name: "信息反馈2", number: 0 },
|
2025-02-18 17:11:31 +08:00
|
|
|
|
]);
|
2025-02-19 17:33:12 +08:00
|
|
|
|
// 初始化第二排第一个卡片列表 暗黑模式
|
2025-02-20 17:21:36 +08:00
|
|
|
|
const mediumListdark = ref<medType[]>([
|
|
|
|
|
|
{ url: '/static/index/darkicon/yaopindark.png', name: "药品信息", number: 55 },
|
|
|
|
|
|
{ url: '/static/index/darkicon/qinglingdark.png', name: "请领指令", number: 10 },
|
|
|
|
|
|
{ url: '/static/index/darkicon/peiyaodark.png', name: "配药指令", number: 100 },
|
|
|
|
|
|
{ url: '/static/index/darkicon/xinxidark.png', name: "信息反馈", number: 15 },
|
|
|
|
|
|
{ url: '/static/index/darkicon/xinxidark.png', name: "信息反馈2", number: 20 },
|
2025-02-19 17:33:12 +08:00
|
|
|
|
]);
|
2025-02-18 17:11:31 +08:00
|
|
|
|
// 定义 Link 类型
|
|
|
|
|
|
type roomBtttonType = {
|
|
|
|
|
|
url : string;
|
|
|
|
|
|
targetUrl : string;
|
|
|
|
|
|
name : string
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// 初始化第二个卡片列表
|
|
|
|
|
|
const roomBtttonList = ref<roomBtttonType[]>([
|
|
|
|
|
|
{ url: '/static/index/roomicons/zhaoming.png', targetUrl: '/static/index/roomicons/zhaomingtar.png', name: "照明" },
|
|
|
|
|
|
{ url: '/static/index/roomicons/kongtiao.png', targetUrl: '/static/index/roomicons/kongtiaotar.png', name: "空调" },
|
|
|
|
|
|
{ url: '/static/index/roomicons/nuanfeng.png', targetUrl: '/static/index/roomicons/nuanfengtar.png', name: "暖风" },
|
|
|
|
|
|
{ url: '/static/index/roomicons/dianqi.png', targetUrl: '/static/index/roomicons/dianqitar.png', name: "电器" },
|
|
|
|
|
|
]);
|
2025-02-19 17:33:12 +08:00
|
|
|
|
// 初始化第二个卡片列表 暗黑模式
|
|
|
|
|
|
const roomBtttonListdark = ref<roomBtttonType[]>([
|
|
|
|
|
|
{ url: '/static/index/darkicon/zhaomingdark.png', targetUrl: '/static/index/roomicons/zhaomingtar.png', name: "照明" },
|
|
|
|
|
|
{ url: '/static/index/darkicon/kontiaodark.png', targetUrl: '/static/index/roomicons/kongtiaotar.png', name: "空调" },
|
|
|
|
|
|
{ url: '/static/index/darkicon/nuanfengdark.png', targetUrl: '/static/index/roomicons/nuanfengtar.png', name: "暖风" },
|
|
|
|
|
|
{ url: '/static/index/darkicon/dianqidark.png', targetUrl: '/static/index/roomicons/dianqitar.png', name: "电器" },
|
|
|
|
|
|
]);
|
2025-02-18 17:11:31 +08:00
|
|
|
|
// 当前选中的菜单索引
|
|
|
|
|
|
const menuIndex = ref<number>(0);
|
2025-02-25 17:23:40 +08:00
|
|
|
|
const undermenuIndex = ref<number>(0);
|
2025-02-18 17:11:31 +08:00
|
|
|
|
// 暗黑模式
|
|
|
|
|
|
const darkFans = ref<boolean>(false);
|
2025-02-25 17:23:40 +08:00
|
|
|
|
const underFans = ref<boolean>(false);
|
2025-02-18 17:11:31 +08:00
|
|
|
|
// 当前选中的菜单索引
|
|
|
|
|
|
const roomTar = ref<number[]>([]);
|
2025-02-19 17:33:12 +08:00
|
|
|
|
//滑块按钮
|
|
|
|
|
|
const firstcurrentIndex = ref<number>(0);
|
2025-02-20 17:21:36 +08:00
|
|
|
|
const firstcurrentIndexup = ref<number>(0);
|
2025-02-27 17:15:17 +08:00
|
|
|
|
const secondcurrentIndexup = ref<number>(0);
|
2025-02-19 17:33:12 +08:00
|
|
|
|
const secondcurrentIndex = ref<number>(0);
|
|
|
|
|
|
const thirdcurrentIndex = ref<number>(0);
|
2025-02-18 17:11:31 +08:00
|
|
|
|
// 变更菜单
|
|
|
|
|
|
const changeMenu = (index : number) => {
|
|
|
|
|
|
menuIndex.value = index;
|
|
|
|
|
|
};
|
2025-02-25 17:23:40 +08:00
|
|
|
|
// 变更底部菜单
|
|
|
|
|
|
const changeMenuUnder = (index : number) => {
|
|
|
|
|
|
undermenuIndex.value = index;
|
|
|
|
|
|
};
|
2025-02-18 17:11:31 +08:00
|
|
|
|
const saveItem = (index : number) => {
|
|
|
|
|
|
if (roomTar.value.includes(index)) {
|
|
|
|
|
|
let array = []
|
|
|
|
|
|
roomTar.value.forEach((res : number) => {
|
|
|
|
|
|
if (res !== index) {
|
|
|
|
|
|
array.push(res)
|
|
|
|
|
|
}
|
|
|
|
|
|
})
|
|
|
|
|
|
roomTar.value = array
|
|
|
|
|
|
} else {
|
|
|
|
|
|
roomTar.value.push(index)
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
// 更新时间、日期和星期的方法
|
|
|
|
|
|
const updateTime = () => {
|
|
|
|
|
|
const now = new Date();
|
|
|
|
|
|
|
|
|
|
|
|
// 获取当前时间的时分
|
|
|
|
|
|
const hours = now.getHours().toString().padStart(2, '0');
|
|
|
|
|
|
const minutes = now.getMinutes().toString().padStart(2, '0');
|
|
|
|
|
|
currentTime.value = `${hours}:${minutes}`;
|
|
|
|
|
|
|
|
|
|
|
|
// 获取完整的日期（年/月/日）
|
|
|
|
|
|
const year = now.getFullYear();
|
|
|
|
|
|
const month = (now.getMonth() + 1).toString().padStart(2, '0');
|
|
|
|
|
|
const day = now.getDate().toString().padStart(2, '0');
|
|
|
|
|
|
fullDate.value = `${year}年${month}月${day}日`;
|
|
|
|
|
|
|
|
|
|
|
|
// 获取星期几
|
|
|
|
|
|
const weekDays = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六'];
|
|
|
|
|
|
const week = weekDays[now.getDay()];
|
|
|
|
|
|
weekDay.value = week;
|
|
|
|
|
|
};
|
2025-02-20 17:21:36 +08:00
|
|
|
|
//给轮播图用的
|
|
|
|
|
|
const onSwiperChange = (event : any) => {
|
|
|
|
|
|
firstcurrentIndexup.value = event.detail.current;
|
|
|
|
|
|
};
|
2025-02-27 17:15:17 +08:00
|
|
|
|
const onSwiperChangesec = (event : any) => {
|
|
|
|
|
|
secondcurrentIndexup.value = event.detail.current;
|
|
|
|
|
|
};
|
2025-02-20 17:21:36 +08:00
|
|
|
|
const gotoLogin = () => {
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-02-28 17:27:27 +08:00
|
|
|
|
//动画的点击触发（左上角）
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
|
|
|
|
|
const showPopup = () => {
|
|
|
|
|
|
isPopupVisible.value = true;
|
|
|
|
|
|
setTimeout(() => {
|
2025-03-04 17:29:52 +08:00
|
|
|
|
widthCom.value = 1900;
|
|
|
|
|
|
heightCom.value = 1080;
|
|
|
|
|
|
topCom.value = 145;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
leftCom.value = 233;
|
|
|
|
|
|
isPopupVisiblefiropen.value = true;
|
2025-03-03 17:43:20 +08:00
|
|
|
|
}, 10)
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
const closePopup = () => {
|
|
|
|
|
|
widthCom.value = 1320;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
heightCom.value = 540;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
topCom.value = 145;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
leftCom.value = 233;
|
|
|
|
|
|
isPopupVisiblefiropen.value = false;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
isPopupVisible.value = false; ''
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
2025-02-28 17:27:27 +08:00
|
|
|
|
//动画的点击触发（左下角）
|
|
|
|
|
|
|
|
|
|
|
|
const showPopupsec = () => {
|
|
|
|
|
|
isPopupVisiblesec.value = true;
|
|
|
|
|
|
setTimeout(() => {
|
2025-03-04 17:29:52 +08:00
|
|
|
|
widthComsec.value = 1900;
|
|
|
|
|
|
heightComsec.value = 1080;
|
|
|
|
|
|
topComsec.value = 320;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
leftComsec.value = 233;
|
|
|
|
|
|
isPopupVisiblefiropensec.value = true;
|
2025-03-03 17:43:20 +08:00
|
|
|
|
}, 10)
|
2025-02-28 17:27:27 +08:00
|
|
|
|
}
|
|
|
|
|
|
const closePopupsec = () => {
|
|
|
|
|
|
widthComsec.value = 1150;
|
|
|
|
|
|
heightComsec.value = 630;
|
|
|
|
|
|
topComsec.value = 730;
|
|
|
|
|
|
leftComsec.value = 233;
|
|
|
|
|
|
isPopupVisiblefiropensec.value = false;
|
|
|
|
|
|
isPopupVisiblesec.value = false;
|
|
|
|
|
|
}
|
|
|
|
|
|
//动画的点击触发（右下角）
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-02-28 17:27:27 +08:00
|
|
|
|
const showPopupthi = () => {
|
|
|
|
|
|
isPopupVisiblethi.value = true;
|
|
|
|
|
|
setTimeout(() => {
|
2025-03-04 17:29:52 +08:00
|
|
|
|
widthComthi.value = 1900;
|
|
|
|
|
|
heightComthi.value = 1080;
|
|
|
|
|
|
topComthi.value = 320;
|
|
|
|
|
|
leftComthi.value = 380;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
isPopupVisiblefiropenthi.value = true;
|
2025-03-03 17:43:20 +08:00
|
|
|
|
}, 10)
|
2025-02-28 17:27:27 +08:00
|
|
|
|
}
|
|
|
|
|
|
const closePopupthi = () => {
|
|
|
|
|
|
widthComthi.value = 880;
|
|
|
|
|
|
heightComthi.value = 630;
|
|
|
|
|
|
topComthi.value = 730;
|
|
|
|
|
|
leftComthi.value = 1420;
|
|
|
|
|
|
isPopupVisiblefiropenthi.value = false;
|
|
|
|
|
|
isPopupVisiblethi.value = false;
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
// 生命周期钩子
|
|
|
|
|
|
onMounted(() => {
|
2025-02-19 17:33:12 +08:00
|
|
|
|
updateTime();
|
|
|
|
|
|
// 每秒更新一次时间
|
|
|
|
|
|
setInterval(updateTime, 1000);
|
|
|
|
|
|
});
|
|
|
|
|
|
// 在组件销毁时清除定时器
|
|
|
|
|
|
onBeforeUnmount(() => {
|
|
|
|
|
|
clearInterval(updateTime);
|
2025-02-18 17:11:31 +08:00
|
|
|
|
});
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
|
|
<style lang="less" scoped>
|
|
|
|
|
|
.backgroundContainer {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100vh;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
background-image: url('/static/index/lightbgcnew.png');
|
2025-02-18 17:11:31 +08:00
|
|
|
|
background-size: cover;
|
|
|
|
|
|
background-position: center center;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-02-18 17:11:31 +08:00
|
|
|
|
//暗黑模式
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.darkbackgroundContainer {
|
2025-02-18 17:11:31 +08:00
|
|
|
|
display: flex;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100vh;
|
|
|
|
|
|
background-image: url('/static/index/background.png');
|
|
|
|
|
|
background-size: cover;
|
|
|
|
|
|
background-position: center center;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-02-18 17:11:31 +08:00
|
|
|
|
.right-container {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100vh;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-sec {
|
2025-02-28 17:27:27 +08:00
|
|
|
|
|
2025-02-18 17:11:31 +08:00
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
position: relative;
|
|
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
.right-container-left-font-spec {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 180rpx;
|
|
|
|
|
|
left: 580rpx;
|
|
|
|
|
|
width: 100rpx;
|
|
|
|
|
|
height: 40rpx;
|
|
|
|
|
|
font-size: 25rpx;
|
|
|
|
|
|
border-radius: 5rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
background-color: rgb(52, 198, 120);
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-20 17:21:36 +08:00
|
|
|
|
.right-container-fir-left-carousel {
|
|
|
|
|
|
position: absolute;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
right: 245rpx;
|
|
|
|
|
|
top: 17rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
|
|
|
|
|
.carousel {
|
|
|
|
|
|
position: relative;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 30rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
/* 轮播图的宽度 */
|
2025-02-27 17:15:17 +08:00
|
|
|
|
height: 80rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
/* 轮播图的高度 */
|
2025-02-20 17:21:36 +08:00
|
|
|
|
/* 背景色（示例） */
|
|
|
|
|
|
.dots {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 50%;
|
|
|
|
|
|
right: 10rpx;
|
|
|
|
|
|
transform: translateY(-50%);
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: column;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
gap: 7rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
|
|
|
|
|
.dot {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 10rpx;
|
|
|
|
|
|
height: 10rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
border-radius: 50%;
|
|
|
|
|
|
background-color: #657494;
|
|
|
|
|
|
/* 默认未激活的颜色 */
|
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
transition: background-color 0.3s ease;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.dot-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 10rpx;
|
|
|
|
|
|
height: 10rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
border-radius: 50%;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
/* 默认未激活的颜色 */
|
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
transition: background-color 0.3s ease;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.dot.active {
|
|
|
|
|
|
background-color: #01A0FE;
|
|
|
|
|
|
/* 激活的颜色 */
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-father-dark {
|
2025-02-18 17:11:31 +08:00
|
|
|
|
margin-left: 2%;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
width: 41%;
|
|
|
|
|
|
height: 630rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
border-radius: 45rpx;
|
|
|
|
|
|
background-color: rgb(22, 48, 76);
|
|
|
|
|
|
border: 2rpx solid transparent;
|
|
|
|
|
|
background:
|
|
|
|
|
|
url('/static/index/cardbgc/bgcdark.png') padding-box,
|
|
|
|
|
|
linear-gradient(45deg, #9bc4f8, #285399, #9bc4f8, #285399, #9bc4f8) border-box;
|
|
|
|
|
|
background-clip: padding-box, border-box;
|
|
|
|
|
|
background-color: rgba(12, 25, 47, 0.1);
|
|
|
|
|
|
/* 背景颜色 #f4f9ff，透明度 70% */
|
2025-02-18 17:11:31 +08:00
|
|
|
|
/* 背景颜色 #f4f9ff，透明度 70% */
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
|
flex-direction: column;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
overflow: hidden;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.uni-margin-wrap {
|
|
|
|
|
|
margin-top: 200rpx;
|
|
|
|
|
|
width: 1200rpx;
|
|
|
|
|
|
// width: 100%;
|
|
|
|
|
|
|
|
|
|
|
|
.swiper {
|
|
|
|
|
|
height: 900rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.swiper-item-flex {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.swiper-item {
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
height: 300rpx;
|
|
|
|
|
|
line-height: 300rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
.time-tra-next {
|
2025-02-18 17:11:31 +08:00
|
|
|
|
height: 100%;
|
|
|
|
|
|
width: 700rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
.time-button-view-fin {
|
2025-02-18 17:11:31 +08:00
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-top: 50rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-left: -50rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
|
|
|
|
|
.time-button-start {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
width: 220rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 80rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
background: linear-gradient(to top, #047ADB, #0EA7DD);
|
|
|
|
|
|
border-left: 2rpx solid #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
color: #fff;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 32rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
margin-right: 25rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-end {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
width: 220rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 80rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 32rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.time-button-end-dark {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
width: 220rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 80rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 32rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
background: linear-gradient(to top, #6B87BA, #FFFFFF);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
/* 渐变从下到上 */
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-bottom: 20rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-img {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
margin-right: 5rpx;
|
|
|
|
|
|
// margin-left: 50rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 30rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-right: 90rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 30rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
margin-right: 90rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 65rpx;
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
background: linear-gradient(to bottom, #7080A1, #263556);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 65rpx;
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-weight: 700;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-text {
|
|
|
|
|
|
margin-left: 10rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
// color: #364464;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
font-size: 70rpx;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
width: 800rpx;
|
|
|
|
|
|
margin-bottom: 50rpx;
|
|
|
|
|
|
line-height: 70rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.time-text-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 300rpx;
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
.right-container-right-down-father {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
// margin-left: 5%;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 560rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-left {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-top: -150rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-02-20 17:21:36 +08:00
|
|
|
|
.right-container-right-down-card-dark {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-left: 50rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-top: 60rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
width: 763rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 430rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
box-shadow: 2rpx 0 0 2rpx;
|
|
|
|
|
|
background-color: rgb(22, 48, 76);
|
|
|
|
|
|
|
|
|
|
|
|
// background-image: url('/static/index/cardbgc/newbgc.png');
|
|
|
|
|
|
// background-position: 50% 60%;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
border: 2rpx solid #fff;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-line {
|
|
|
|
|
|
width: 1px;
|
|
|
|
|
|
/* 线条的宽度 */
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 200rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #808080 50%, rgba(0, 0, 0, 0) 100%);
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-left: -20rpx;
|
|
|
|
|
|
margin-right: 30rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-top: 100rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 450rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-type {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0rpx;
|
|
|
|
|
|
left: -25rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 250rpx;
|
|
|
|
|
|
height: 80rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
color: #414F6E;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-font-dark {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
color: #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-img {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 200rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-top: 30rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 35rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 35rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
color: #fff;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-right-down-card {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-left: 50rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-top: 60rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
width: 763rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 430rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
border: 1rpx solid black;
|
|
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-line {
|
2025-02-18 17:11:31 +08:00
|
|
|
|
width: 1px;
|
|
|
|
|
|
/* 线条的宽度 */
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 200rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #808080 50%, rgba(0, 0, 0, 0) 100%);
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-left: -20rpx;
|
|
|
|
|
|
margin-right: 30rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-top: 100rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card {
|
2025-02-18 17:11:31 +08:00
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 450rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-type {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0rpx;
|
|
|
|
|
|
left: -25rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 250rpx;
|
|
|
|
|
|
height: 80rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
color: #414F6E;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-img {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 200rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-top: 30rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 35rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
margin-top: 30rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font-dark {
|
2025-02-18 17:11:31 +08:00
|
|
|
|
font-size: 50rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
color: #fff;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
margin-top: 30rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-right {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-top: -150rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-02-18 17:11:31 +08:00
|
|
|
|
// align-items: center;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-right-title {
|
2025-02-18 17:11:31 +08:00
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 170rpx;
|
|
|
|
|
|
position: relative;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.right-container-right-text {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
line-height: 130rpx;
|
|
|
|
|
|
font-size: 40rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
font-weight: 600;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-left: 60rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-text-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
line-height: 130rpx;
|
|
|
|
|
|
font-size: 40rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
font-weight: 600;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-left: 60rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
color: #fff;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.right-container-right-img {
|
2025-02-18 17:11:31 +08:00
|
|
|
|
position: absolute;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
top: 60rpx;
|
|
|
|
|
|
right: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
height: 15rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-father {
|
|
|
|
|
|
margin-left: 2%;
|
|
|
|
|
|
width: 41%;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
height: 630rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
border-radius: 35rpx;
|
|
|
|
|
|
border: 2rpx solid #fff;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
background-image: url('/static/index/mountain.png');
|
2025-03-04 17:29:52 +08:00
|
|
|
|
background-color: rgba(200, 216, 238, 0.8);
|
|
|
|
|
|
// background-image: url('/static/index/mountain.png');
|
|
|
|
|
|
background-position: 60% 50%;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
/* 背景颜色 #f4f9ff，透明度 70% */
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
// justify-content: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
2025-02-25 17:23:40 +08:00
|
|
|
|
overflow: hidden;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.uni-margin-wrap {
|
|
|
|
|
|
margin-top: 200rpx;
|
|
|
|
|
|
width: 1200rpx;
|
|
|
|
|
|
// width: 100%;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.swiper {
|
|
|
|
|
|
height: 900rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.swiper-item-flex {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.swiper-item {
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
height: 300rpx;
|
|
|
|
|
|
line-height: 300rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-tra-next {
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
width: 700rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-button-view-fin {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
margin-left: -50rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-start {
|
|
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
background: linear-gradient(to top, #047ADB, #0EA7DD);
|
|
|
|
|
|
border-left: 2rpx solid #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
margin-right: 25rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-button-end {
|
|
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-button-end-dark {
|
|
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
background: linear-gradient(to top, #6B87BA, #FFFFFF);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
/* 渐变从下到上 */
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people {
|
2025-02-18 17:11:31 +08:00
|
|
|
|
display: flex;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
margin-bottom: 20rpx;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 5rpx;
|
|
|
|
|
|
// margin-left: 50rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people-font {
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 90rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 90rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-font {
|
|
|
|
|
|
font-size: 65rpx;
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
background: linear-gradient(to bottom, #7080A1, #263556);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-font-dark {
|
|
|
|
|
|
font-size: 65rpx;
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-text {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
// color: #364464;
|
|
|
|
|
|
font-size: 70rpx;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
width: 800rpx;
|
|
|
|
|
|
margin-bottom: 50rpx;
|
|
|
|
|
|
line-height: 70rpx;
|
|
|
|
|
|
position: relative;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-text-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 300rpx;
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-father {
|
|
|
|
|
|
// margin-left: 5%;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 560rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-left {
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-top: -150rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-dark {
|
|
|
|
|
|
margin-left: 50rpx;
|
|
|
|
|
|
margin-top: 60rpx;
|
|
|
|
|
|
width: 763rpx;
|
|
|
|
|
|
height: 430rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
box-shadow: 2rpx 0 0 2rpx;
|
|
|
|
|
|
background-color: rgb(22, 48, 76);
|
|
|
|
|
|
|
|
|
|
|
|
// background-image: url('/static/index/cardbgc/newbgc.png');
|
|
|
|
|
|
// background-position: 50% 60%;
|
|
|
|
|
|
border: 2rpx solid #fff;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-line {
|
|
|
|
|
|
width: 1px;
|
|
|
|
|
|
/* 线条的宽度 */
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #808080 50%, rgba(0, 0, 0, 0) 100%);
|
|
|
|
|
|
margin-left: -20rpx;
|
|
|
|
|
|
margin-right: 30rpx;
|
|
|
|
|
|
margin-top: 100rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 450rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-type {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0rpx;
|
|
|
|
|
|
left: -25rpx;
|
|
|
|
|
|
width: 250rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
|
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #414F6E;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-font-dark {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
|
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-img {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font-dark {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card {
|
|
|
|
|
|
margin-left: 50rpx;
|
|
|
|
|
|
margin-top: 60rpx;
|
|
|
|
|
|
width: 763rpx;
|
|
|
|
|
|
height: 430rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
border: 1rpx solid black;
|
|
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-line {
|
|
|
|
|
|
width: 1px;
|
|
|
|
|
|
/* 线条的宽度 */
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #808080 50%, rgba(0, 0, 0, 0) 100%);
|
|
|
|
|
|
margin-left: -20rpx;
|
|
|
|
|
|
margin-right: 30rpx;
|
|
|
|
|
|
margin-top: 100rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 450rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-type {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0rpx;
|
|
|
|
|
|
left: -25rpx;
|
|
|
|
|
|
width: 250rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
|
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #414F6E;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-img {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font-dark {
|
|
|
|
|
|
font-size: 50rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-right {
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-top: -150rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// align-items: center;
|
|
|
|
|
|
.right-container-right-title {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 170rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-text {
|
|
|
|
|
|
line-height: 130rpx;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
margin-left: 60rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-text-dark {
|
|
|
|
|
|
line-height: 130rpx;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
margin-left: 60rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 60rpx;
|
|
|
|
|
|
right: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
height: 15rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-left {
|
|
|
|
|
|
width: 55%;
|
|
|
|
|
|
height: 630rpx;
|
|
|
|
|
|
border-radius: 45rpx;
|
|
|
|
|
|
border: 1rpx solid #fff;
|
|
|
|
|
|
// background-color: rgba(203, 219, 238, 0.8);
|
|
|
|
|
|
/* 背景颜色 #f4f9ff，透明度 70% */
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
background-color: rgba(255, 255, 255, 0.5);
|
|
|
|
|
|
/* 白色背景透明度为 10% */
|
|
|
|
|
|
background-image: url('/static/index/mountain.png');
|
|
|
|
|
|
background-position: 70% 45%;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
// box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* 阴影效果 */
|
|
|
|
|
|
/* 背景图片从左上角25%和30%的位置开始 */
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-left-dark {
|
|
|
|
|
|
width: 55%;
|
|
|
|
|
|
height: 630rpx;
|
|
|
|
|
|
border-radius: 45rpx;
|
|
|
|
|
|
background-color: rgb(22, 48, 76);
|
|
|
|
|
|
border: 2rpx solid transparent;
|
|
|
|
|
|
background:
|
|
|
|
|
|
url('/static/index/cardbgc/bgcdark.png') padding-box,
|
|
|
|
|
|
linear-gradient(45deg, #9bc4f8, #285399, #9bc4f8, #285399, #9bc4f8) border-box;
|
|
|
|
|
|
background-clip: padding-box, border-box;
|
|
|
|
|
|
background-color: rgba(12, 25, 47, 0.1);
|
|
|
|
|
|
/* 背景颜色 #f4f9ff，透明度 70% */
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.uni-margin-wrap {
|
|
|
|
|
|
width: 1000rpx;
|
|
|
|
|
|
// width: 100%;
|
|
|
|
|
|
|
|
|
|
|
|
.swiper {
|
|
|
|
|
|
height: 700rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.swiper-item-flex {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.swiper-item {
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
height: 250rpx;
|
|
|
|
|
|
line-height: 300rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-fir-left-card-main-right {
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
|
// margin-left: 10rpx;
|
|
|
|
|
|
z-index: 11;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-fir {
|
|
|
|
|
|
width: 250rpx;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
// background-color: #047ADB;
|
|
|
|
|
|
margin-top: 0rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-view {
|
|
|
|
|
|
margin-left: 8rpx;
|
|
|
|
|
|
height: 750rpx;
|
|
|
|
|
|
// background-color: #047ADB;
|
|
|
|
|
|
overflow: auto;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-view-dis {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 170rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-img {
|
|
|
|
|
|
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-text {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 10rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
margin-bottom: 5rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-text-dark {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 10rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
margin-bottom: 5rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-shang {
|
|
|
|
|
|
margin-top: 40rpx;
|
|
|
|
|
|
width: 30rpx;
|
|
|
|
|
|
height: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-xia {
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
width: 30rpx;
|
|
|
|
|
|
height: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-photo {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
margin-left: 50rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-photo-img {
|
|
|
|
|
|
width: 310rpx;
|
|
|
|
|
|
height: 350rpx;
|
|
|
|
|
|
// margin-top: 30rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-photo-text {
|
|
|
|
|
|
font-size: 30rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
color: #324160;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-photo-text-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 30rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-fir-left-card-main-left {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
// margin-right: 22rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-left: 30rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-left-type {
|
|
|
|
|
|
position: absolute;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
top: 42rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
left: -15rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
width: 235rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 73rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
z-index: 10;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-left-font {
|
|
|
|
|
|
position: absolute;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
top: 51rpx;
|
|
|
|
|
|
left: 50rpx;
|
|
|
|
|
|
font-size: 36rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
color: #fff;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
z-index: 10;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
.time-tra-thi {
|
|
|
|
|
|
margin-left: 80rpx;
|
|
|
|
|
|
margin-top: 70rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
height: 100%;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
width: 550rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.time-text {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
width: 450rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
line-height: 40rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-text-dark {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
width: 450rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
line-height: 40rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-tra-thi-zhixing {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 75rpx;
|
|
|
|
|
|
left: 450rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-tra-thi-zhixing-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 60rpx;
|
|
|
|
|
|
left: 10rpx;
|
|
|
|
|
|
width: 100rpx;
|
|
|
|
|
|
height: 40rpx;
|
|
|
|
|
|
font-size: 25rpx;
|
|
|
|
|
|
border-radius: 5rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
background-color: rgb(243, 123, 91);
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-two {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-top: 40rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font {
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
}
|
2025-02-25 17:23:40 +08:00
|
|
|
|
|
|
|
|
|
|
.time-people-thi {
|
|
|
|
|
|
display: flex;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
// margin-bottom: 15rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
|
|
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 5rpx;
|
|
|
|
|
|
margin-left: 5rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
// color: #586787;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
// width: 300rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-button-view {
|
|
|
|
|
|
display: flex;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
// margin-top: 80rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
margin-left: 0rpx;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-03-03 17:43:20 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-button-start {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
background: linear-gradient(to bottom, #AF8ED7, #4D3E9B);
|
2025-02-19 17:33:12 +08:00
|
|
|
|
border-left: 2rpx solid #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
color: #fff;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 32rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
margin-right: 25rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-button-end {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 32rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-button-end-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 32rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
background: linear-gradient(to top, #6B87BA, #FFFFFF);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 70rpx;
|
|
|
|
|
|
margin-top: 120rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
background: linear-gradient(to bottom, #7080A1, #263556);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.time-font-dark {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 70rpx;
|
|
|
|
|
|
margin-top: 120rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-weight: 700;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-text-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 300rpx;
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
2025-02-25 17:23:40 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
.time-tra-sec {
|
|
|
|
|
|
margin-left: 80rpx;
|
|
|
|
|
|
margin-top: 110rpx;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
width: 500rpx;
|
|
|
|
|
|
overflow: hidden;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
.time-people-thi {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-bottom: 15rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 5rpx;
|
|
|
|
|
|
margin-left: 5rpx;
|
|
|
|
|
|
}
|
2025-02-25 17:23:40 +08:00
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
.time-people-font {
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
// width: 300rpx;
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
.time-button-view {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
margin-left: 0rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
.time-button-start {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
background: linear-gradient(to top, #0DA0B1, #04D3AF);
|
|
|
|
|
|
border-left: 2rpx solid #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
margin-right: 25rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-end {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-end-dark {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
background: linear-gradient(to top, #6B87BA, #FFFFFF);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font {
|
|
|
|
|
|
font-size: 75rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
background: linear-gradient(to bottom, #7080A1, #263556);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font-dark {
|
|
|
|
|
|
font-size: 75rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-text-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 300rpx;
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-sec {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
|
margin-left: 5rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font {
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 90rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 90rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-fir {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 580rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// background-color: red;
|
|
|
|
|
|
.right-container-fir-left-nav {
|
|
|
|
|
|
width: 63%;
|
|
|
|
|
|
height: 548rpx;
|
|
|
|
|
|
border-radius: 45rpx;
|
|
|
|
|
|
/* 圆角 */
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
/* 增加背景色确保视觉效果 */
|
|
|
|
|
|
background-color: rgba(255, 255, 255, 0.6);
|
|
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
|
|
|
|
|
|
/* 增强的阴影效果 */
|
|
|
|
|
|
.right-container-fir-left-carousel {
|
2025-02-20 17:21:36 +08:00
|
|
|
|
position: absolute;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
left: 930rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-top: 10rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
|
|
|
|
|
.carousel {
|
|
|
|
|
|
position: relative;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 150rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
/* 轮播图的宽度 */
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 100rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
/* 轮播图的高度 */
|
|
|
|
|
|
// background-color: #f0f0f0;
|
|
|
|
|
|
|
|
|
|
|
|
/* 背景色（示例） */
|
|
|
|
|
|
.dots {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 50%;
|
|
|
|
|
|
right: 10rpx;
|
|
|
|
|
|
transform: translateY(-50%);
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: column;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
gap: 7rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
|
|
|
|
|
.dot {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 10rpx;
|
|
|
|
|
|
height: 10rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
border-radius: 50%;
|
|
|
|
|
|
background-color: #657494;
|
|
|
|
|
|
/* 默认未激活的颜色 */
|
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
transition: background-color 0.3s ease;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.dot-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 10rpx;
|
|
|
|
|
|
height: 10rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
border-radius: 50%;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
/* 默认未激活的颜色 */
|
|
|
|
|
|
cursor: pointer;
|
|
|
|
|
|
transition: background-color 0.3s ease;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.dot.active {
|
|
|
|
|
|
background-color: #01A0FE;
|
|
|
|
|
|
/* 激活的颜色 */
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-18 17:11:31 +08:00
|
|
|
|
/* 包括边框在内计算宽高 */
|
|
|
|
|
|
.right-container-fir-left-card {
|
|
|
|
|
|
position: absolute;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 45rpx;
|
|
|
|
|
|
border: 1rpx solid #fff;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
background-color: rgba(99, 115, 157, 0.1);
|
2025-02-20 17:21:36 +08:00
|
|
|
|
/* 白色背景透明度为 10% */
|
2025-02-27 17:15:17 +08:00
|
|
|
|
background-image: url('/static/index/mountain.png');
|
|
|
|
|
|
background-position: 60% 50%;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-fir-left-card-dark {
|
|
|
|
|
|
position: absolute;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
border: 2rpx solid transparent;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
border-radius: 45rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
background:
|
|
|
|
|
|
url('/static/index/cardbgc/bgcdark.png') padding-box,
|
|
|
|
|
|
linear-gradient(45deg, #9bc4f8, #285399, #9bc4f8, #285399, #9bc4f8) border-box;
|
|
|
|
|
|
background-clip: padding-box, border-box;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
background-color: rgba(12, 25, 47, 0.1);
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-fir-left-card-main {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
width: 100%;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
height: 100%;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
// margin-top: 60rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
.split-line-white-right-left {
|
|
|
|
|
|
width: 2rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
/* 线条的宽度 */
|
|
|
|
|
|
height: 800rpx;
|
|
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #fff 50%, rgba(0, 0, 0, 0) 100%);
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-right: 20rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.split-line-white-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0rpx;
|
|
|
|
|
|
left: -300rpx;
|
|
|
|
|
|
height: 800rpx;
|
|
|
|
|
|
width: 300rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
z-index: -1;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
.uni-margin-wrap-fir {
|
2025-02-19 17:33:12 +08:00
|
|
|
|
width: 100%;
|
|
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.swiper {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 470rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.swiper-item-flex {
|
|
|
|
|
|
display: flex;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
z-index: 10;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.swiper-item {
|
|
|
|
|
|
display: block;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 200rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
line-height: 300rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-fir-left-card-main-right {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-right: 25rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
// margin-left: 20rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
z-index: 1;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
|
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
.time-tra-fir {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-top: 40rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
margin-left: 30rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
.time-people-two {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-button-view {
|
|
|
|
|
|
display: flex;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-top: 10rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-left: 0rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.time-button-start {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
background: linear-gradient(to top, #047ADB, #0EA7DD);
|
|
|
|
|
|
border-left: 2rpx solid #fff;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
display: flex;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
color: #fff;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 32rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
margin-right: 25rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-button-end {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 32rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-button-end-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 32rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
background: linear-gradient(to top, #6B87BA, #FFFFFF);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
/* 渐变从下到上 */
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
.time-people-fir {
|
2025-02-19 17:33:12 +08:00
|
|
|
|
display: flex;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-right: 20rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-people-img {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
|
margin-left: 5rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-people-font {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
// color: #586787;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-font {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 70rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
// text-shadow: 0 -3rpx 3rpx;
|
|
|
|
|
|
margin-bottom: 30rpx;
|
|
|
|
|
|
background: linear-gradient(to top, #334160, #687898);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
font-weight: 700;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font-dark {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 70rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
// text-shadow: 0 -3rpx 3rpx;
|
|
|
|
|
|
margin-bottom: 30rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
background: linear-gradient(to right, #EBF4FF, #ADC4E0);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-weight: 700;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-text {
|
|
|
|
|
|
margin-left: 10rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 35rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 530rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
line-height: 40rpx;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.time-text-dark {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
color: #CDD6EA;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 35rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 530rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
line-height: 40rpx;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-fir-left-card-card {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
position: relative;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
// margin-top: 20rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-left: 50rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-fir-left-card-zhixing {
|
|
|
|
|
|
position: absolute;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
top: 10rpx;
|
|
|
|
|
|
left: 870rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-fir-left-card-zhixing-font {
|
|
|
|
|
|
position: absolute;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
top: 60rpx;
|
|
|
|
|
|
left: 10rpx;
|
|
|
|
|
|
width: 100rpx;
|
|
|
|
|
|
height: 40rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 25rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
border-radius: 5rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
color: #fff;
|
|
|
|
|
|
z-index: 10;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
background-color: rgb(243, 123, 91);
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-fir-left-card-main-font {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 34rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
font-weight: 350;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-fir-left-card-main-font-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 34rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
font-weight: 350;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
color: #fff;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
.right-container-fir-left-card-main-laba-video {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
margin-top: 10rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-fir-left-card-main-laba {
|
|
|
|
|
|
width: 45rpx;
|
|
|
|
|
|
height: 45rpx;
|
|
|
|
|
|
margin-right: 5rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-fir-left-card-main-video {
|
|
|
|
|
|
width: 45rpx;
|
|
|
|
|
|
height: 45rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-fir-left-card-img {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
// margin-top: 100rpx;
|
|
|
|
|
|
width: 360rpx;
|
|
|
|
|
|
height: 270rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
.right-container-fir-left-card-main-left-up {
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
margin-right: 0rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-left: 20rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
.right-container-fir-left-card-hulilei {
|
|
|
|
|
|
position: absolute;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
top: 42rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
left: -10rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 73rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
z-index: 10;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-fir-left-card-hulilei-font {
|
|
|
|
|
|
position: absolute;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
top: 51rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
left: 45rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 36rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
color: #fff;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
z-index: 10;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-fir-right {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
// margin-top: 6rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
margin-left: 2%;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-right: 2%;
|
|
|
|
|
|
width: 700rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
height: 548rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
border-radius: 40rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
border: 1rpx solid #fff;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
background: url(/static/index/rightbgi.png);
|
|
|
|
|
|
background-size: cover;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
background-color: rgba(99, 115, 157, 0.1);
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-fir-right-dark {
|
|
|
|
|
|
margin-left: 2%;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-right: 2%;
|
|
|
|
|
|
width: 700rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
height: 548rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
border-radius: 40rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
border: 1rpx solid #fff;
|
|
|
|
|
|
background-color: #16304c;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
border: 2rpx solid transparent;
|
|
|
|
|
|
background:
|
|
|
|
|
|
url('/static/index/cardbgc/bgcdark.png') padding-box,
|
|
|
|
|
|
linear-gradient(45deg, #9bc4f8, #285399, #9bc4f8, #285399, #9bc4f8) border-box;
|
|
|
|
|
|
background-clip: padding-box, border-box;
|
|
|
|
|
|
background-color: rgba(12, 25, 47, 0.1);
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-card {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-top: 25rpx;
|
|
|
|
|
|
margin-left: 40rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
// height: 700rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
.right-container-card-right {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
right: 0;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
width: 120rpx;
|
|
|
|
|
|
height: 350rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
flex-direction: column;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
margin-bottom: 20rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-card-right-img {
|
2025-03-04 17:29:52 +08:00
|
|
|
|
width: 60rpx;
|
|
|
|
|
|
height: 60rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-top: 10rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-button {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-left: -20rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-top: 23rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-button-any {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 150rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
position: relative;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-button-ray {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: -25rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
left: 0rpx;
|
|
|
|
|
|
width: 158rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
height: 150rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
|
|
|
|
|
}
|
2025-02-25 17:23:40 +08:00
|
|
|
|
|
|
|
|
|
|
.right-container-button-text {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
font-size: 25rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
color: #313D56;
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-button-img {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-fenge {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
// margin-top: 40rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 2rpx;
|
|
|
|
|
|
/* 可根据需求调整容器的高度 */
|
|
|
|
|
|
background: linear-gradient(to right,
|
2025-03-04 17:29:52 +08:00
|
|
|
|
rgba(255, 255, 255, 0) 0%,
|
|
|
|
|
|
/* 左端透明 */
|
2025-02-19 17:33:12 +08:00
|
|
|
|
rgba(255, 255, 255, 1) 50%,
|
2025-03-04 17:29:52 +08:00
|
|
|
|
/* 中心纯白 */
|
|
|
|
|
|
rgba(255, 255, 255, 0) 100%
|
|
|
|
|
|
/* 右端透明 */
|
|
|
|
|
|
);
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-tem {
|
|
|
|
|
|
display: flex;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-top: 20rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
margin-bottom: 20rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-tem-text {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 50rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
margin-right: 70rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-tem-text-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 50rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
margin-right: 70rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-tem-img {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
width: 65rpx;
|
|
|
|
|
|
height: 65rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
.right-container-title {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 120rpx;
|
|
|
|
|
|
font-weight: 500;
|
|
|
|
|
|
background: linear-gradient(to bottom, #7080A1, #263556);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
margin: 0;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-title-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 120rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
display: block;
|
|
|
|
|
|
margin: 0;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-weight: 500;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-date {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 35rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
// color: #7080A1;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
display: block;
|
|
|
|
|
|
margin: 0;
|
|
|
|
|
|
margin-left: 18rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-bottom: 10rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-date-dark {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 35rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
color: #7080A1;
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
margin: 0;
|
|
|
|
|
|
margin-left: 18rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-bottom: 10rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-day {
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 35rpx;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
// color: #7080A1;
|
|
|
|
|
|
margin-left: 18rpx;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
|
|
|
|
|
|
|
2025-02-19 17:33:12 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-day-dark {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
// color: #7080A1;
|
|
|
|
|
|
margin-left: 18rpx;
|
|
|
|
|
|
|
|
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-title-nav {
|
|
|
|
|
|
margin-top: 75rpx;
|
|
|
|
|
|
margin-bottom: 20rpx;
|
|
|
|
|
|
margin-left: 20rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-title-no {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-title-no-dark {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-title-class {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
font-weight: 800;
|
|
|
|
|
|
margin-left: 20rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-title-class-dark {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
font-weight: 800;
|
|
|
|
|
|
margin-left: 20rpx;
|
|
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-title-class-anhei-button {
|
|
|
|
|
|
float: right;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
border-radius: 30rpx;
|
|
|
|
|
|
margin-right: 30rpx;
|
|
|
|
|
|
width: 200rpx;
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
background-color: black;
|
|
|
|
|
|
border: 2rpx solid;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-title-class-anhei {
|
|
|
|
|
|
font-size: 20rpx;
|
|
|
|
|
|
font-weight: 800;
|
|
|
|
|
|
color: white;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.left-container {
|
|
|
|
|
|
width: 260rpx;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
|
|
|
|
|
|
.blue-circle-pos {
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.blue-circle {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: -50rpx;
|
|
|
|
|
|
left: -68rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.blue-circle-size {
|
|
|
|
|
|
width: 170rpx;
|
|
|
|
|
|
height: 250rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.left-head {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
|
|
|
|
|
|
.left-head-img {
|
|
|
|
|
|
width: 150rpx;
|
|
|
|
|
|
height: 150rpx;
|
|
|
|
|
|
margin-top: 60rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.left-head-font {
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.left-head-font-dark {
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
background: linear-gradient(to right, #EBF4FF, #ADC4E0);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.left-img-container {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
// margin-top: 30rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.left-img {
|
|
|
|
|
|
width: 93rpx;
|
|
|
|
|
|
height: 93rpx;
|
|
|
|
|
|
// margin-top: 25rpx;
|
|
|
|
|
|
// margin-bottom: 25rpx;
|
|
|
|
|
|
margin: 50rpx 0;
|
|
|
|
|
|
z-index: 100;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
//分割线
|
|
|
|
|
|
.split-line {
|
|
|
|
|
|
margin-left: 20rpx;
|
|
|
|
|
|
margin-top: 120rpx;
|
|
|
|
|
|
width: 2rpx;
|
|
|
|
|
|
/* 线条的宽度 */
|
|
|
|
|
|
height: 150rpx;
|
|
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #92a7c5 50%, rgba(0, 0, 0, 0) 100%);
|
|
|
|
|
|
// margin-left: 20rpx;
|
|
|
|
|
|
// margin-right: 20rpx;
|
|
|
|
|
|
// display: block; /* 确保元素占据空间 */
|
|
|
|
|
|
/* 上面到下面的渐变效果：
|
|
|
|
|
|
- 从透明到黑色，再从黑色到透明
|
|
|
|
|
|
- 渐变的范围：50%处为渐变的中心，顶部和底部是透明的 */
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.split-line-white-sec {
|
|
|
|
|
|
width: 2rpx;
|
|
|
|
|
|
/* 线条的宽度 */
|
|
|
|
|
|
height: 800rpx;
|
|
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #fff 50%, rgba(0, 0, 0, 0) 100%);
|
|
|
|
|
|
// wmargin-left: 20rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
// z-index: -1;
|
|
|
|
|
|
|
|
|
|
|
|
.split-line-white-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0rpx;
|
|
|
|
|
|
left: -300rpx;
|
|
|
|
|
|
height: 800rpx;
|
|
|
|
|
|
width: 300rpx;
|
|
|
|
|
|
pointer-events: none;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.card-upfaguang {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 265rpx;
|
|
|
|
|
|
left: 50rpx;
|
|
|
|
|
|
height: 600rpx;
|
|
|
|
|
|
width: 500rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.card-upfaguang-down {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 620rpx;
|
|
|
|
|
|
left: 860rpx;
|
|
|
|
|
|
height: 600rpx;
|
|
|
|
|
|
width: 500rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-sec {
|
|
|
|
|
|
margin-left: 7rpx;
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-view {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
overflow: auto;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: flex-start;
|
|
|
|
|
|
/* 垂直方向对齐方式可以调整 */
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
// margin-left: -65rpx;
|
|
|
|
|
|
height: 450rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-view-dis {
|
|
|
|
|
|
height: 140rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-img {
|
|
|
|
|
|
width: 90rpx;
|
|
|
|
|
|
height: 90rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-text {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 15rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
// margin-top: 10rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-text-dark {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 15rpx;
|
|
|
|
|
|
text-align: center;
|
2025-02-25 17:23:40 +08:00
|
|
|
|
font-size: 35rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
color: #fff;
|
|
|
|
|
|
margin-top: 10rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-huli-shang {
|
|
|
|
|
|
width: 30rpx;
|
|
|
|
|
|
height: 20rpx;
|
|
|
|
|
|
// margin-left: -73rpx;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-huli-xia {
|
|
|
|
|
|
// margin-top: 10rpx;
|
|
|
|
|
|
width: 30rpx;
|
|
|
|
|
|
height: 20rpx;
|
|
|
|
|
|
// margin-left: -73rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-flex {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
margin-left: 20rpx;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-flex-sec {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
position: relative;
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-flex-sec-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 42rpx;
|
|
|
|
|
|
left: -10rpx;
|
|
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 73rpx;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-flex-sec-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 51rpx;
|
|
|
|
|
|
left: 45rpx;
|
|
|
|
|
|
font-size: 36rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-flex-sec-imgright-fir {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
width: 100rpx;
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
top: 51rpx;
|
|
|
|
|
|
left: 650rpx;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-flex-sec-imgright-sec {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
width: 100rpx;
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
top: 51rpx;
|
|
|
|
|
|
left: 670rpx;
|
|
|
|
|
|
z-index: 10;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.savehundred {
|
|
|
|
|
|
width: 100%;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
height: 100%;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.mt {
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.progress-bar-container {
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
width: 60%;
|
|
|
|
|
|
height: 20rpx;
|
|
|
|
|
|
background-color: #AAB9D6;
|
|
|
|
|
|
border-radius: 15px;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.progress-bar {
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
|
|
|
|
|
|
/* 这里可以更改进度百分比 */
|
|
|
|
|
|
background: linear-gradient(to top, #047ADB, #0EA7DD);
|
|
|
|
|
|
border-radius: 15px 0 0 15px;
|
|
|
|
|
|
transition: width 0.3s ease;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.under-father {
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
bottom: 0;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 150rpx;
|
|
|
|
|
|
|
|
|
|
|
|
// background-color: red;
|
|
|
|
|
|
.under-father-view {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
margin-right: 150rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
position: relative;
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.under-father-light {
|
2025-02-18 17:11:31 +08:00
|
|
|
|
position: absolute;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
bottom: -20rpx;
|
|
|
|
|
|
left: -100rpx;
|
|
|
|
|
|
width: 300rpx;
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.under-father-img {
|
|
|
|
|
|
width: 100rpx;
|
|
|
|
|
|
height: 100rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-icons {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
float: right;
|
|
|
|
|
|
height: 70rpx;
|
|
|
|
|
|
margin-right: 40rpx;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-icons-font {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
margin-top: -30rpx;
|
|
|
|
|
|
}
|
2025-02-19 17:33:12 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-icons-font-dark {
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
margin-top: -30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-icons-img {
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
|
margin-top: -40rpx;
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-icons-img-icon {
|
|
|
|
|
|
width: 60rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
margin-top: -10rpx;
|
|
|
|
|
|
margin-left: 8rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-tra-thi-photo {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
width: 300rpx;
|
|
|
|
|
|
// height: 100%;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
// margin-left: -100rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
|
|
|
|
|
|
.time-tra-thi-photo-img {
|
|
|
|
|
|
width: 330rpx;
|
|
|
|
|
|
height: 330rpx;
|
|
|
|
|
|
margin-top: -100rpx;
|
|
|
|
|
|
margin-left: -50rpx;
|
|
|
|
|
|
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-tra-thi-photo-font {
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 50rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-tra-thi-photo-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 50rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-18 17:11:31 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-tra-thi-photo-change {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
width: 510rpx;
|
|
|
|
|
|
// height: 550rpx;
|
|
|
|
|
|
margin-left: 200rpx;
|
|
|
|
|
|
// height: 100%;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-tra-thi-photo-img {
|
|
|
|
|
|
width: 500rpx;
|
|
|
|
|
|
height: 500rpx;
|
|
|
|
|
|
margin-top: -100rpx;
|
|
|
|
|
|
margin-left: -50rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-tra-thi-photo-font {
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
margin-right: 50rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-tra-thi-photo-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
margin-right: 50rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
}
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.popup-overlay {
|
|
|
|
|
|
position: fixed;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 0;
|
|
|
|
|
|
right: 0;
|
|
|
|
|
|
bottom: 0;
|
|
|
|
|
|
// background: rgba(0, 0, 0, 0.5);
|
2025-02-20 17:21:36 +08:00
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
backdrop-filter: blur(1rpx);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
/* 关键：通过遮罩控制模糊的显示区域 */
|
|
|
|
|
|
// mask: radial-gradient(circle at center,
|
|
|
|
|
|
// rgba(0, 0, 0, 0) 0%,
|
|
|
|
|
|
// /* 中心完全透明（模糊不可见） */
|
|
|
|
|
|
// rgba(0, 0, 0, 0.1) 30%,
|
|
|
|
|
|
// /* 中间过渡区域 */
|
|
|
|
|
|
// rgba(0, 0, 0, 1) 70%
|
|
|
|
|
|
// /* 边缘完全不透明（模糊可见） */
|
|
|
|
|
|
// );
|
|
|
|
|
|
/* 添加毛玻璃效果 */
|
|
|
|
|
|
z-index: 999;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.popup-overlay-content {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
background-color: rgba(255, 255, 255, 1);
|
|
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
transition: width 0.4s ease-in-out, height 0.4s ease-in-out, top 0.4s ease-in-out, left 0.4s ease-in-out;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
/* 修正了 transition 语法 左上角*/
|
|
|
|
|
|
.right-container-fir-left-nav-open {
|
2025-02-20 17:21:36 +08:00
|
|
|
|
width: 100%;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 45rpx;
|
|
|
|
|
|
/* 圆角 */
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
/* 增加背景色确保视觉效果 */
|
|
|
|
|
|
// background-color: rgba(255, 255, 255, 0.6);
|
|
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
2025-03-03 17:43:20 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
/* 增强的阴影效果 */
|
|
|
|
|
|
.right-container-fir-left-carousel {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
left: 950rpx;
|
|
|
|
|
|
margin-top: 10rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
/* 包括边框在内计算宽高 */
|
|
|
|
|
|
.right-container-fir-left-card {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 0;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
width: 100%;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 45rpx;
|
|
|
|
|
|
border: 1rpx solid #fff;
|
|
|
|
|
|
background-color: rgba(201, 221, 244, 1);
|
|
|
|
|
|
/* 白色背景透明度为 10% */
|
|
|
|
|
|
// background-color: rgba(99, 115, 157, 1);
|
|
|
|
|
|
/* 白色背景透明度为 10% */
|
|
|
|
|
|
background-image: url('/static/index/mountain.png');
|
|
|
|
|
|
background-position: 60% 50%;
|
|
|
|
|
|
// box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* 阴影效果 */
|
|
|
|
|
|
/* 背景图片从左上角25%和30%的位置开始 */
|
2025-02-20 17:21:36 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-dark {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 0;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
width: 100%;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
height: 100%;
|
|
|
|
|
|
border: 2rpx solid transparent;
|
|
|
|
|
|
border-radius: 45rpx;
|
|
|
|
|
|
background:
|
|
|
|
|
|
url('/static/index/cardbgc/bgcdark.png') padding-box,
|
|
|
|
|
|
linear-gradient(45deg, #9bc4f8, #285399, #9bc4f8, #285399, #9bc4f8) border-box;
|
|
|
|
|
|
background-clip: padding-box, border-box;
|
|
|
|
|
|
background-color: rgba(12, 25, 47, 0.1)
|
2025-02-20 17:21:36 +08:00
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-main {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
// margin-top: 60rpx;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.split-line-white-right-left {
|
|
|
|
|
|
width: 2rpx;
|
|
|
|
|
|
/* 线条的宽度 */
|
|
|
|
|
|
height: 800rpx;
|
|
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #fff 50%, rgba(0, 0, 0, 0) 100%);
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
position: relative;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.split-line-white-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0rpx;
|
|
|
|
|
|
left: -300rpx;
|
|
|
|
|
|
height: 800rpx;
|
|
|
|
|
|
width: 300rpx;
|
|
|
|
|
|
z-index: -1;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.uni-margin-wrap-fir {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.swiper {
|
|
|
|
|
|
height: 470rpx;
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.swiper-item-flex {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
// margin-top: 30rpx;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
}
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.swiper-item {
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
line-height: 300rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-main-right {
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-right: 25rpx;
|
|
|
|
|
|
// margin-left: 20rpx;
|
|
|
|
|
|
z-index: 1;
|
|
|
|
|
|
}
|
2025-02-20 17:21:36 +08:00
|
|
|
|
|
2025-02-25 17:23:40 +08:00
|
|
|
|
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-tra-fir {
|
|
|
|
|
|
margin-top: 40rpx;
|
|
|
|
|
|
margin-left: 50rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people-two {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-button-view {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-top: 10rpx;
|
|
|
|
|
|
margin-left: 0rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-button-start {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
background: linear-gradient(to top, #047ADB, #0EA7DD);
|
|
|
|
|
|
border-left: 2rpx solid #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
margin-right: 25rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-button-end {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-button-end-dark {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
background: linear-gradient(to top, #6B87BA, #FFFFFF);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
/* 渐变从下到上 */
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people-fir {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-right: 20rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
|
margin-left: 5rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people-font {
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-font {
|
|
|
|
|
|
font-size: 70rpx;
|
|
|
|
|
|
// text-shadow: 0 -3rpx 3rpx;
|
|
|
|
|
|
margin-bottom: 30rpx;
|
|
|
|
|
|
background: linear-gradient(to top, #334160, #687898);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-font-dark {
|
|
|
|
|
|
font-size: 70rpx;
|
|
|
|
|
|
// text-shadow: 0 -3rpx 3rpx;
|
|
|
|
|
|
margin-bottom: 30rpx;
|
|
|
|
|
|
background: linear-gradient(to right, #EBF4FF, #ADC4E0);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-text {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
width: 530rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
line-height: 40rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-text-dark {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
width: 530rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
line-height: 40rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-03-03 17:43:20 +08:00
|
|
|
|
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-card {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
|
// align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
// margin-top: 20rpx;
|
|
|
|
|
|
margin-left: 50rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-zhixing {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 10rpx;
|
|
|
|
|
|
left: 870rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-28 17:27:27 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-zhixing-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: -80rpx;
|
|
|
|
|
|
left: 0rpx;
|
|
|
|
|
|
width: 100rpx;
|
|
|
|
|
|
height: 40rpx;
|
|
|
|
|
|
font-size: 25rpx;
|
|
|
|
|
|
border-radius: 5rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
background-color: rgb(243, 123, 91);
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-28 17:27:27 +08:00
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-main-font {
|
|
|
|
|
|
font-size: 34rpx;
|
|
|
|
|
|
font-weight: 350;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-28 17:27:27 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-main-font-dark {
|
|
|
|
|
|
font-size: 34rpx;
|
|
|
|
|
|
font-weight: 350;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-main-laba-video {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
margin-top: 10rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-main-laba {
|
|
|
|
|
|
width: 45rpx;
|
|
|
|
|
|
height: 45rpx;
|
|
|
|
|
|
margin-right: 5rpx;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-main-video {
|
|
|
|
|
|
width: 45rpx;
|
|
|
|
|
|
height: 45rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-img {
|
|
|
|
|
|
width: 360rpx;
|
|
|
|
|
|
height: 270rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-fir-left-card-main-left-up {
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-right: 0rpx;
|
|
|
|
|
|
margin-left: 20rpx;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-hulilei {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
position: absolute;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
top: 38rpx;
|
|
|
|
|
|
left: -10rpx;
|
|
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 73rpx;
|
|
|
|
|
|
z-index: 10;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-fir-left-card-hulilei-font {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
position: absolute;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
top: 47rpx;
|
|
|
|
|
|
left: 45rpx;
|
|
|
|
|
|
font-size: 36rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
z-index: 10;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
2025-03-04 17:29:52 +08:00
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
//左下角
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-left-font-spec {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 110rpx;
|
|
|
|
|
|
left: 580rpx;
|
|
|
|
|
|
width: 100rpx;
|
|
|
|
|
|
height: 40rpx;
|
|
|
|
|
|
font-size: 25rpx;
|
|
|
|
|
|
border-radius: 5rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
background-color: rgb(52, 198, 120);
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-father-dark {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 45rpx;
|
|
|
|
|
|
background-color: rgb(22, 48, 76);
|
|
|
|
|
|
border: 2rpx solid transparent;
|
|
|
|
|
|
background:
|
|
|
|
|
|
url('/static/index/cardbgc/bgcdark.png') padding-box,
|
|
|
|
|
|
linear-gradient(45deg, #9bc4f8, #285399, #9bc4f8, #285399, #9bc4f8) border-box;
|
|
|
|
|
|
background-clip: padding-box, border-box;
|
|
|
|
|
|
background-color: rgba(12, 25, 47, 0.1);
|
|
|
|
|
|
/* 背景颜色 #f4f9ff，透明度 70% */
|
|
|
|
|
|
// background-image: url('/static/index/mountain.png');
|
|
|
|
|
|
// background-position: 60% 50%;
|
|
|
|
|
|
/* 背景颜色 #f4f9ff，透明度 70% */
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
overflow: hidden;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.uni-margin-wrap {
|
|
|
|
|
|
margin-top: 200rpx;
|
|
|
|
|
|
// width: 1200rpx;
|
|
|
|
|
|
width: 100%;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.swiper {
|
|
|
|
|
|
height: 900rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.swiper-item-flex {
|
|
|
|
|
|
display: flex;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.swiper-item {
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
height: 300rpx;
|
|
|
|
|
|
line-height: 300rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
2025-03-04 17:29:52 +08:00
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-tra-next {
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
width: 700rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-button-view-fin {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
margin-left: -50rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-button-start {
|
|
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
background: linear-gradient(to top, #047ADB, #0EA7DD);
|
|
|
|
|
|
border-left: 2rpx solid #fff;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
display: flex;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
margin-right: 25rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-button-end {
|
|
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
background-color: #fff;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
display: flex;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-button-end-dark {
|
|
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 50rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
display: flex;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
background: linear-gradient(to top, #6B87BA, #FFFFFF);
|
|
|
|
|
|
/* 渐变从下到上 */
|
|
|
|
|
|
}
|
2025-03-03 17:43:20 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-bottom: 20rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 5rpx;
|
|
|
|
|
|
// margin-left: 50rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people-font {
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 90rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 90rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
2025-03-04 17:29:52 +08:00
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-font {
|
|
|
|
|
|
font-size: 65rpx;
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
background: linear-gradient(to bottom, #7080A1, #263556);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.time-font-dark {
|
|
|
|
|
|
font-size: 65rpx;
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-text {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
// color: #364464;
|
|
|
|
|
|
font-size: 70rpx;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
width: 800rpx;
|
|
|
|
|
|
margin-bottom: 50rpx;
|
|
|
|
|
|
line-height: 70rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.time-text-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 300rpx;
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-03-04 17:29:52 +08:00
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-father {
|
|
|
|
|
|
// margin-left: 5%;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 560rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-left {
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-top: -150rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-dark {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
margin-left: 50rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
margin-top: 60rpx;
|
|
|
|
|
|
width: 763rpx;
|
|
|
|
|
|
height: 430rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
box-shadow: 2rpx 0 0 2rpx;
|
|
|
|
|
|
background-color: rgb(22, 48, 76);
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
// background-image: url('/static/index/cardbgc/newbgc.png');
|
|
|
|
|
|
// background-position: 50% 60%;
|
|
|
|
|
|
border: 2rpx solid #fff;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-line {
|
|
|
|
|
|
width: 1px;
|
|
|
|
|
|
/* 线条的宽度 */
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #808080 50%, rgba(0, 0, 0, 0) 100%);
|
|
|
|
|
|
margin-left: -20rpx;
|
|
|
|
|
|
margin-right: 30rpx;
|
|
|
|
|
|
margin-top: 100rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-card-card {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 450rpx;
|
|
|
|
|
|
position: relative;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-card-card-type {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0rpx;
|
|
|
|
|
|
left: -25rpx;
|
|
|
|
|
|
width: 250rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-card-card-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
|
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #414F6E;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-card-card-font-dark {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
|
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-card-img {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font-dark {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
2025-03-04 17:29:52 +08:00
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-card {
|
|
|
|
|
|
margin-left: 50rpx;
|
|
|
|
|
|
margin-top: 60rpx;
|
|
|
|
|
|
width: 763rpx;
|
|
|
|
|
|
height: 430rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
border: 1rpx solid black;
|
|
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-card-line {
|
|
|
|
|
|
width: 1px;
|
|
|
|
|
|
/* 线条的宽度 */
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #808080 50%, rgba(0, 0, 0, 0) 100%);
|
|
|
|
|
|
margin-left: -20rpx;
|
|
|
|
|
|
margin-right: 30rpx;
|
|
|
|
|
|
margin-top: 100rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 450rpx;
|
|
|
|
|
|
position: relative;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-card-card-type {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0rpx;
|
|
|
|
|
|
left: -25rpx;
|
|
|
|
|
|
width: 250rpx;
|
|
|
|
|
|
height: 80rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-card-card-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
|
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #414F6E;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-card-img {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font-dark {
|
|
|
|
|
|
font-size: 50rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-down-right {
|
2025-02-27 17:15:17 +08:00
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
margin-top: -150rpx;
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
// align-items: center;
|
|
|
|
|
|
.right-container-right-title {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 170rpx;
|
|
|
|
|
|
position: relative;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-text {
|
|
|
|
|
|
line-height: 130rpx;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
margin-left: 60rpx;
|
|
|
|
|
|
}
|
2025-02-28 17:27:27 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-text-dark {
|
|
|
|
|
|
line-height: 130rpx;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
margin-left: 60rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
}
|
2025-02-28 17:27:27 +08:00
|
|
|
|
|
2025-03-04 17:29:52 +08:00
|
|
|
|
.right-container-right-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 60rpx;
|
|
|
|
|
|
right: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
height: 15rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-28 17:27:27 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-father {
|
|
|
|
|
|
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 35rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
border: 2rpx solid #fff;
|
|
|
|
|
|
background-image: url('/static/index/mountain.png');
|
2025-02-28 17:27:27 +08:00
|
|
|
|
background-color: rgba(200, 216, 238, 0.8);
|
|
|
|
|
|
// background-image: url('/static/index/mountain.png');
|
|
|
|
|
|
background-position: 60% 50%;
|
|
|
|
|
|
/* 背景颜色 #f4f9ff，透明度 70% */
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
// justify-content: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
|
|
|
|
|
|
.uni-margin-wrap {
|
|
|
|
|
|
margin-top: 200rpx;
|
|
|
|
|
|
// width: 1200rpx;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
|
|
|
|
|
|
.swiper {
|
|
|
|
|
|
height: 900rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.swiper-item-flex {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.swiper-item {
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
height: 300rpx;
|
|
|
|
|
|
line-height: 300rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-tra-next {
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
width: 700rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-view-fin {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
margin-left: -50rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-start {
|
|
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
background: linear-gradient(to top, #047ADB, #0EA7DD);
|
|
|
|
|
|
border-left: 2rpx solid #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
margin-right: 25rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-end {
|
|
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-end-dark {
|
|
|
|
|
|
width: 220rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 50rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
background: linear-gradient(to top, #6B87BA, #FFFFFF);
|
|
|
|
|
|
/* 渐变从下到上 */
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-bottom: 20rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 5rpx;
|
|
|
|
|
|
// margin-left: 50rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font {
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 90rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 90rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font {
|
|
|
|
|
|
font-size: 65rpx;
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
background: linear-gradient(to bottom, #7080A1, #263556);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font-dark {
|
|
|
|
|
|
font-size: 65rpx;
|
|
|
|
|
|
margin-top: 50rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-text {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
// color: #364464;
|
|
|
|
|
|
font-size: 70rpx;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
width: 800rpx;
|
|
|
|
|
|
margin-bottom: 50rpx;
|
|
|
|
|
|
line-height: 70rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.time-text-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 300rpx;
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-father {
|
|
|
|
|
|
// margin-left: 5%;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 560rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-03-03 17:43:20 +08:00
|
|
|
|
|
2025-02-28 17:27:27 +08:00
|
|
|
|
.right-container-right-down-left {
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-top: -150rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-dark {
|
|
|
|
|
|
margin-left: 50rpx;
|
|
|
|
|
|
margin-top: 60rpx;
|
|
|
|
|
|
width: 763rpx;
|
|
|
|
|
|
height: 430rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
box-shadow: 2rpx 0 0 2rpx;
|
|
|
|
|
|
background-color: rgb(22, 48, 76);
|
|
|
|
|
|
|
|
|
|
|
|
// background-image: url('/static/index/cardbgc/newbgc.png');
|
|
|
|
|
|
// background-position: 50% 60%;
|
|
|
|
|
|
border: 2rpx solid #fff;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-line {
|
|
|
|
|
|
width: 1px;
|
|
|
|
|
|
/* 线条的宽度 */
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #808080 50%, rgba(0, 0, 0, 0) 100%);
|
|
|
|
|
|
margin-left: -20rpx;
|
|
|
|
|
|
margin-right: 30rpx;
|
|
|
|
|
|
margin-top: 100rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 450rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-type {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0rpx;
|
|
|
|
|
|
left: -25rpx;
|
|
|
|
|
|
width: 250rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
|
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #414F6E;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-font-dark {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
|
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-img {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font-dark {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card {
|
|
|
|
|
|
margin-left: 50rpx;
|
|
|
|
|
|
margin-top: 60rpx;
|
|
|
|
|
|
width: 763rpx;
|
|
|
|
|
|
height: 430rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
border: 1rpx solid black;
|
|
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-line {
|
|
|
|
|
|
width: 1px;
|
|
|
|
|
|
/* 线条的宽度 */
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
/* 高度占满父容器 */
|
|
|
|
|
|
background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, #808080 50%, rgba(0, 0, 0, 0) 100%);
|
|
|
|
|
|
margin-left: -20rpx;
|
|
|
|
|
|
margin-right: 30rpx;
|
|
|
|
|
|
margin-top: 100rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 450rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-type {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0rpx;
|
|
|
|
|
|
left: -25rpx;
|
|
|
|
|
|
width: 250rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-card-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 15rpx;
|
|
|
|
|
|
left: 65rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
color: #414F6E;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-img {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 200rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font {
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-card-font-dark {
|
|
|
|
|
|
font-size: 50rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-down-right {
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-top: -150rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// align-items: center;
|
|
|
|
|
|
.right-container-right-title {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 170rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-text {
|
|
|
|
|
|
line-height: 130rpx;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
margin-left: 60rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-text-dark {
|
|
|
|
|
|
line-height: 130rpx;
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
font-weight: 600;
|
|
|
|
|
|
margin-left: 60rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-right-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 60rpx;
|
|
|
|
|
|
right: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
height: 15rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-left {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 45rpx;
|
|
|
|
|
|
border: 1rpx solid #fff;
|
|
|
|
|
|
// background-color: rgba(203, 219, 238, 0.8);
|
|
|
|
|
|
/* 背景颜色 #f4f9ff，透明度 70% */
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
background-color: rgba(201, 221, 244, 1);
|
|
|
|
|
|
/* 白色背景透明度为 10% */
|
|
|
|
|
|
background-image: url('/static/index/mountain.png');
|
|
|
|
|
|
background-position: 70% 45%;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
box-shadow: 0px 8rpx 16rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
// box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1); /* 阴影效果 */
|
|
|
|
|
|
/* 背景图片从左上角25%和30%的位置开始 */
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-left-dark {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
border-radius: 45rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
border: 2rpx solid transparent;
|
|
|
|
|
|
background:
|
|
|
|
|
|
url('/static/index/cardbgc/bgcdark.png') padding-box,
|
|
|
|
|
|
linear-gradient(45deg, #9bc4f8, #285399, #9bc4f8, #285399, #9bc4f8) border-box;
|
|
|
|
|
|
background-clip: padding-box, border-box;
|
|
|
|
|
|
background-color: rgba(12, 25, 47, 0.1);
|
2025-02-28 17:27:27 +08:00
|
|
|
|
background-color: rgb(22, 48, 76);
|
|
|
|
|
|
/* 背景颜色 #f4f9ff，透明度 70% */
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.uni-margin-wrap {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
// width: 100%;
|
|
|
|
|
|
|
|
|
|
|
|
.swiper {
|
|
|
|
|
|
height: 800rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.swiper-item-flex {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.swiper-item {
|
|
|
|
|
|
display: block;
|
|
|
|
|
|
height: 300rpx;
|
|
|
|
|
|
line-height: 300rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-fir-left-card-main-right {
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
|
// margin-left: 10rpx;
|
|
|
|
|
|
z-index: 11;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-fir {
|
|
|
|
|
|
width: 250rpx;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
// background-color: #047ADB;
|
|
|
|
|
|
margin-top: 0rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-view {
|
|
|
|
|
|
margin-left: 8rpx;
|
|
|
|
|
|
height: 750rpx;
|
|
|
|
|
|
// background-color: #047ADB;
|
|
|
|
|
|
overflow: auto;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
box-sizing: border-box;
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-view-dis {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 170rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-img {
|
|
|
|
|
|
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-text {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 10rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
margin-bottom: 5rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-text-dark {
|
|
|
|
|
|
width: 100%;
|
|
|
|
|
|
height: 10rpx;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
text-align: center;
|
|
|
|
|
|
margin-bottom: 5rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-shang {
|
|
|
|
|
|
margin-top: 40rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
width: 40rpx;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
height: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-huli-xia {
|
|
|
|
|
|
margin-bottom: 40rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
width: 40rpx;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
height: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-photo {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
margin-left: 50rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-photo-img {
|
|
|
|
|
|
width: 310rpx;
|
|
|
|
|
|
height: 350rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-photo-text {
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
color: #324160;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-photo-text-dark {
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-photo-change {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
flex-direction: column;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
margin-left: 90rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
margin-top: 100rpx;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
.right-container-photo-img {
|
|
|
|
|
|
width: 510rpx;
|
|
|
|
|
|
height: 550rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-photo-text {
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
color: #324160;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-photo-text-dark {
|
|
|
|
|
|
font-size: 40rpx;
|
|
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-fir-left-card-main-left {
|
|
|
|
|
|
height: 50rpx;
|
|
|
|
|
|
width: 50rpx;
|
|
|
|
|
|
// margin-right: 22rpx;
|
|
|
|
|
|
margin-left: 30rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-left-type {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 42rpx;
|
|
|
|
|
|
left: -15rpx;
|
|
|
|
|
|
width: 235rpx;
|
|
|
|
|
|
height: 73rpx;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.right-container-left-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 51rpx;
|
|
|
|
|
|
left: 50rpx;
|
|
|
|
|
|
font-size: 36rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-tra-thi-open {
|
|
|
|
|
|
margin-left: 80rpx;
|
|
|
|
|
|
margin-top: 70rpx;
|
|
|
|
|
|
height: 100%;
|
|
|
|
|
|
width: 550rpx;
|
|
|
|
|
|
position: relative;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
|
|
|
|
|
|
.time-text {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
width: 450rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
line-height: 40rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-text-dark {
|
|
|
|
|
|
margin-left: 10rpx;
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 35rpx;
|
|
|
|
|
|
width: 450rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
line-height: 40rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-tra-thi-zhixing {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 75rpx;
|
|
|
|
|
|
left: 450rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-tra-thi-zhixing-font {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 60rpx;
|
|
|
|
|
|
left: 10rpx;
|
|
|
|
|
|
width: 100rpx;
|
|
|
|
|
|
height: 40rpx;
|
|
|
|
|
|
font-size: 25rpx;
|
|
|
|
|
|
border-radius: 5rpx;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
z-index: 10;
|
|
|
|
|
|
background-color: rgb(243, 123, 91);
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-two {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-top: 40rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 10rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font {
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-thi {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
// margin-bottom: 15rpx;
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 5rpx;
|
|
|
|
|
|
margin-left: 5rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font {
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
// width: 300rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 30rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-view {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
// margin-top: 80rpx;
|
|
|
|
|
|
margin-left: 0rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-start {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
background: linear-gradient(to bottom, #AF8ED7, #4D3E9B);
|
|
|
|
|
|
border-left: 2rpx solid #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
margin-right: 25rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-end {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-end-dark {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
background: linear-gradient(to top, #6B87BA, #FFFFFF);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font {
|
|
|
|
|
|
font-size: 70rpx;
|
|
|
|
|
|
margin-top: 120rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
background: linear-gradient(to bottom, #7080A1, #263556);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font-dark {
|
|
|
|
|
|
font-size: 70rpx;
|
|
|
|
|
|
margin-top: 120rpx;
|
|
|
|
|
|
margin-bottom: 40rpx;
|
|
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-text-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 300rpx;
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-tra-sec {
|
|
|
|
|
|
margin-left: 80rpx;
|
2025-03-04 17:29:52 +08:00
|
|
|
|
margin-top: 50rpx;
|
2025-02-28 17:27:27 +08:00
|
|
|
|
height: 100%;
|
|
|
|
|
|
width: 500rpx;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-thi {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-bottom: 15rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 42rpx;
|
|
|
|
|
|
height: 42rpx;
|
|
|
|
|
|
margin-right: 5rpx;
|
|
|
|
|
|
margin-left: 5rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font {
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
margin-right: 20rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-thi-change {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-bottom: 15rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-img {
|
|
|
|
|
|
width: 60rpx;
|
|
|
|
|
|
height: 60rpx;
|
|
|
|
|
|
margin-right: 8rpx;
|
|
|
|
|
|
margin-left: 8rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font {
|
|
|
|
|
|
// color: #586787;
|
|
|
|
|
|
font-size: 45rpx;
|
|
|
|
|
|
margin-right: 30rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
// width: 300rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-people-font-dark {
|
|
|
|
|
|
color: #CDD6EA;
|
|
|
|
|
|
font-size: 45rpx;
|
|
|
|
|
|
margin-right: 30rpx;
|
|
|
|
|
|
text-overflow: ellipsis;
|
|
|
|
|
|
white-space: nowrap;
|
|
|
|
|
|
overflow: hidden;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-view {
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
margin-top: 25rpx;
|
|
|
|
|
|
margin-left: 0rpx;
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-start {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
background: linear-gradient(to top, #0DA0B1, #04D3AF);
|
|
|
|
|
|
border-left: 2rpx solid #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
color: #fff;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
margin-right: 25rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-end {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
background-color: #fff;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-button-end-dark {
|
|
|
|
|
|
width: 230rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
border-radius: 40rpx;
|
|
|
|
|
|
display: flex;
|
|
|
|
|
|
justify-content: center;
|
|
|
|
|
|
align-items: center;
|
|
|
|
|
|
font-size: 32rpx;
|
|
|
|
|
|
box-shadow: 3rpx 3rpx 10rpx rgba(0, 0, 0, 0.3);
|
|
|
|
|
|
background: linear-gradient(to top, #6B87BA, #FFFFFF);
|
|
|
|
|
|
transition: all 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font {
|
|
|
|
|
|
font-size: 75rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
background: linear-gradient(to bottom, #7080A1, #263556);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
transition: font-size 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-font-dark {
|
|
|
|
|
|
font-size: 75rpx;
|
|
|
|
|
|
margin-top: 30rpx;
|
|
|
|
|
|
margin-bottom: 10rpx;
|
|
|
|
|
|
background: linear-gradient(to bottom, #FFFFFF, #B2C8E2);
|
|
|
|
|
|
-webkit-background-clip: text;
|
|
|
|
|
|
color: transparent;
|
|
|
|
|
|
font-weight: 700;
|
|
|
|
|
|
transition: font-size 0.4s ease-in-out;
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
.time-text-img {
|
|
|
|
|
|
position: absolute;
|
|
|
|
|
|
top: 0;
|
|
|
|
|
|
left: 300rpx;
|
|
|
|
|
|
width: 80rpx;
|
|
|
|
|
|
height: 80rpx;
|
|
|
|
|
|
}
|
2025-03-03 17:43:20 +08:00
|
|
|
|
|
2025-02-28 17:27:27 +08:00
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//左下角结束
|
2025-02-27 17:15:17 +08:00
|
|
|
|
}
|
|
|
|
|
|
}
|
2025-02-18 17:11:31 +08:00
|
|
|
|
</style>
|
