update docs

Author: wu-clan

docs/.vuepress/components/AsideNavAfter.vue

@@ -31,7 +31,7 @@ interface Locale {
   display: flex;
   flex-direction: column;
   padding: 8px 0;
-  margin: 8px 8px 0;
+  margin: 6px 8px 0;
   border-top: solid 1px var(--vp-c-divider);
 }
 

docs/.vuepress/components/SponsorHome.vue

@@ -8,7 +8,7 @@ import { homeSponsor } from "../data/sponsors";
     <a :href="homeSponsor.href" target="_blank">
       <img width="121" :src="homeSponsor.link" :alt="homeSponsor.alt" />
     </a>
-    <span>{{ homeSponsor.text || homeSponsor.alt }}</span>
+    <span>fba 官方合作伙伴</span>
   </section>
   <section v-else id="special-spsr">
     <span class="no-sponsor">

docs/.vuepress/components/SponsorPanel.vue

@@ -14,11 +14,14 @@
         class="sponsor-item gold"
         :class="{ 'collapsed-mode': isCollapsed }"
         @click="openSponsorLink(sponsor.href)"
-        v-show="!isCollapsed || (isCollapsed && hasValidText(sponsor))"
+        v-show="!isCollapsed || (isCollapsed && !sponsor.alt.includes('成为赞助商'))"
       >
         <img v-if="sponsor.link" :src="sponsor.link" :alt="sponsor.alt" class="sponsor-image" />
-        <span v-if="hasText(sponsor)" class="sponsor-text" :class="{ 'collapsed-text': isCollapsed }">
-          {{ sponsor.text || sponsor.alt }}
+        <span v-if="!isCollapsed && sponsor.alt.includes('成为赞助商')" class="sponsor-text">
+          {{ sponsor.alt }}
+        </span>
+        <span v-if="isCollapsed" class="sponsor-text collapsed-text">
+          {{ sponsor.alt }}
         </span>
       </div>
     </div>
@@ -29,32 +32,29 @@
         class="sponsor-item"
         :class="{ 'collapsed-mode': isCollapsed }"
         @click="openSponsorLink(sponsor.href)"
-        v-show="!isCollapsed || (isCollapsed && hasValidText(sponsor))"
+        v-show="!isCollapsed || (isCollapsed && !sponsor.alt.includes('成为赞助商'))"
       >
         <img v-if="sponsor.link" :src="sponsor.link" :alt="sponsor.alt" class="sponsor-image" />
-        <span v-if="hasText(sponsor)" class="sponsor-text" :class="{ 'collapsed-text': isCollapsed }">
-          {{ sponsor.text || sponsor.alt }}
+        <span v-if="!isCollapsed && sponsor.alt.includes('成为赞助商')" class="sponsor-text">
+          {{ sponsor.alt }}
+        </span>
+        <span v-if="isCollapsed" class="sponsor-text collapsed-text">
+          {{ sponsor.alt }}
         </span>
       </div>
     </div>
+    <div v-if="isCollapsed" class="sponsor-item become-sponsor" @click="openSponsorLink(sponsorUrl)">
+      <span class="sponsor-text">成为赞助商</span>
+    </div>
   </div>
 </template>
 
 <script setup>
 import { ref, onMounted } from "vue";
-import { goldSponsors, generalSponsors } from "../data/sponsors";
+import { sponsorUrl, goldSponsors, generalSponsors } from "../data/sponsors";
 
 const isCollapsed = ref(sessionStorage.getItem("sponsorCollapsed") === "true");
 
