Skip to content

Commit 615247f

Browse files
wu-clanwu-clan
committed
update docs
1 parent 2508cb8 commit 615247f

File tree

10 files changed

+223
-104
lines changed

10 files changed

+223
-104
lines changed

‎docs/.vuepress/client.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -6,13 +6,15 @@ import './styles/custom.css'
66
import Swiper from "./components/Swiper.vue";
77
import SponsorPanel from "./components/SponsorPanel.vue";
88
import SponsorHome from './components/SponsorHome.vue';
9+
import SponsorSidebar from './components/SponsorSidebar.vue';
910

1011
export default defineClientConfig({
1112
enhance({ app }) {
1213
app.component('RepoCard', RepoCard)
1314
app.component('Swiper', Swiper)
1415
app.component('SponsorPanel', SponsorPanel)
1516
app.component('SponsorHome', SponsorHome)
17+
app.component('SponsorSidebar', SponsorSidebar)
1618
},
1719
layouts: {
1820
Layout,

‎docs/.vuepress/components/SponsorHome.vue

Lines changed: 51 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -1,84 +1,83 @@
11
<script setup lang="ts">
2-
32
import { homeSponsor } from "../data/sponsors";
4-
53
</script>
64

75
<template>
8-
<section v-if="homeSponsor.href && homeSponsor.link" id="special-spsr">
9-
<span>特别赞助商</span>
10-
<a :href="homeSponsor.href" target="_blank">
11-
<img width="168" height="42" :src="homeSponsor.link" :alt="homeSponsor.alt" />
12-
</a>
13-
<span>{{ homeSponsor.text }}</span>
14-
</section>
15-
<section v-else id="special-spsr">
16-
<span>
17-
<a class="no-sponsor" href="/fastapi_best_architecture_docs/sponsors#展位赞助商">
18-
特别赞助位目前空缺 - 现在咨询
19-
</a>
20-
</span>
21-
</section>
6+
<section v-if="homeSponsor.href && homeSponsor.link" id="special-spsr">
7+
<span>特别赞助商</span>
8+
<a :href="homeSponsor.href" target="_blank">
9+
<img width="121" :src="homeSponsor.link" :alt="homeSponsor.alt" />
10+
</a>
11+
<span>{{ homeSponsor.description }}</span>
12+
</section>
13+
<section v-else id="special-spsr">
14+
<span class="no-sponsor">
15+
<a href="/fastapi_best_architecture_docs/sponsors#展位赞助商">特别赞助位目前空缺 - 现在咨询 💬</a>
16+
</span>
17+
</section>
2218
</template>
2319

2420
<style scoped>
25-
.no-sponsor{
26-
color: var(--vp-c-brand-1)
21+
.no-sponsor {
22+
animation: no-sponsor 2s ease-in-out infinite;
23+
display: flex;
24+
justify-content: center;
25+
padding: 0 24px;
26+
color: var(--vp-c-brand-1) !important;
2727
}
2828
29-
.no-sponsor:hover {
30-
color: var(--vp-c-brand-2) !important;
29+
@keyframes no-sponsor {
30+
0%,
31+
100% {
32+
opacity: 1;
33+
}
34+
50% {
35+
opacity: 0.3;
36+
}
3137
}
3238
3339
#special-spsr {
34-
border-top: 1px solid var(--vp-c-divider);
35-
border-bottom: 1px solid var(--vp-c-divider);
36-
padding: 12px 24px;
37-
display: flex;
38-
align-items: center;
39-
margin: 0 -9999px;
40-
padding: 1 9999px;
40+
border-top: 1px solid var(--vp-c-divider);
41+
border-bottom: 1px solid var(--vp-c-divider);
42+
padding: 12px;
43+
display: flex;
44+
align-items: center;
45+
margin: 0 -9999px;
46+
padding: 1 9999px;
4147
}
4248
4349
#special-spsr span {
44-
color: var(--vp-c-text-2);
45-
font-weight: 500;
46-
font-size: 13px;
47-
vertical-align: middle;
48-
flex: 1;
50+
color: var(--vp-c-text-2);
51+
font-size: 13px;
52+
vertical-align: middle;
53+
flex: 1;
4954
}
5055
5156
#special-spsr span:first-child {
52-
text-align: right;
53-
}
54-
55-
#special-spsr a {
56-
display: flex;
57-
justify-content: center;
58-
padding: 0 24px;
57+
text-align: right;
5958
}
6059
6160
#special-spsr img {
62-
height: 42px;
63-
margin: -6px 0;
61+
height: 52px;
62+
margin: -6px 0;
6463
}
6564
6665
.dark #special-spsr img {
67-
filter: grayscale(1) invert(1);
66+
filter: grayscale(1) invert(1);
6867
}
6968
7069
@media (max-width: 576px) {
71-
#special-spsr {
72-
flex-direction: column;
73-
}
70+
#special-spsr {
71+
flex-direction: column;
72+
}
7473
75-
#special-spsr img {
76-
height: 36px;
77-
margin: 8px 0;
78-
}
74+
#special-spsr img {
75+
height: 52px;
76+
margin: 8px 0;
77+
}
7978
80-
#special-spsr span {
81-
text-align: center !important;
82-
}
79+
#special-spsr span {
80+
text-align: center !important;
81+
}
8382
}
8483
</style>

