添加下载按钮

This commit is contained in:
谢宇宁
2026-10-13 14:15:08 +07:00
parent 048c503adc
commit 688e1267d2
2 changed files with 68 additions and 3 deletions
+67 -2
View File
@@ -8,11 +8,43 @@
<p class="brand-desc">{{ APP_DOMAIN }}</p>
</div>
</div>
<div v-if="groupLink" class="actions">
<button class="action" type="button" @click.stop="openLink(groupLink)">
<div class="actions">
<button v-if="groupLink" class="action" type="button" @click.stop="openLink(groupLink)">
<i class="action-ico telegram" />
<span>群聊</span>
</button>
<button class="action-dl" type="button" @click.stop="downloadMain">
<svg class="dl-ico" viewBox="0 0 24 24" aria-hidden="true">
<path
d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
<polyline
points="7 10 12 15 17 10"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
<line
x1="12"
y1="15"
x2="12"
y2="3"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
/>
</svg>
下载APP
</button>
</div>
<div class="banner" @click.stop="downloadMain" />
<div v-if="isIos" class="lite-bar" @click.stop="downloadLite" />
@@ -266,6 +298,39 @@ onBeforeUnmount(() => {
background-image: url('~/assets/image/candy/mobile/telegram.svg');
}
}
// 玻璃拟态胶囊,同 huangguo_landpage 导航栏的「下载 APP」
.action-dl {
display: inline-flex;
align-items: center;
justify-content: center;
gap: v(5);
height: v(32);
padding: 0 v(11);
border: 1px solid rgba(255, 255, 255, 0.18);
border-radius: 999px;
background: rgba(255, 255, 255, 0.08);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
color: #fff;
font-size: v(13);
font-weight: 600;
line-height: 1;
white-space: nowrap;
transition: background 0.25s ease, border-color 0.25s ease;
.dl-ico {
display: block;
width: v(15);
height: v(15);
flex-shrink: 0;
}
&:active {
background: rgba(255, 255, 255, 0.16);
border-color: rgba(255, 255, 255, 0.28);
}
}
}
.banner {
+1 -1
View File
@@ -20,7 +20,7 @@ export const TABS: { label: string; value: TabKey }[] = [
{ label: '推荐', value: 'hot' },
{ label: '国产', value: 'country' },
{ label: '乱伦', value: 'incest' },
{ label: '刚满18', value: 'adult' },
{ label: '萝莉岛', value: 'adult' },
]
export const TAB_CONTENTS: Record<TabKey, ContentCard[]> = {