chore(cp活动): 替换图片和样式为金牛座时期
This commit is contained in:
parent
5597764c36
commit
7f0dbf426c
@ -2,7 +2,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<itemCenter
|
<itemCenter
|
||||||
style="min-height: 181.6vw"
|
style="min-height: 181.6vw"
|
||||||
:imgUrl="imageUrl('lotteryBg')"
|
:imgUrl="imageUrl('TaurusLotteryBg')"
|
||||||
:contentStyle="`flex-direction: column;justify-content: flex-start;gap: 5vw`"
|
:contentStyle="`flex-direction: column;justify-content: flex-start;gap: 5vw`"
|
||||||
>
|
>
|
||||||
<!-- 中奖历史按钮 -->
|
<!-- 中奖历史按钮 -->
|
||||||
|
|||||||
@ -16,12 +16,22 @@
|
|||||||
class="barrage-item"
|
class="barrage-item"
|
||||||
style="
|
style="
|
||||||
position: absolute;
|
position: absolute;
|
||||||
border-radius: 26px;
|
|
||||||
padding: 8px;
|
padding: 8px;
|
||||||
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 2vw;
|
gap: 2vw;
|
||||||
backdrop-filter: blur(1px);
|
|
||||||
|
border-radius: 100px;
|
||||||
|
border: 1px solid #ffffff80;
|
||||||
|
background: rgba(240, 240, 240, 0.3);
|
||||||
|
box-shadow:
|
||||||
|
-42px 103px 31px 0 rgba(145, 145, 145, 0),
|
||||||
|
-27px 66px 29px 0 rgba(145, 145, 145, 0.01),
|
||||||
|
-15px 37px 24px 0 rgba(145, 145, 145, 0.03),
|
||||||
|
-7px 17px 18px 0 rgba(145, 145, 145, 0.04),
|
||||||
|
-2px 4px 10px 0 rgba(145, 145, 145, 0.05);
|
||||||
|
backdrop-filter: blur(7.5px);
|
||||||
"
|
"
|
||||||
:style="getBarrageStyle(item)"
|
:style="getBarrageStyle(item)"
|
||||||
@animationend="handleAnimationEnd(item.id)"
|
@animationend="handleAnimationEnd(item.id)"
|
||||||
@ -49,7 +59,7 @@
|
|||||||
>
|
>
|
||||||
<img
|
<img
|
||||||
v-smart-img
|
v-smart-img
|
||||||
:src="imageUrl('coupleSign')"
|
:src="imageUrl('TaurusCoupleSign')"
|
||||||
alt=""
|
alt=""
|
||||||
style="width: 5vw; display: block; object-fit: cover"
|
style="width: 5vw; display: block; object-fit: cover"
|
||||||
/>
|
/>
|
||||||
@ -135,10 +145,6 @@ const getBarrageStyle = (item) => {
|
|||||||
animationDuration: `${item.duration}s`,
|
animationDuration: `${item.duration}s`,
|
||||||
animationDelay: `${item.delay}s`,
|
animationDelay: `${item.delay}s`,
|
||||||
'--start-pos': `${item.startPos}px`,
|
'--start-pos': `${item.startPos}px`,
|
||||||
borderRadius: '200px',
|
|
||||||
background:
|
|
||||||
'radial-gradient(44.73% 89.31% at 30.77% 68.52%, rgba(149, 255, 250, 0.70) 0%, rgba(149, 255, 250, 0.00) 100%), radial-gradient(57.68% 103.36% at 65.38% 100%, #8EB2FF 0%, rgba(142, 178, 255, 0.00) 100%), radial-gradient(390.09% 113.35% at 100% 0%, #CFAFFF 0%, rgba(207, 175, 255, 0.00) 100%), radial-gradient(189.62% 90.06% at 5.38% 7.41%, #FFCCC1 0%, rgba(255, 204, 193, 0.00) 100%), #FFF',
|
|
||||||
border: '1px solid rgba(0, 0, 0, 0.05)',
|
|
||||||
// RTL布局支持
|
// RTL布局支持
|
||||||
...(isRTL
|
...(isRTL
|
||||||
? {
|
? {
|
||||||
|
|||||||
@ -3,7 +3,9 @@
|
|||||||
<!-- 预加载状态 -->
|
<!-- 预加载状态 -->
|
||||||
<div v-show="isLoading" class="loading-container">
|
<div v-show="isLoading" class="loading-container">
|
||||||
<!-- 页面背景 -->
|
<!-- 页面背景 -->
|
||||||
<BackgroundLayer :backgroundImages="[imageUrl('bg1'), imageUrl('bg2'), imageUrl('bg3')]" />
|
<BackgroundLayer
|
||||||
|
:backgroundImages="[imageUrl('TaurusBg1'), imageUrl('TaurusBg2'), imageUrl('TaurusBg3')]"
|
||||||
|
/>
|
||||||
|
|
||||||
<!-- 加载动画 -->
|
<!-- 加载动画 -->
|
||||||
<LoadingSpinner />
|
<LoadingSpinner />
|
||||||
@ -18,11 +20,11 @@
|
|||||||
<!-- 页面背景 -->
|
<!-- 页面背景 -->
|
||||||
<BackgroundLayer
|
<BackgroundLayer
|
||||||
:backgroundImages="[
|
:backgroundImages="[
|
||||||
imageUrl('bg1'),
|
imageUrl('TaurusBg1'),
|
||||||
imageUrl('bg2'),
|
imageUrl('TaurusBg2'),
|
||||||
imageUrl('bg3'),
|
imageUrl('TaurusBg3'),
|
||||||
imageUrl('bg4'),
|
imageUrl('TaurusBg4'),
|
||||||
imageUrl('bg5'),
|
imageUrl('TaurusBg5'),
|
||||||
]"
|
]"
|
||||||
/>
|
/>
|
||||||
|
|
||||||
@ -1468,7 +1470,7 @@ const twelveSigns = ref([
|
|||||||
{ name: 'Aquarius', time: '2026.1.20-2.18', bgUrl: imageUrl('AquariusCoupleFrame') }, // 水瓶座
|
{ name: 'Aquarius', time: '2026.1.20-2.18', bgUrl: imageUrl('AquariusCoupleFrame') }, // 水瓶座
|
||||||
{ name: 'Pisces', time: '2026.2.19-3.20', bgUrl: imageUrl('PiscesCoupleFrame') }, // 双鱼座
|
{ name: 'Pisces', time: '2026.2.19-3.20', bgUrl: imageUrl('PiscesCoupleFrame') }, // 双鱼座
|
||||||
{ name: 'Aries', time: '2026.3.21-4.19', bgUrl: imageUrl('AriesCoupleFrame') }, // 白羊座
|
{ name: 'Aries', time: '2026.3.21-4.19', bgUrl: imageUrl('AriesCoupleFrame') }, // 白羊座
|
||||||
{ name: 'Taurus', time: '2026.4.20-5.20', bgUrl: imageUrl('') }, // 金牛座
|
{ name: 'Taurus', time: '2026.4.20-5.20', bgUrl: imageUrl('TaurusCoupleFrame') }, // 金牛座
|
||||||
{ name: 'Gemini', time: '2026.5.21-6.21', bgUrl: imageUrl('') }, // 双子座
|
{ name: 'Gemini', time: '2026.5.21-6.21', bgUrl: imageUrl('') }, // 双子座
|
||||||
{ name: 'Cancer', time: '2026.6.22-7.22', bgUrl: imageUrl('') }, // 巨蟹座
|
{ name: 'Cancer', time: '2026.6.22-7.22', bgUrl: imageUrl('') }, // 巨蟹座
|
||||||
{ name: 'Leo', time: '2026.7.23-8.22', bgUrl: imageUrl('') }, // 狮子座
|
{ name: 'Leo', time: '2026.7.23-8.22', bgUrl: imageUrl('') }, // 狮子座
|
||||||
@ -1912,14 +1914,14 @@ const initData = async () => {
|
|||||||
const preloadCriticalImages = async () => {
|
const preloadCriticalImages = async () => {
|
||||||
const criticalImages = [
|
const criticalImages = [
|
||||||
// 背景
|
// 背景
|
||||||
imageUrl('bg1'),
|
imageUrl('TaurusBg1'),
|
||||||
imageUrl('bg2'),
|
imageUrl('TaurusBg2'),
|
||||||
imageUrl('bg3'),
|
imageUrl('TaurusBg3'),
|
||||||
imageUrl('bg4'),
|
imageUrl('TaurusBg4'),
|
||||||
imageUrl('bg5'),
|
imageUrl('TaurusBg5'),
|
||||||
|
|
||||||
// 弹幕
|
// 弹幕
|
||||||
imageUrl('coupleSign'),
|
imageUrl('TaurusCoupleSign'),
|
||||||
|
|
||||||
// 情书
|
// 情书
|
||||||
imageUrl(getImgName('letterBg')),
|
imageUrl(getImgName('letterBg')),
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user