refactor: extract banner

opensource-f2f · Mar 12, 2024 · 9c3efae · 9c3efae
1 parent 6a5f85e
commit 9c3efae
Show file tree

Hide file tree

Showing 3 changed files with 58 additions and 63 deletions.
diff --git a/src/components/app-header.vue b/src/components/app-header.vue
@@ -18,64 +18,7 @@ import 'floating-vue/dist/style.css'
  />
  </router-link>
  <span>开源面对面，连接热爱开源的你！</span>
-
- <div flex="~ row gap-2" flex-wrap justify-center>
- <a target="_blank" href="https://github.com/opensource-f2f">
- <img
- alt="GitHub Org's stars"
- src="https://img.shields.io/github/stars/opensource-f2f?style=social"
- />
- </a>
- <a target="_blank" href="https://twitter.com/osf2f">
- <img
- alt="Twitter followers"
- src="https://img.shields.io/twitter/follow/osf2f?style=social"
- />
- </a>
- <a
- target="_blank"
- href="https://www.youtube.com/channel/UCV7Ibg1k_aMSEcDFgJvuvdg"
- >
- <img
- alt="YouTube subscribers"
- src="https://img.shields.io/youtube/channel/subscribers/UCV7Ibg1k_aMSEcDFgJvuvdg?style=social"
- />
- </a>
- <a target="_blank" href="https://feeds.osf2f.net/osf2f.xml">
- <img
- alt="RSS address"
- src="https://img.shields.io/badge/rss-F88900?style=flat&logo=rss&logoColor=white"
- />
- </a>
- <a
- target="_blank"
- href="https://open.spotify.com/show/48Yeu1L5pTluk1AVc3ShU6"
- >
- <img
- alt="Listen on Spotify"
- src="https://img.shields.io/badge/spotify-1DB954?style=flat&logo=spotify&logoColor=white"
- />
- </a>
- <a
- target="_blank"
- href="https://music.163.com/#/djradio?id=1001312291"
- >
- <img h-20px alt="NetEase Music" src="/static/netease-music.svg" />
- </a>
-
- <Menu>
- <div text="#2aae67" i-carbon-logo-wechat cursor-pointer text-20px />
- <template #popper>
- <div flex="~ col" m-10px>
- <img
- h-150px
- alt="Weixin Offcial Accounts Platform"
- src="/static/we-chat.jpeg"
- />扫一扫 关注微信公众号
- </div>
- </template>
- </Menu>
- </div>
+ <banner />
  </div>
  </div>
  </header>

diff --git a/src/components/banner.vue b/src/components/banner.vue
@@ -0,0 +1,56 @@
+<template>
+ <div flex="~ row gap-2 wrap" justify-center p2>
+ <a target="_blank" href="https://github.com/opensource-f2f">
+ <img
+ alt="GitHub Org's stars"
+ src="https://img.shields.io/github/stars/opensource-f2f?style=social"
+ />
+ </a>
+ <a target="_blank" href="https://twitter.com/osf2f">
+ <img
+ alt="Twitter followers"
+ src="https://img.shields.io/twitter/follow/osf2f?style=social"
+ />
+ </a>
+ <a
+ target="_blank"
+ href="https://www.youtube.com/channel/UCV7Ibg1k_aMSEcDFgJvuvdg"
+ >
+ <img
+ alt="YouTube subscribers"
+ src="https://img.shields.io/youtube/channel/subscribers/UCV7Ibg1k_aMSEcDFgJvuvdg?style=social"
+ />
+ </a>
+ <a target="_blank" href="https://feeds.osf2f.net/osf2f.xml">
+ <img
+ alt="RSS address"
+ src="https://img.shields.io/badge/rss-F88900?style=flat&logo=rss&logoColor=white"
+ />
+ </a>
+ <a
+ target="_blank"
+ href="https://open.spotify.com/show/48Yeu1L5pTluk1AVc3ShU6"
+ >
+ <img
+ alt="Listen on Spotify"
+ src="https://img.shields.io/badge/spotify-1DB954?style=flat&logo=spotify&logoColor=white"
+ />
+ </a>
+ <a target="_blank" href="https://music.163.com/#/djradio?id=1001312291">
+ <img h-20px alt="NetEase Music" src="/static/netease-music.svg" />
+ </a>
+
+ <Menu>
+ <div text="#2aae67" i-carbon-logo-wechat cursor-pointer text-20px />
+ <template #popper>
+ <div flex="~ col" m-10px>
+ <img
+ h-150px
+ alt="Weixin Offcial Accounts Platform"
+ src="/static/we-chat.jpeg"
+ />扫一扫 关注微信公众号
+ </div>
+ </template>
+ </Menu>
+ </div>
+</template>
diff --git a/src/typings/components.d.ts b/src/typings/components.d.ts
@@ -12,19 +12,15 @@ declare module 'vue' {
  AppHeader: typeof import('./../components/app-header.vue')['default']
  AppNavbar: typeof import('./../components/app-navbar.vue')['default']
  Badge: typeof import('./../components/badge.vue')['default']
- Components: typeof import('../views/index.vue')['default']
- ContributorContent: typeof import('../views/contributor.vue')['default']
- EpisodeContent: typeof import('../views/episode.vue')['default']
+ Banner: typeof import('./../components/banner.vue')['default']
  EpisodeItem: typeof import('./../components/episode-item.vue')['default']
  EpisodeMeta: typeof import('./../components/episode-meta.vue')['default']
  NavHamburger: typeof import('./../components/navbar/nav-hamburger.vue')['default']
  NavMenu: typeof import('./../components/navbar/nav-menu.vue')['default']
  NavSearch: typeof import('./../components/navbar/nav-search.vue')['default']
- NotFound: typeof import('../views/not-found.vue')['default']
  Person: typeof import('./../components/person.vue')['default']
  PersonList: typeof import('./../components/person-list.vue')['default']
  RouterLink: typeof import('vue-router')['RouterLink']
  RouterView: typeof import('vue-router')['RouterView']
- Sponsors: typeof import('../views/sponsors.vue')['default']
  }
 }