refactor(theme): 优化皮肤交互

This commit is contained in:
pengzhanbo 2022-05-17 22:19:59 +08:00
parent 224ab36160
commit c62218e358
5 changed files with 23 additions and 10 deletions

View File

@ -16,6 +16,7 @@ const scrollToTop = (): void => {
}
onMounted(() => {
if (__VUEPRESS_SSR__) return
canShow()
window.addEventListener('scroll', () => canShow(), false)
})

View File

@ -1,8 +1,16 @@
<script lang="ts" setup>
import { computed } from 'vue'
import { useThemeLocaleData } from '../composables'
import BloggerInfo from './BloggerInfo.vue'
const themeLocale = useThemeLocaleData()
const showInfo = computed(() => {
const avatar = themeLocale.value.avatar || {}
return avatar.name || avatar.url
})
</script>
<template>
<aside class="blog-info-wrapper">
<aside v-if="showInfo" class="blog-info-wrapper">
<BloggerInfo />
</aside>
</template>

View File

@ -2,7 +2,7 @@
import DropdownTransition from '@theme-plume/DropdownTransition.vue'
import { isLinkHttp, isLinkMailto } from '@vuepress/shared'
import type { FunctionalComponent, Ref } from 'vue'
import { ref } from 'vue'
import { computed, ref } from 'vue'
import { usePostStat, useThemeLocaleData } from '../composables'
import {
EmailIcon,
@ -26,11 +26,11 @@ type SocialData = SocialItem[]
type SocialRef = Ref<SocialData>
const themeLocale = useThemeLocaleData()
const avatar = themeLocale.value.avatar || {}
const social = themeLocale.value.social || {}
const avatar = computed(() => themeLocale.value.avatar || {})
const useSocialList = (): SocialRef => {
const list: SocialRef = ref([])
const social = themeLocale.value.social || {}
if (social.QQ) {
const url = isLinkHttp(social.QQ)
? social.QQ

View File

@ -3,7 +3,7 @@ import DropdownTransition from '@theme-plume/DropdownTransition.vue'
import PostItem from '@theme-plume/PostItem.vue'
import { usePageFrontmatter } from '@vuepress/client'
import type { PropType } from 'vue'
import { toRefs, watch } from 'vue'
import { nextTick, onMounted, toRefs, watch } from 'vue'
import { onBeforeRouteUpdate, useRoute, useRouter } from 'vue-router'
import type { PlumeThemeHomeFrontmatter } from '../../shared'
import type { PostListData } from '../composables'
@ -49,7 +49,11 @@ onBeforeRouteUpdate((to) => {
setTimeout(() => scrollTo(document, top), 0)
})
setPostListPage((route.query.p as unknown as number) || 1)
onMounted(async () => {
if (__VUEPRESS_SSR__) return
await nextTick()
setPostListPage((route.query.p as unknown as number) || 1)
})
const togglePage = (currentPage: number): void => {
router.push({
path: route.path,

View File

@ -4,8 +4,8 @@ $MQNarrow: 959px !default;
$MQMobile: 719px !default;
$MQMobileNarrow: 419px !default;
$containerWith: 1024px !default;
$containerWith: 1200px !default;
$codeLang: 'c' 'cpp' 'cs' 'dart' 'docker' 'fs' 'go' 'java' 'kt' 'makefile'
'css' 'less' 'sass' 'scss' 'styl' 'html' 'js' 'json' 'ts' 'vue' 'jsx'
'md' 'php' 'py' 'rb' 'rs' 'sh' 'toml' 'yml' !default;
$codeLang: 'c' 'cpp' 'cs' 'dart' 'docker' 'fs' 'go' 'java' 'kt' 'makefile' 'css'
'less' 'sass' 'scss' 'styl' 'html' 'js' 'json' 'ts' 'vue' 'jsx' 'md' 'php'
'py' 'rb' 'rs' 'sh' 'toml' 'yml' !default;