mirror of
https://gitee.com/wot-design-uni/wot-design-uni.git
synced 2025-12-06 09:08:51 +08:00
Merge branch 'release'
This commit is contained in:
不如摸鱼去
commit
d06deda403
@ -1,7 +1,7 @@
|
||||
<!--
|
||||
* @Author: weisheng
|
||||
* @Date: 2025-09-21 17:13:45
|
||||
* @LastEditTime: 2025-09-21 19:53:54
|
||||
* @LastEditTime: 2025-09-21 22:57:29
|
||||
* @LastEditors: weisheng
|
||||
* @Description:
|
||||
* @FilePath: /wot-design-uni/docs/.vitepress/theme/components/AsideSponsors.vue
|
||||
@ -24,66 +24,66 @@ const goldSponsors = computed(() => {
|
||||
|
||||
// 判断金牌赞助数量是否为奇数
|
||||
const isGoldSponsorsOdd = computed(() => {
|
||||
return (goldSponsors.value?.items?.length||0) % 2 === 1
|
||||
return (goldSponsors.value?.items?.length || 0) % 2 === 1
|
||||
})
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="VPDocAsideSponsors">
|
||||
<a class="sponsors-aside-text" href="/reward/sponsor">赞助位</a>
|
||||
<div class="VPSponsors vp-sponsor aside">
|
||||
<!-- 超级赞助：一行一个 -->
|
||||
<section class="vp-sponsor-section" v-if="superSponsors?.items.length">
|
||||
<div class="VPSponsorsGrid vp-sponsor-grid mini" data-vp-grid="1">
|
||||
<div class="vp-sponsor-grid-item" v-for="sponsor in superSponsors.items" :key="sponsor.name">
|
||||
<a class="vp-sponsor-grid-link" :href="sponsor.url" target="_blank" rel="sponsored noopener">
|
||||
<article class="vp-sponsor-grid-box">
|
||||
<h4 class="visually-hidden">{{ sponsor.url }}</h4>
|
||||
<img v-if="sponsor.img" class="vp-sponsor-grid-image" :src="sponsor.img" :alt="sponsor.name">
|
||||
<span v-else class="vp-sponsor-grid-text">{{ sponsor.name }}</span>
|
||||
</article>
|
||||
</a>
|
||||
<div class="VPDocAsideSponsors">
|
||||
<a class="sponsors-aside-text" href="/reward/sponsor">赞助位</a>
|
||||
<div class="VPSponsors vp-sponsor aside">
|
||||
<!-- 超级赞助：一行一个 -->
|
||||
<section class="vp-sponsor-section" v-if="superSponsors?.items.length">
|
||||
<div class="VPSponsorsGrid vp-sponsor-grid mini" data-vp-grid="1">
|
||||
<div class="vp-sponsor-grid-item" v-for="sponsor in superSponsors.items" :key="sponsor.name">
|
||||
<a class="vp-sponsor-grid-link" :href="sponsor.url" target="_blank" rel="sponsored noopener">
|
||||
<article class="vp-sponsor-grid-box">
|
||||
<h4 class="visually-hidden">{{ sponsor.url }}</h4>
|
||||
<img v-if="sponsor.img" class="vp-sponsor-grid-image" :src="sponsor.img" :alt="sponsor.name">
|
||||
<span v-else class="vp-sponsor-grid-text">{{ sponsor.name }}</span>
|
||||
</article>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<!-- 金牌赞助：一行两个 -->
|
||||
<section class="vp-sponsor-section" v-if="goldSponsors?.items.length">
|
||||
<div class="VPSponsorsGrid vp-sponsor-grid xmini" data-vp-grid="2">
|
||||
<div class="vp-sponsor-grid-item" v-for="sponsor in goldSponsors.items" :key="sponsor.name">
|
||||
<a class="vp-sponsor-grid-link" :href="sponsor.url" target="_blank" rel="sponsored noopener">
|
||||
<article class="vp-sponsor-grid-box">
|
||||
<h4 class="visually-hidden">{{ sponsor.name }}</h4>
|
||||
<img v-if="sponsor.img" class="vp-sponsor-grid-image" :src="sponsor.img" :alt="sponsor.name">
|
||||
<span v-else class="vp-sponsor-grid-text">{{ sponsor.name }}</span>
|
||||
</article>
|
||||
</a>
|
||||
<!-- 金牌赞助：一行两个 -->
|
||||
<section class="vp-sponsor-section" v-if="goldSponsors?.items.length">
|
||||
<div class="VPSponsorsGrid vp-sponsor-grid xmini" data-vp-grid="2">
|
||||
<div class="vp-sponsor-grid-item" v-for="sponsor in goldSponsors.items" :key="sponsor.name">
|
||||
<a class="vp-sponsor-grid-link" :href="sponsor.url" target="_blank" rel="sponsored noopener">
|
||||
<article class="vp-sponsor-grid-box">
|
||||
<h4 class="visually-hidden">{{ sponsor.name }}</h4>
|
||||
<img v-if="sponsor.img" class="vp-sponsor-grid-image" :src="sponsor.img" :alt="sponsor.name">
|
||||
<span v-else class="vp-sponsor-grid-text">{{ sponsor.name }}</span>
|
||||
</article>
|
||||
</a>
|
||||
</div>
|
||||
<!-- 当金牌赞助为奇数时，默认赞助位填补到金牌赞助位置 -->
|
||||
<div class="vp-sponsor-grid-item" v-if="isGoldSponsorsOdd">
|
||||
<a class="vp-sponsor-grid-link" href="/reward/sponsor" rel="sponsored noopener">
|
||||
<article class="vp-sponsor-grid-box">
|
||||
<span class="vp-sponsor-grid-text">成为赞助商</span>
|
||||
</article>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<!-- 当金牌赞助为奇数时，默认赞助位填补到金牌赞助位置 -->
|
||||
<div class="vp-sponsor-grid-item" v-if="isGoldSponsorsOdd">
|
||||
<a class="vp-sponsor-grid-link" href="/reward/sponsor" rel="sponsored noopener">
|
||||
<article class="vp-sponsor-grid-box">
|
||||
<span class="vp-sponsor-grid-text">成为赞助商</span>
|
||||
</article>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<!-- 当金牌赞助为偶数或没有金牌赞助时，默认赞助位占据一整行 -->
|
||||
<section class="vp-sponsor-section" v-if="!isGoldSponsorsOdd || !goldSponsors?.items.length">
|
||||
<div class="VPSponsorsGrid vp-sponsor-grid xmini" data-vp-grid="1">
|
||||
<div class="vp-sponsor-grid-item">
|
||||
<a class="vp-sponsor-grid-link" href="/reward/sponsor" rel="sponsored noopener">
|
||||
<article class="vp-sponsor-grid-box">
|
||||
<span class="vp-sponsor-grid-text">成为赞助商</span>
|
||||
</article>
|
||||
</a>
|
||||
<!-- 当金牌赞助为偶数或没有金牌赞助时，默认赞助位占据一整行 -->
|
||||
<section class="vp-sponsor-section" v-if="!isGoldSponsorsOdd || !goldSponsors?.items.length">
|
||||
<div class="VPSponsorsGrid vp-sponsor-grid xmini" data-vp-grid="1">
|
||||
<div class="vp-sponsor-grid-item">
|
||||
<a class="vp-sponsor-grid-link" href="/reward/sponsor" rel="sponsored noopener">
|
||||
<article class="vp-sponsor-grid-box">
|
||||
<span class="vp-sponsor-grid-text">成为赞助商</span>
|
||||
</article>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
@ -96,6 +96,12 @@ const isGoldSponsorsOdd = computed(() => {
|
||||
color: var(--vp-c-gray-1);
|
||||
}
|
||||
|
||||
.vp-sponsor-grid-image {
|
||||
max-width: 120px;
|
||||
max-height: 72px !important;
|
||||
filter: none !important;
|
||||
}
|
||||
|
||||
a.sponsors-aside-text {
|
||||
color: var(--vp-c-text-3);
|
||||
display: block;
|
||||
|
||||
@ -7,7 +7,7 @@ interface Props {
|
||||
}
|
||||
|
||||
withDefaults(defineProps<Props>(), {
|
||||
title: '超级赞助',
|
||||
title: '铂金赞助商',
|
||||
})
|
||||
|
||||
const { data } = useAdSponsor()
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user