‎docs/.vuepress/components/SponsorPanel.vue

Lines changed: 32 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,9 @@
11
<template>
2-
<div class="sponsor-container">
3-
<!-- Gold Sponsors -->
2+
<div class="sponsor-header" @click="toggleCollapse">
3+
<span>倾情赞助</span>
4+
<span class="toggle-icon">{{ isCollapsed ? "<" : ">" }}</span>
5+
</div>
6+
<div class="sponsor-container" v-if="!isCollapsed">
47
<div class="gold-sponsors">
58
<div
69
v-for="(sponsor, index) in goldSponsors"
@@ -12,8 +15,6 @@
1215
<span v-else class="sponsor-text">{{ sponsor.text }}</span>
1316
</div>
1417
</div>
15-
16-
<!-- General Sponsors -->
1718
<div class="general-sponsors">
1819
<div
1920
v-for="(sponsor, index) in generalSponsors"
@@ -29,31 +30,53 @@
2930
</template>
3031

3132
<script setup>
33+
import { ref } from "vue";
3234
import { goldSponsors, generalSponsors } from "../data/sponsors";
3335
36+
const isCollapsed = ref(false);
37+
38+
const toggleCollapse = () => {
39+
isCollapsed.value = !isCollapsed.value;
40+
};
41+
3442
const openSponsorLink = (href) => {
3543
window.open(href, "_blank");
3644
};
3745
</script>
3846

