762 行
18 KiB
Vue
762 行
18 KiB
Vue
<template>
|
||
<view class="favorites-page" :class="['theme-' + currentThemeKey]" :style="navStyle">
|
||
<!-- 顶部沉浸式自定义导航栏 -->
|
||
<view class="custom-nav-bar">
|
||
<view class="nav-content">
|
||
<view class="btn-nav-back btn-active" @click="handleBack">
|
||
<image class="nav-back-icon" :src="ICONS.chevronLeft" mode="aspectFit" />
|
||
</view>
|
||
<view class="nav-title-wrap">
|
||
<text class="nav-title">我的收藏</text>
|
||
</view>
|
||
<!-- 胶囊右侧对称避让占位 -->
|
||
<view class="nav-capsule-placeholder"></view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 顶部导航栏占位（避免内容被固定导航栏遮挡） -->
|
||
<view class="nav-bar-placeholder"></view>
|
||
|
||
<!-- 顶部统计与在线过滤筛选栏 -->
|
||
<view class="filter-header-bar" v-if="!isLoading && allFavorites.length > 0">
|
||
<view class="header-stat-wrap">
|
||
<text class="stat-count-txt">已收藏 {{ allFavorites.length }} 位陪伴师</text>
|
||
</view>
|
||
<view
|
||
class="online-filter-pill btn-active"
|
||
:class="{ active: filterOnlyOnline }"
|
||
@click="filterOnlyOnline = !filterOnlyOnline"
|
||
>
|
||
<view class="filter-dot"></view>
|
||
<text class="filter-txt">仅看接单中</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 骨架加载屏 -->
|
||
<view class="favorites-loading" v-if="isLoading">
|
||
<view class="skeleton-card" v-for="n in 3" :key="n"></view>
|
||
</view>
|
||
|
||
<!-- 收藏列表内容区 -->
|
||
<scroll-view
|
||
v-else
|
||
scroll-y
|
||
class="favorites-scroll-view"
|
||
refresher-enabled
|
||
:refresher-triggered="isRefreshing"
|
||
@refresherrefresh="onRefresh"
|
||
>
|
||
<view class="favorites-list-wrap" v-if="displayedFavorites.length > 0">
|
||
<view
|
||
class="expert-fav-card card-active"
|
||
v-for="item in displayedFavorites"
|
||
:key="item.id"
|
||
@click="goToExpertDetail(item.id)"
|
||
>
|
||
<!-- 头像与在线徽章 -->
|
||
<view class="card-avatar-col">
|
||
<image class="expert-avatar" :src="item.avatar" mode="aspectFill" />
|
||
<view class="online-status-badge" :class="{ online: item.isOnline }">
|
||
<view class="status-dot"></view>
|
||
<text class="status-txt">{{ item.isOnline ? '接单中' : '休息中' }}</text>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 大神核心信息 -->
|
||
<view class="card-info-col">
|
||
<view class="name-row">
|
||
<text class="expert-nickname">{{ item.nickname }}</text>
|
||
<view class="gender-pill" :class="item.gender" v-if="item.gender && item.gender !== '保密'">
|
||
<image class="gender-svg" :src="item.gender === 'female' ? ICONS.female : ICONS.male" mode="aspectFit" />
|
||
</view>
|
||
<text class="track-tag">{{ item.track }}</text>
|
||
</view>
|
||
|
||
<view class="rank-row">
|
||
<text class="rank-tag">{{ item.rankName || '平台认证' }}</text>
|
||
<text class="rating-text">评分 {{ item.rating || '5.0' }}</text>
|
||
<text class="order-count-text">已接 {{ item.orderCount || 0 }} 单</text>
|
||
</view>
|
||
|
||
<!-- 技能标签胶囊 -->
|
||
<view class="tags-row" v-if="item.tags && item.tags.length > 0">
|
||
<text class="skill-tag" v-for="(t, idx) in item.tags.slice(0, 3)" :key="idx">{{ t }}</text>
|
||
</view>
|
||
|
||
<!-- 价格与操作栏 -->
|
||
<view class="card-bottom-row">
|
||
<view class="price-wrap">
|
||
<text class="price-symbol">¥</text>
|
||
<text class="price-value">{{ item.hourlyRate }}</text>
|
||
<text class="price-unit">/小时</text>
|
||
</view>
|
||
|
||
<view class="actions-group" @click.stop>
|
||
<button class="btn-unfav btn-active" @click="handleCancelFavorite(item)">
|
||
移除
|
||
</button>
|
||
<button class="btn-book-now btn-active" @click="goToExpertDetail(item.id)">
|
||
立即约玩
|
||
</button>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
|
||
<!-- 空状态展示 -->
|
||
<view class="empty-state-card" v-else>
|
||
<view class="empty-icon-wrap">
|
||
<image class="empty-star-svg" :src="ICONS.starOutline" mode="aspectFit" />
|
||
</view>
|
||
<text class="empty-title">{{ filterOnlyOnline ? '暂无接单中的在线陪伴师' : '暂未收藏心仪的陪伴师' }}</text>
|
||
<text class="empty-desc">前往首页大厅浏览各领域顶尖大神，点击收藏即可在这里快速找到他们</text>
|
||
<button class="btn-go-home btn-active" @click="goToHomePage">前往大厅发现</button>
|
||
</view>
|
||
</scroll-view>
|
||
</view>
|
||
</template>
|
||
|
||
<script setup>
|
||
import { ref, computed } from 'vue';
|
||
import { onShow } from '@dcloudio/uni-app';
|
||
import { ICONS } from '@/common/icons.js';
|
||
import { getCurrentThemeKey, applyThemeToNativeUI } from '@/common/theme.js';
|
||
import { getNavBarInfo } from '@/common/nav.js';
|
||
import { getFavorites, removeFavorite } from '@/common/api.js';
|
||
|
||
const currentThemeKey = ref(getCurrentThemeKey());
|
||
const navInfo = ref(getNavBarInfo());
|
||
const isLoading = ref(true);
|
||
const isRefreshing = ref(false);
|
||
const allFavorites = ref([]);
|
||
const filterOnlyOnline = ref(false);
|
||
|
||
const navStyle = computed(() => {
|
||
const info = navInfo.value || {};
|
||
return {
|
||
'--safe-header-gap': `${info.totalHeaderHeight || 88}px`,
|
||
'--capsule-right-space': `${info.capsuleRightSpace || 0}px`,
|
||
'--capsule-height': `${info.capsuleHeight || 32}px`
|
||
};
|
||
});
|
||
|
||
// 根据“仅看在线”进行过滤
|
||
const displayedFavorites = computed(() => {
|
||
if (filterOnlyOnline.value) {
|
||
return allFavorites.value.filter(item => item.isOnline);
|
||
}
|
||
return allFavorites.value;
|
||
});
|
||
|
||
const loadFavoritesList = async (showLoadingTip = false) => {
|
||
if (showLoadingTip) {
|
||
isLoading.value = true;
|
||
}
|
||
try {
|
||
const userId = uni.getStorageSync('userId') || 1001;
|
||
const list = await getFavorites(userId);
|
||
allFavorites.value = Array.isArray(list) ? list : [];
|
||
} catch (err) {
|
||
console.warn('[Favorites] 加载收藏列表异常:', err.message);
|
||
allFavorites.value = [];
|
||
} finally {
|
||
isLoading.value = false;
|
||
isRefreshing.value = false;
|
||
}
|
||
};
|
||
|
||
const onRefresh = async () => {
|
||
isRefreshing.value = true;
|
||
await loadFavoritesList(false);
|
||
};
|
||
|
||
const handleBack = () => {
|
||
const pages = getCurrentPages();
|
||
if (pages.length > 1) {
|
||
uni.navigateBack();
|
||
} else {
|
||
uni.switchTab({
|
||
url: '/pages/user/index'
|
||
});
|
||
}
|
||
};
|
||
|
||
const goToHomePage = () => {
|
||
uni.switchTab({
|
||
url: '/pages/index/index'
|
||
});
|
||
};
|
||
|
||
const goToExpertDetail = (expertId) => {
|
||
uni.navigateTo({
|
||
url: `/pages/expert/detail?id=${expertId}`
|
||
});
|
||
};
|
||
|
||
const handleCancelFavorite = (item) => {
|
||
uni.showModal({
|
||
title: '取消收藏',
|
||
content: `确定取消收藏陪伴师「${item.nickname}」吗？`,
|
||
confirmText: '确定移除',
|
||
confirmColor: '#EF4444',
|
||
cancelText: '保留',
|
||
success: async (res) => {
|
||
if (res.confirm) {
|
||
try {
|
||
uni.showLoading({ title: '正在移除...' });
|
||
const userId = uni.getStorageSync('userId') || 1001;
|
||
await removeFavorite(item.id, userId);
|
||
allFavorites.value = allFavorites.value.filter(fav => fav.id !== item.id);
|
||
uni.hideLoading();
|
||
uni.showToast({ title: '已取消收藏', icon: 'success' });
|
||
} catch (err) {
|
||
uni.hideLoading();
|
||
uni.showToast({ title: err.message || '操作失败', icon: 'none' });
|
||
}
|
||
}
|
||
}
|
||
});
|
||
};
|
||
|
||
onShow(() => {
|
||
navInfo.value = getNavBarInfo();
|
||
currentThemeKey.value = getCurrentThemeKey();
|
||
applyThemeToNativeUI(currentThemeKey.value);
|
||
loadFavoritesList(true);
|
||
});
|
||
</script>
|
||
|
||
<style lang="scss">
|
||
.favorites-page {
|
||
min-height: 100vh;
|
||
background-color: #0A0F1D;
|
||
box-sizing: border-box;
|
||
display: flex;
|
||
flex-direction: column;
|
||
}
|
||
|
||
// 顶部自定义沉浸式导航栏
|
||
.custom-nav-bar {
|
||
position: fixed;
|
||
top: 0;
|
||
left: 0;
|
||
right: 0;
|
||
height: var(--safe-header-gap);
|
||
background: rgba(10, 15, 29, 0.9);
|
||
backdrop-filter: blur(12px);
|
||
-webkit-backdrop-filter: blur(12px);
|
||
z-index: 1000;
|
||
border-bottom: 1px solid rgba(255, 255, 255, 0.06);
|
||
|
||
.nav-content {
|
||
position: absolute;
|
||
bottom: 0;
|
||
left: 0;
|
||
right: 0;
|
||
height: var(--capsule-height);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
padding: 0 24rpx;
|
||
|
||
.btn-nav-back {
|
||
width: 64rpx;
|
||
height: 64rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
background: rgba(255, 255, 255, 0.06);
|
||
border-radius: 32rpx;
|
||
|
||
.nav-back-icon {
|
||
width: 36rpx;
|
||
height: 36rpx;
|
||
}
|
||
}
|
||
|
||
.nav-title-wrap {
|
||
position: absolute;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
text-align: center;
|
||
pointer-events: none;
|
||
|
||
.nav-title {
|
||
font-size: 32rpx;
|
||
font-weight: 700;
|
||
color: #F8FAFC;
|
||
letter-spacing: 1rpx;
|
||
}
|
||
}
|
||
|
||
.nav-capsule-placeholder {
|
||
width: var(--capsule-right-space);
|
||
}
|
||
}
|
||
}
|
||
|
||
// 顶部固定导航栏高度占位，确保后续所有内容严格规避遮挡
|
||
.nav-bar-placeholder {
|
||
height: var(--safe-header-gap);
|
||
width: 100%;
|
||
flex-shrink: 0;
|
||
}
|
||
|
||
// 顶部统计与过滤栏
|
||
.filter-header-bar {
|
||
margin-top: 16rpx;
|
||
padding: 0 32rpx;
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: space-between;
|
||
margin-bottom: 16rpx;
|
||
flex-shrink: 0;
|
||
|
||
.header-stat-wrap {
|
||
.stat-count-txt {
|
||
font-size: 24rpx;
|
||
color: #94A3B8;
|
||
font-weight: 500;
|
||
}
|
||
}
|
||
|
||
.online-filter-pill {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 8rpx;
|
||
padding: 8rpx 20rpx;
|
||
background: rgba(255, 255, 255, 0.05);
|
||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||
border-radius: 24rpx;
|
||
transition: all 0.2s ease;
|
||
|
||
.filter-dot {
|
||
width: 12rpx;
|
||
height: 12rpx;
|
||
border-radius: 50%;
|
||
background: #64748B;
|
||
}
|
||
|
||
.filter-txt {
|
||
font-size: 22rpx;
|
||
color: #94A3B8;
|
||
}
|
||
|
||
&.active {
|
||
background: rgba(16, 185, 129, 0.15);
|
||
border-color: rgba(16, 185, 129, 0.4);
|
||
|
||
.filter-dot {
|
||
background: #10B981;
|
||
box-shadow: 0 0 8rpx #10B981;
|
||
}
|
||
|
||
.filter-txt {
|
||
color: #10B981;
|
||
font-weight: 600;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// 骨架屏
|
||
.favorites-loading {
|
||
margin-top: 24rpx;
|
||
padding: 0 32rpx;
|
||
|
||
.skeleton-card {
|
||
height: 240rpx;
|
||
background: rgba(255, 255, 255, 0.04);
|
||
border-radius: 24rpx;
|
||
margin-bottom: 24rpx;
|
||
animation: pulse 1.5s infinite;
|
||
}
|
||
}
|
||
|
||
// 页面滚动区
|
||
.favorites-scroll-view {
|
||
flex: 1;
|
||
padding: 0 32rpx;
|
||
box-sizing: border-box;
|
||
|
||
.favorites-list-wrap {
|
||
padding-bottom: calc(48rpx + env(safe-area-inset-bottom));
|
||
}
|
||
}
|
||
|
||
// 收藏大神卡片
|
||
.expert-fav-card {
|
||
display: flex;
|
||
gap: 24rpx;
|
||
background: #151D30;
|
||
border: 1px solid rgba(255, 255, 255, 0.08);
|
||
border-radius: 24rpx;
|
||
padding: 24rpx;
|
||
margin-bottom: 24rpx;
|
||
box-shadow: 0 8rpx 24rpx rgba(0, 0, 0, 0.2);
|
||
transition: all 0.2s ease;
|
||
|
||
.card-avatar-col {
|
||
position: relative;
|
||
width: 140rpx;
|
||
height: 140rpx;
|
||
flex-shrink: 0;
|
||
|
||
.expert-avatar {
|
||
width: 100%;
|
||
height: 100%;
|
||
border-radius: 20rpx;
|
||
border: 2rpx solid rgba(255, 255, 255, 0.1);
|
||
}
|
||
|
||
.online-status-badge {
|
||
position: absolute;
|
||
bottom: -8rpx;
|
||
left: 50%;
|
||
transform: translateX(-50%);
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 6rpx;
|
||
background: rgba(100, 116, 139, 0.9);
|
||
padding: 2rpx 10rpx;
|
||
border-radius: 12rpx;
|
||
white-space: nowrap;
|
||
|
||
.status-dot {
|
||
width: 8rpx;
|
||
height: 8rpx;
|
||
border-radius: 50%;
|
||
background: #CBD5E1;
|
||
}
|
||
|
||
.status-txt {
|
||
font-size: 18rpx;
|
||
color: #FFFFFF;
|
||
}
|
||
|
||
&.online {
|
||
background: rgba(5, 150, 105, 0.95);
|
||
|
||
.status-dot {
|
||
background: #34D399;
|
||
box-shadow: 0 0 6rpx #34D399;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.card-info-col {
|
||
flex: 1;
|
||
display: flex;
|
||
flex-direction: column;
|
||
justify-content: space-between;
|
||
|
||
.name-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 12rpx;
|
||
margin-bottom: 8rpx;
|
||
|
||
.expert-nickname {
|
||
font-size: 30rpx;
|
||
font-weight: 700;
|
||
color: #F8FAFC;
|
||
}
|
||
|
||
.gender-pill {
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
width: 28rpx;
|
||
height: 28rpx;
|
||
border-radius: 14rpx;
|
||
|
||
.gender-svg {
|
||
width: 20rpx;
|
||
height: 20rpx;
|
||
}
|
||
|
||
&.female {
|
||
background: rgba(244, 63, 94, 0.15);
|
||
}
|
||
&.male {
|
||
background: rgba(59, 130, 246, 0.15);
|
||
}
|
||
}
|
||
|
||
.track-tag {
|
||
font-size: 20rpx;
|
||
color: #818CF8;
|
||
background: rgba(99, 102, 241, 0.15);
|
||
padding: 2rpx 12rpx;
|
||
border-radius: 8rpx;
|
||
font-weight: 500;
|
||
}
|
||
}
|
||
|
||
.rank-row {
|
||
display: flex;
|
||
align-items: center;
|
||
gap: 14rpx;
|
||
margin-bottom: 12rpx;
|
||
|
||
.rank-tag {
|
||
font-size: 22rpx;
|
||
color: #F59E0B;
|
||
font-weight: 600;
|
||
}
|
||
|
||
.rating-text {
|
||
font-size: 22rpx;
|
||
color: #FBBF24;
|
||
}
|
||
|
||
.order-count-text {
|
||
font-size: 22rpx;
|
||
color: #64748B;
|
||
}
|
||
}
|
||
|
||
.tags-row {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 10rpx;
|
||
margin-bottom: 16rpx;
|
||
|
||
.skill-tag {
|
||
font-size: 20rpx;
|
||
color: #94A3B8;
|
||
background: rgba(255, 255, 255, 0.05);
|
||
padding: 4rpx 12rpx;
|
||
border-radius: 8rpx;
|
||
}
|
||
}
|
||
|
||
.card-bottom-row {
|
||
display: flex;
|
||
align-items: flex-end;
|
||
justify-content: space-between;
|
||
|
||
.price-wrap {
|
||
display: flex;
|
||
align-items: baseline;
|
||
|
||
.price-symbol {
|
||
font-size: 26rpx;
|
||
font-weight: 700;
|
||
color: #10B981;
|
||
}
|
||
|
||
.price-value {
|
||
font-size: 38rpx;
|
||
font-weight: 700;
|
||
color: #10B981;
|
||
margin: 0 4rpx;
|
||
font-variant-numeric: tabular-nums;
|
||
}
|
||
|
||
.price-unit {
|
||
font-size: 20rpx;
|
||
color: #64748B;
|
||
}
|
||
}
|
||
|
||
.actions-group {
|
||
display: flex;
|
||
gap: 14rpx;
|
||
|
||
.btn-unfav {
|
||
height: 60rpx;
|
||
line-height: 58rpx;
|
||
font-size: 22rpx;
|
||
color: #94A3B8;
|
||
background: rgba(255, 255, 255, 0.05);
|
||
border: 1px solid rgba(255, 255, 255, 0.1);
|
||
border-radius: 30rpx;
|
||
padding: 0 24rpx;
|
||
margin: 0;
|
||
}
|
||
|
||
.btn-book-now {
|
||
height: 60rpx;
|
||
line-height: 60rpx;
|
||
font-size: 24rpx;
|
||
font-weight: 600;
|
||
color: #FFFFFF;
|
||
background: linear-gradient(135deg, #6366F1, #8B5CF6);
|
||
border-radius: 30rpx;
|
||
padding: 0 28rpx;
|
||
margin: 0;
|
||
box-shadow: 0 4rpx 12rpx rgba(99, 102, 241, 0.35);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
// 空状态卡片
|
||
.empty-state-card {
|
||
margin-top: 80rpx;
|
||
display: flex;
|
||
flex-direction: column;
|
||
align-items: center;
|
||
text-align: center;
|
||
padding: 40rpx;
|
||
|
||
.empty-icon-wrap {
|
||
width: 140rpx;
|
||
height: 140rpx;
|
||
border-radius: 70rpx;
|
||
background: rgba(255, 255, 255, 0.03);
|
||
display: flex;
|
||
align-items: center;
|
||
justify-content: center;
|
||
margin-bottom: 28rpx;
|
||
|
||
.empty-star-svg {
|
||
width: 72rpx;
|
||
height: 72rpx;
|
||
opacity: 0.4;
|
||
}
|
||
}
|
||
|
||
.empty-title {
|
||
font-size: 30rpx;
|
||
font-weight: 600;
|
||
color: #F8FAFC;
|
||
margin-bottom: 12rpx;
|
||
}
|
||
|
||
.empty-desc {
|
||
font-size: 24rpx;
|
||
color: #64748B;
|
||
line-height: 1.5;
|
||
max-width: 480rpx;
|
||
margin-bottom: 40rpx;
|
||
}
|
||
|
||
.btn-go-home {
|
||
background: linear-gradient(135deg, #6366F1, #4F46E5);
|
||
color: #FFFFFF;
|
||
font-size: 26rpx;
|
||
font-weight: 600;
|
||
height: 72rpx;
|
||
line-height: 72rpx;
|
||
padding: 0 48rpx;
|
||
border-radius: 36rpx;
|
||
box-shadow: 0 4rpx 16rpx rgba(99, 102, 241, 0.35);
|
||
}
|
||
}
|
||
|
||
// 暖阳晨曦模式适配 (theme-warm)
|
||
.favorites-page.theme-warm {
|
||
background-color: #F8F6F0;
|
||
|
||
.custom-nav-bar {
|
||
background: rgba(248, 246, 240, 0.95);
|
||
border-color: #E7E5E4;
|
||
|
||
.nav-content {
|
||
.btn-nav-back {
|
||
background: #FFFFFF;
|
||
border: 1px solid #E7E5E4;
|
||
}
|
||
|
||
.nav-title-wrap .nav-title {
|
||
color: #1C1917;
|
||
}
|
||
}
|
||
}
|
||
|
||
.filter-header-bar {
|
||
.header-stat-wrap .stat-count-txt {
|
||
color: #78716C;
|
||
}
|
||
|
||
.online-filter-pill {
|
||
background: #FFFFFF;
|
||
border-color: #E7E5E4;
|
||
|
||
.filter-txt {
|
||
color: #78716C;
|
||
}
|
||
|
||
&.active {
|
||
background: #FFF7ED;
|
||
border-color: #EA580C;
|
||
|
||
.filter-dot {
|
||
background: #EA580C;
|
||
box-shadow: 0 0 8rpx #EA580C;
|
||
}
|
||
|
||
.filter-txt {
|
||
color: #EA580C;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.expert-fav-card {
|
||
background: #FFFFFF;
|
||
border-color: #F0ECE4;
|
||
box-shadow: 0 4rpx 20rpx rgba(28, 25, 23, 0.06);
|
||
|
||
.card-info-col {
|
||
.name-row .expert-nickname {
|
||
color: #1C1917;
|
||
}
|
||
|
||
.rank-row .order-count-text {
|
||
color: #A8A29E;
|
||
}
|
||
|
||
.tags-row .skill-tag {
|
||
background: #F5F2EC;
|
||
color: #78716C;
|
||
}
|
||
|
||
.card-bottom-row .actions-group {
|
||
.btn-unfav {
|
||
background: #F5F2EC;
|
||
border-color: #E7E5E4;
|
||
color: #78716C;
|
||
}
|
||
|
||
.btn-book-now {
|
||
background: linear-gradient(135deg, #F97316, #EA580C);
|
||
box-shadow: 0 4rpx 12rpx rgba(234, 88, 12, 0.35);
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
.empty-state-card {
|
||
.empty-icon-wrap {
|
||
background: #FFFFFF;
|
||
border: 1px solid #E7E5E4;
|
||
}
|
||
|
||
.empty-title {
|
||
color: #1C1917;
|
||
}
|
||
|
||
.empty-desc {
|
||
color: #78716C;
|
||
}
|
||
|
||
.btn-go-home {
|
||
background: linear-gradient(135deg, #F97316, #EA580C);
|
||
box-shadow: 0 4rpx 16rpx rgba(234, 88, 12, 0.35);
|
||
}
|
||
}
|
||
}
|
||
|
||
@keyframes pulse {
|
||
0% { opacity: 0.6; }
|
||
50% { opacity: 0.3; }
|
||
100% { opacity: 0.6; }
|
||
}
|
||
</style>
|