-const hasText = (sponsor) => {
-  return !!sponsor.text || !!sponsor.alt;
-};
-
-const hasValidText = (sponsor) => {
-  const text = sponsor.text || sponsor.alt || '';
-  return hasText(sponsor) && !text.includes('成为赞助商');
-};
-
 const toggleCollapse = () => {
   isCollapsed.value = !isCollapsed.value;
   sessionStorage.setItem("sponsorCollapsed", isCollapsed.value);
@@ -145,15 +145,11 @@ onMounted(() => {
 }
 
 .sponsor-item.gold .sponsor-text {
-  font-size: 12px;
+  font-size: 13px;
 }
 
-.sponsor-item.collapsed-mode {
-  height: 28px;
-}
-
-.sponsor-item.gold.collapsed-mode {
-  height: 32px;
+.collapsed-mode {
+  height: 32px !important;
 }
 
 .collapsed-mode .sponsor-image {
@@ -169,4 +165,9 @@ onMounted(() => {
 .collapsed-mode:hover .collapsed-text {
   color: var(--vp-c-text-1) !important;
 }
+
+.become-sponsor {
+  height: 32px;
+  background-color: unset;
+}
 </style>

docs/.vuepress/components/SponsorSidebar.vue

@@ -6,7 +6,7 @@
     <div class="sidebar-sponsor">
       <div class="sponsor" @click="openSponsorLink(homeSponsor.href)">
         <img v-if="homeSponsor.link" :src="homeSponsor.link" :alt="homeSponsor.alt" class="sponsor-image" />
-        <span v-else class="sponsor-text">{{ homeSponsor.text }}</span>
+        <span v-else class="sponsor-text">成为赞助商</span>
       </div>
     </div>
   </div>
@@ -59,7 +59,7 @@ const openSponsorLink = (href) => {
 
 .sponsor-text {
   color: var(--vp-c-text-3);
-  font-size: 12px;
+  font-size: 13px;
 }
 
 @media (max-width: 576px) {

docs/.vuepress/components/Swiper.vue

@@ -31,10 +31,6 @@ interface SlideItem {
    * 图片地址
    */
   link?: string;
-  /**
-   * 文字内容（当没有图片时使用）
-   */
-  text?: string;
   /**
    * 跳转链接
    */
@@ -189,17 +185,17 @@ onMounted(() => {
         >
           <img class="swiper-slide-custom-container swiper-slide-img" :src="item.link" :alt="item.alt" />
         </a>
-        <div v-else-if="item.text" class="swiper-slide-custom-container">
+        <div v-else-if="item.alt" class="swiper-slide-custom-container">
           <a
             v-if="item.href"
             :href="item.href"
             target="_blank"
             rel="noopener noreferrer"
             class="swiper-slide-text-link"
           >
-            <div class="swiper-slide-text">{{ item.text }}</div>
+            <div class="swiper-slide-text">{{ item.alt }}</div>
           </a>
-          <div v-else class="swiper-slide-text">{{ item.text }}</div>
+          <div v-else class="swiper-slide-text">{{ item.alt }}</div>
         </div>
       </SwiperSlide>
     </Swiper>

docs/.vuepress/data/sponsors.ts

@@ -1,72 +1,62 @@
 import { ref } from "vue";
 
-const sponsorUrl: string = typeof window !== 'undefined' ? window.location.origin + '/fastapi_best_architecture_docs/sponsors.html' : 'https://fastapi-practices.github.io/fastapi_best_architecture_docs/sponsors.html';
+export const sponsorUrl: string = typeof window !== 'undefined' ? window.location.origin + '/fastapi_best_architecture_docs/sponsors.html' : 'https://fastapi-practices.github.io/fastapi_best_architecture_docs/sponsors.html';
 
 export const homeSponsor = ref(
     {
         link: '',
-        text: '成为赞助商',
         href: sponsorUrl,
-        alt: 'fba 官方合作伙伴'
+        alt: '',
     }
 )
 
 export const goldSponsors = ref([
     {
-        link: '',
-        text: '【腾讯云】春季大促，助力开工，2核2G云服务器低至 68元/年',
+        link: 'https://dscache.tencent-cloud.cn/upload//rhino-design-800x450-fea2ea55b7b63624628bf9bb22454cb8f91b7d69.png',
         href: 'https://curl.qcloud.com/f9VMAii8',
-        alt: '',
+        alt: '2核2G云服务器低至 68元/年',
     },
     {
         link: 'https://img14.360buyimg.com/ddimg/jfs/t1/284966/5/22913/37242/68023351Faddd8304/6337ad52ea02ad10.jpg',
-        text: '302.AI',
         href: 'https://share.302.ai/LJojhb',
-        alt: '',
+        alt: '302.AI',
     },
     {
         link: '',
-        text: '成为赞助商',
         href: sponsorUrl,
-        alt: '',
+        alt: '成为赞助商',
     }
 ])
 
 export const generalSponsors = ref([
     {
         link: 'https://user.by.ltd/templates/lagom/assets/img/logo/logo_big.png',
-        text: 'Bywave',
         href: 'https://user.by.ltd/aff.php?aff=12215',
-        alt: '',
+        alt: 'Bywave',
     },
     {
         link: '',
-        text: '成为赞助商',
         href: sponsorUrl,
-        alt: '',
+        alt: '成为赞助商',
     },
     {
         link: '',
-        text: '成为赞助商',
         href: sponsorUrl,
-        alt: '',
+        alt: '成为赞助商',
     },
     {
         link: '',
-        text: '成为赞助商',
         href: sponsorUrl,
-        alt: '',
+        alt: '成为赞助商',
     },
     {
         link: '',
-        text: '成为赞助商',
         href: sponsorUrl,
-        alt: '',
+        alt: '成为赞助商',
     },
     {
         link: '',
-        text: '成为赞助商',
         href: sponsorUrl,
-        alt: '',
+        alt: '成为赞助商',
     }
 ])