3947
<style scoped>
48+
.sponsor-header {
49+
display: flex;
50+
justify-content: space-between;
51+
align-items: center;
52+
cursor: pointer;
53+
font-size: 11px;
54+
color: var(--vp-c-text-3);
55+
margin: 3px 0 2px;
56+
}
57+
58+
.toggle-icon {
59+
font-size: 10px;
60+
transform: scale(1.2);
61+
opacity: 0.7;
62+
}
63+
4064
.sponsor-container {
4165
display: flex;
4266
flex-direction: column;
43-
gap: 5px;
44-
margin: 10px 0;
67+
gap: 3px;
4568
}
4669
4770
.gold-sponsors {
4871
display: flex;
4972
flex-direction: column;
50-
gap: 5px;
73+
gap: 3px;
5174
}
5275
5376
.general-sponsors {
5477
display: grid;
5578
grid-template-columns: repeat(2, 1fr);
56-
gap: 4px;
79+
gap: 3px;
5780
}
5881
5982
.sponsor-item {
@@ -85,6 +108,6 @@ const openSponsorLink = (href) => {
85108
}
86109
87110
.sponsor-item.gold .sponsor-text {
88-
font-size: 14px;
111+
font-size: 12px;
89112
}
90113
</style>

‎docs/.vuepress/components/SponsorSidebar.vue

Lines changed: 71 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,71 @@
1+
<template>
2+
<div class="sponsor-header">
3+
<span>独家赞助</span>
4+
</div>
5+
<div class="sponsor-container">
6+
<div class="sidebar-sponsors">
7+
<div class="sponsor" @click="openSponsorLink(homeSponsor.href)">
8+
<img v-if="homeSponsor.link" :src="homeSponsor.link" :alt="homeSponsor.alt" class="sponsor-image" />
9+
<span v-else class="sponsor-text">{{ homeSponsor.text }}</span>
10+
</div>
11+
</div>
12+
</div>
13+
</template>
14+
15+
<script setup>
16+
import { homeSponsor } from "../data/sponsors";
17+
18+
const openSponsorLink = (href) => {
19+
window.open(href, "_blank");
20+
};
21+
</script>
22+
23+
<style scoped>
24+
.sponsor-header {
25+
font-size: 11px;
26+
color: var(--vp-c-text-3);
27+
margin-top: 3px;
28+
}
29+
30+
.sponsor-container {
31+
display: flex;
32+
flex-direction: column;
33+
gap: 5px;
34+
}
35+
36+
.sidebar-sponsors {
37+
display: flex;
38+
flex-direction: column;
39+
gap: 5px;
40+
}
41+
42+
.sponsor {
43+
background-color: var(--vp-c-bg-safe);
44+
cursor: pointer;
45+
display: flex;
46+
align-items: center;
47+
justify-content: center;
48+
height: 89px;
49+
}
50+
51+
.sponsor:hover {
52+
border: 1px solid var(--vp-c-brand);
53+
}
54+
55+
.sponsor-image {
56+
width: 100%;
57+
height: 100%;
58+
object-fit: fill;
59+
}
60+
61+
.sponsor-text {
62+
color: var(--vp-c-text-3);
63+
font-size: 12px;
64+
}
65+
66+
@media (max-width: 576px) {
67+
.sponsor {
68+
height: 110px;
69+
}
70+
}
71+
</style>

‎docs/.vuepress/components/Swiper.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -179,7 +179,7 @@ onMounted(() => {
179179
v-bind="$attrs"
180180
@swiper="onSwiper"
181181
>
182-
<SwiperSlide v-for="(item, index) in slideList" :key="index">
182+
<SwiperSlide v-for="(item, index) in slideList" :key="'general-' + index">
183183
<a
184184
v-if="item.href && item.link"
185185
:href="item.href"

‎docs/.vuepress/data/sponsors.ts

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,9 +5,10 @@ const sponsorUrl: string = typeof window !== 'undefined' ? window.location.origi
55
export const homeSponsor = ref(
66
{
77
link: '',
8-
text: 'fba 官方合作伙伴',
8+
text: '成为赞助商',
99
href: '',
1010
alt: 'wu-clan',
11+
description: 'fba 官方合作伙伴',
1112
}
1213
)
1314

‎docs/.vuepress/layouts/Layout.vue

Lines changed: 14 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,20 +1,25 @@
11
<script setup>
2-
import { Layout } from 'vuepress-theme-plume/client'
2+
import { Layout } from "vuepress-theme-plume/client";
33
import SponsorPanel from "../components/SponsorPanel.vue";
44
</script>
55

66
<template>
7-
<Layout>
8-
<template #aside-outline-after>
9-
<div class="custom-content">
10-
<SponsorPanel />
11-
</div>
12-
</template>
13-
</Layout>
7+
<Layout>
8+
<template #aside-outline-after>
9+
<div class="custom-content">
10+
<SponsorPanel />
11+
</div>
12+
</template>
13+
<template #sidebar-nav-before>
14+
<div class="custom-content">
15+
<SponsorSidebar />
16+
</div>
17+
</template>
18+
</Layout>
1419
</template>
1520

1621
<style>
1722
.custom-content {
18-
width: 100%;
23+
width: 100%;
1924
}
2025
</style>

‎docs/README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -60,7 +60,7 @@ import { goldSponsors, generalSponsors } from '@source/.vuepress/data/sponsors'
6060
:items="goldSponsors"
6161
mode="broadcast"
6262
:loop="false"
63-
:height="212"
63+
:height="162"
6464
:slides-per-view="3"
6565
:space-between="10"
6666
mousewheel
@@ -71,7 +71,7 @@ mousewheel
7171
<Swiper
7272
:items="generalSponsors"
7373
mode="carousel"
74-
:height="156"
74+
:height="168"
7575
:slides-per-view="4"
7676
:space-between="10"
7777
:speed="5000"

0 commit comments

Comments
 (0)