valaxy-theme-yun 0.19.13 → 0.20.0-beta.1

package/components/site/YunSiteTitle.vue

@@ -0,0 +1,59 @@
+<script setup lang="ts">
+import { useSiteConfig } from 'valaxy'
+import { useRouter } from 'vue-router'
+
+const router = useRouter()
+const siteConfig = useSiteConfig()
+</script>
+
+<template>
+  <RouterLink
+    v-if="router.hasRoute('/about/site')" to="/about/site"
+    class="site-name"
+  >
+    {{ siteConfig.title }}
+  </RouterLink>
+  <span v-else class="site-name">{{ siteConfig.title }}</span>
+</template>
+
+<style lang="scss">
+.site-name {
+  --title-padding: -15px;
+
+  display: inline-flex;
+  color: var(--va-c-text);
+  position: relative;
+
+  &::before,
+  &::after {
+    content: "";
+    position: absolute;
+    width: 10px;
+    height: 10px;
+    opacity: 0;
+    border: 2px solid;
+    transition: 0.3s;
+    transition-timing-function: cubic-bezier(0.17, 0.67, 0.05, 1.29);
+  }
+
+  &::before {
+    top: 0;
+    left: var(--title-padding);
+    border-width: 2px 0 0 2px;
+    transform: translate3d(10px, 10px, 0);
+  }
+
+  &::after {
+    right: var(--title-padding);
+    bottom: 0;
+    border-width: 0 2px 2px 0;
+    transform: translate3d(-10px, -10px, 0);
+  }
+
+  &:hover::before,
+  &:hover::after {
+    opacity: 1;
+    transform: translate3d(0, 0, 0);
+  }
+}
+</style>

package/components/third/YunWalineMeta.vue

@@ -14,14 +14,26 @@ const { t } = useI18n()
 </script>
 
 <template>
-  <div v-if="addonWaline && addonWaline.options" flex="~" text="sm" my="1" h="5">
-    <div v-if="addonWaline.options.pageview" inline-flex justify="center" items="center" mx="2" :title="t('post.pageview_count')">
+  <div v-if="addonWaline && addonWaline.options" class="inline-flex gap-4" text="sm" h="5">
+    <div
+      v-if="addonWaline.options.pageview" inline-flex justify="center" items="center"
+      :title="t('post.pageview_count')"
+    >
       <div inline-flex i-ri-eye-line />
-      <span ml-1 inline-flex class="waline-pageview-count" :data-path="route.path" />
+      <span
+        ml-1 inline-flex class="waline-pageview-count op-80"
+        :data-path="route.path"
+      />
     </div>
-    <div v-if="addonWaline.options.comment" inline-flex justify="center" items="center" mx="2" :title="t('post.comment_count')">
+    <div
+      v-if="addonWaline.options.comment" inline-flex justify="center" items="center"
+      :title="t('post.comment_count')"
+    >
       <div inline-flex i-ri-chat-4-line />
-      <span ml-1 inline-flex class="waline-comment-count" :data-path="route.path" />
+      <span
+        ml-1 inline-flex class="waline-comment-count op-80"
+        :data-path="route.path"
+      />
     </div>
   </div>
 </template>

package/docs/zh-CN/config.md

@@ -30,9 +30,6 @@ export default defineConfig<ThemeConfig>({
       title: '云游君的小站',
       // 手动分割
       // title: ['云游君的', '小站'],
-      cloud: {
-        enable: true
-      }
     },
   }
 })

package/layouts/archives.vue

@@ -1,6 +1,7 @@
 <script lang="ts" setup>
 import { defineWebPage, useSchemaOrg } from '@unhead/schema-org'
 import { useFrontmatter, usePostTitle, useSiteStore } from 'valaxy'
+import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 
 const { t } = useI18n()
@@ -15,28 +16,39 @@ useSchemaOrg([
     '@type': 'CollectionPage',
   }),
 ])
+
+const pageIcon = computed(() => {
+  if (!frontmatter.value.icon)
+    // eslint-disable-next-line vue/no-side-effects-in-computed-properties
+    frontmatter.value.icon = 'i-ri-archive-line'
+  return frontmatter.value.icon
+})
 </script>
 
 <template>
-  <YunSidebar v-if="$slots['sidebar-child']">
-    <slot name="sidebar-child" />
-  </YunSidebar>
-  <YunSidebar v-else />
-
-  <RouterView v-slot="{ Component }">
-    <component :is="Component">
-      <template #main-header>
-        <YunPageHeader
-          :title="title || t('menu.archives')"
-          :icon="frontmatter.icon || 'i-ri-archive-line'"
-          :color="frontmatter.color"
-          :page-title-class="frontmatter.pageTitleClass"
-        />
-      </template>
-      <template #main-content>
-        <RouterView />
-        <YunPostCollapse :posts="site.postList" />
-      </template>
-    </component>
-  </RouterView>
+  <YunLayoutWrapper>
+    <YunLayoutLeft />
+
+    <RouterView v-slot="{ Component }">
+      <component :is="Component">
+        <template #main-header>
+          <YunPageHeader
+            class="mt-8"
+            :title="title || t('menu.archives')"
+            :icon="pageIcon"
+            :color="frontmatter.color"
+            :page-title-class="frontmatter.pageTitleClass"
+          />
+        </template>
+        <template #main-content>
+          <RouterView />
+          <YunPostCollapse :posts="site.postList" />
+        </template>
+      </component>
+    </RouterView>
+
+    <YunLayoutRight />
+  </YunLayoutWrapper>
+
+  <YunFooter />
 </template>

package/layouts/categories.vue

@@ -14,6 +14,13 @@ const route = useRoute()
 const curCategory = computed(() => (route.query.category as string || ''))
 const categories = useCategories()
 
+const pageIcon = computed(() => {
+  if (!frontmatter.value.icon)
+    // eslint-disable-next-line vue/no-side-effects-in-computed-properties
+    frontmatter.value.icon = 'i-ri-folder-2-line'
+  return frontmatter.value.icon
+})
+
 const posts = computed(() => {
   const list = site.postList.filter((post) => {
     if (post.categories && curCategory.value !== 'Uncategorized') {
@@ -39,38 +46,43 @@ useSchemaOrg([
 </script>
 
 <template>
-  <YunSidebar v-if="$slots['sidebar-child']">
-    <slot name="sidebar-child" />
-  </YunSidebar>
-  <YunSidebar v-else />
-
-  <RouterView v-slot="{ Component }">
-    <component :is="Component">
-      <template #main-header>
-        <YunPageHeader
-          :title="title || t('menu.categories')"
-          :icon="frontmatter.icon || 'i-ri-folder-2-line'"
-          :color="frontmatter.color"
-          :page-title-class="frontmatter.pageTitleClass"
-        />
-      </template>
-      <template #main-content>
-        <div text="center" class="yun-text-light" p="2">
-          {{ t('counter.categories', Array.from(categories.children).length) }}
-        </div>
-        <YunCategories :categories="categories.children" />
-        <RouterView />
-      </template>
+  <YunLayoutWrapper>
+    <YunLayoutLeft />
 
-      <template #main-nav-before>
-        <YunCard v-if="curCategory" class="post-collapse-container" m="t-4" w="full">
+    <RouterView v-slot="{ Component }">
+      <component :is="Component">
+        <template #main-header>
           <YunPageHeader
-            :title="curCategory === 'Uncategorized' ? t('category.uncategorized') : curCategory.split('/').join(' / ')"
-            icon="i-ri-folder-open-line"
+            class="mt-8"
+            :title="title || t('menu.categories')"
+            :icon="pageIcon"
+            :color="frontmatter.color"
+            :page-title-class="frontmatter.pageTitleClass"
           />
-          <YunPostCollapse w="full" m="b-4" p="x-20 lt-sm:x-5" :posts="posts" />
-        </YunCard>
-      </template>
-    </component>
-  </RouterView>
+        </template>
+        <template #main-content>
+          <div text="center" class="yun-text-light" p="2">
+            {{ t('counter.categories', Array.from(categories.children).length) }}
+          </div>
+          <YunCategories :categories="categories.children" />
+          <RouterView />
+        </template>
+
+        <template #main-nav-before>
+          <YunCard v-if="curCategory" class="post-collapse-container" m="t-4" w="full">
+            <YunPageHeader
+              m="t-10"
+              :title="curCategory === 'Uncategorized' ? t('category.uncategorized') : curCategory.split('/').join(' / ')"
+              icon="i-ri-folder-open-line"
+            />
+            <YunPostCollapse w="full" m="b-4" p="x-20 lt-sm:x-5" :posts="posts" />
+          </YunCard>
+        </template>
+      </component>
+    </RouterView>
+
+    <YunLayoutRight />
+  </YunLayoutWrapper>
+
+  <YunFooter />
 </template>

package/layouts/default.vue

@@ -1,8 +1,13 @@
+<script setup lang="ts">
+// layout
+</script>
+
 <template>
-  <YunSidebar v-if="$slots['sidebar-child']">
-    <slot name="sidebar-child" />
-  </YunSidebar>
-  <YunSidebar v-else />
+  <YunLayoutWrapper>
+    <YunLayoutLeft />
+    <RouterView />
+    <YunLayoutRight />
+  </YunLayoutWrapper>
 
-  <RouterView />
+  <YunFooter />
 </template>

package/layouts/empty.vue

@@ -0,0 +1,3 @@
+<template>
+  <RouterView />
+</template>

package/layouts/home.vue

@@ -1,5 +1,4 @@
 <script lang="ts" setup>
-import { useLayout } from 'valaxy'
 import { computed } from 'vue'
 import { useRoute } from 'vue-router'
 import { useYunAppStore } from '../stores'
@@ -7,7 +6,6 @@ import { useThemeConfig } from '../composables'
 
 const yunStore = useYunAppStore()
 const route = useRoute()
-const isHome = useLayout('home')
 const themeConfig = useThemeConfig()
 
 const isPage = computed(() => route.path.startsWith('/page'))
@@ -21,18 +19,27 @@ const showNotice = computed(() => {
 <template>
   <main
     class="yun-main flex-center"
-    :class="(isHome && !yunStore.leftSidebar.isOpen) ? 'pl-0' : 'md:pl-$va-sidebar-width'" flex="~ col" w="full"
+    :class="{
+      'pl-0': !yunStore.leftSidebar.isOpen,
+      'md:pl-$va-sidebar-width': yunStore.leftSidebar.isOpen,
+      'pt-36': isPage,
+    }" flex="~ col" w="full"
   >
     <YunSidebar :show-hamburger="true" />
 
     <template v-if="!isPage">
-      <YunBanner v-if="themeConfig.banner.enable" />
+      <YunBanner />
       <YunSay v-if="themeConfig.say.enable" w="full" />
+      <YunPrologue class="absolute left-0 top-0 right-0 bottom-0" />
     </template>
 
     <YunNotice
       v-if="showNotice"
-      :content="themeConfig.notice.content" mt="4"
+      class="mb-10"
+      :class="{
+        'mt-4': !isPage,
+      }"
+      :content="themeConfig.notice.content"
     />
 
     <slot name="board" />

package/layouts/post.vue

@@ -41,27 +41,30 @@ useSchemaOrg(
 </script>
 
 <template>
-  <YunSidebar v-if="$slots['sidebar-child']">
-    <slot name="sidebar-child" />
-  </YunSidebar>
-  <YunSidebar v-else />
+  <YunLayoutWrapper>
+    <YunLayoutLeft />
 
-  <RouterView v-slot="{ Component }">
-    <component :is="Component">
-      <template #main-header-after>
-        <YunPostMeta :frontmatter="frontmatter" />
-        <YunWalineMeta />
-        <YunPostCategoriesAndTags :frontmatter="frontmatter" />
-      </template>
+    <RouterView v-slot="{ Component }">
+      <component :is="Component">
+        <template #main-header-after>
+          <YunPostMeta :frontmatter="frontmatter" />
 
-      <template #main-content-after>
-        <YunSponsor v-if="showSponsor" m="t-6" />
-        <ValaxyCopyright v-if="frontmatter.copyright || (frontmatter.copyright !== false && siteConfig.license.enabled)" :url="url" m="y-4" />
-      </template>
+          <YunPostCategoriesAndTags class="mt-2" :frontmatter="frontmatter" />
+        </template>
 
-      <template #aside-custom>
-        <slot name="aside-custom" />
-      </template>
-    </component>
-  </RouterView>
+        <template #main-content-after>
+          <YunSponsor v-if="showSponsor" m="t-6" />
+          <ValaxyCopyright v-if="frontmatter.copyright || (frontmatter.copyright !== false && siteConfig.license.enabled)" :url="url" m="y-4" />
+        </template>
+
+        <template #aside-custom>
+          <slot name="aside-custom" />
+        </template>
+      </component>
+    </RouterView>
+
+    <YunLayoutRight />
+  </YunLayoutWrapper>
+
+  <YunFooter />
 </template>

package/layouts/posts.vue

@@ -0,0 +1,10 @@
+<script setup lang="ts">
+// not use
+</script>
+
+<template>
+  <div class="pt-36">
+    <YunPostList />
+  </div>
+  <YunFooter />
+</template>

package/layouts/projects.vue

@@ -0,0 +1,25 @@
+<script setup lang="ts">
+import { useFrontmatter, useSiteConfig } from 'valaxy'
+
+// layout
+const siteConfig = useSiteConfig()
+const fm = useFrontmatter()
+</script>
+
+<template>
+  <YunLayoutWrapper>
+    <div flex="~ col">
+      <YunProjects />
+      <!-- <YunLayoutLeft /> -->
+      <!-- <RouterView /> -->
+      <!-- <YunLayoutRight /> -->
+      <YunSponsor class="mt-4" />
+      <YunComment
+        v-if="siteConfig.comment.enable && fm.comment !== false"
+        class="max-w-4xl m-auto"
+      />
+    </div>
+  </YunLayoutWrapper>
+
+  <YunFooter />
+</template>

package/layouts/tags.vue

@@ -58,46 +58,50 @@ const title = usePostTitle(frontmatter)
 </script>
 
 <template>
-  <YunSidebar v-if="$slots['sidebar-child']">
-    <slot name="sidebar-child" />
-  </YunSidebar>
-  <YunSidebar v-else />
-
-  <RouterView v-slot="{ Component }">
-    <component :is="Component">
-      <template #main-header>
-        <YunPageHeader
-          :title="title || t('menu.tags')"
-          :icon="frontmatter.icon || 'i-ri-tag-line'"
-          :color="frontmatter.color"
-          :page-title-class="frontmatter.pageTitleClass"
-        />
-      </template>
-      <template #main-content>
-        <div class="yun-text-light" text="center" p="2">
-          {{ t('counter.tags', Array.from(tags).length) }}
-        </div>
-
-        <div class="justify-center items-end" flex="~ wrap" gap="1">
-          <YunLayoutPostTag
-            v-for="[key, tag] in Array.from(tags).sort()"
-            :key="key"
-            :title="key"
-            :count="tag.count"
-            :style="getTagStyle(tag.count)"
-            @click="displayTag(key.toString())"
+  <YunLayoutWrapper>
+    <YunLayoutLeft />
+
+    <RouterView v-slot="{ Component }">
+      <component :is="Component">
+        <template #main-header>
+          <YunPageHeader
+            class="mt-8"
+            :title="title || t('menu.tags')"
+            :icon="frontmatter.icon || 'i-ri-tag-line'"
+            :color="frontmatter.color"
+            :page-title-class="frontmatter.pageTitleClass"
           />
-        </div>
-
-        <RouterView />
-      </template>
-
-      <template #main-nav-before>
-        <YunCard v-if="curTag" ref="collapse" m="t-4" w="full">
-          <YunPageHeader :title="curTag" icon="i-ri-hashtag" />
-          <YunPostCollapse w="full" m="b-4" p="x-20 lt-sm:x-5" :posts="posts" />
-        </YunCard>
-      </template>
-    </component>
-  </RouterView>
+        </template>
+        <template #main-content>
+          <div class="yun-text-light" text="center" p="2">
+            {{ t('counter.tags', Array.from(tags).length) }}
+          </div>
+
+          <div class="justify-center items-end" flex="~ wrap" gap="1">
+            <YunLayoutPostTag
+              v-for="[key, tag] in Array.from(tags).sort()"
+              :key="key"
+              :title="key"
+              :count="tag.count"
+              :style="getTagStyle(tag.count)"
+              @click="displayTag(key.toString())"
+            />
+          </div>
+
+          <RouterView />
+        </template>
+
+        <template #main-nav-before>
+          <YunCard v-if="curTag" ref="collapse" m="t-4" w="full">
+            <YunPageHeader :title="curTag" icon="i-ri-hashtag" />
+            <YunPostCollapse w="full" m="b-4" p="x-20 lt-sm:x-5" :posts="posts" />
+          </YunCard>
+        </template>
+      </component>
+    </RouterView>
+
+    <YunLayoutRight />
+  </YunLayoutWrapper>
+
+  <YunFooter />
 </template>

package/node/config.ts

@@ -15,9 +15,6 @@ export const defaultThemeConfig: ThemeConfig = {
   banner: {
     enable: true,
     title: '云游君的小站',
-    cloud: {
-      enable: true,
-    },
   },
 
   bg_image: {
@@ -27,7 +24,7 @@ export const defaultThemeConfig: ThemeConfig = {
   },
 
   say: {
-    enable: true,
+    enable: false,
     api: '',
     // api: 'https://el-bot-api.elpsy.cn/api/words/young',
     hitokoto: {
@@ -96,7 +93,7 @@ export const defaultThemeConfig: ThemeConfig = {
     },
     'twitter': {
       color: '#1da1f2',
-      icon: 'i-ri-twitter-line',
+      icon: 'i-ri-twitter-x-fill',
     },
     'wechat': {
       color: '#1AAD19',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "valaxy-theme-yun",
-  "version": "0.19.13",
+  "version": "0.20.0-beta.1",
   "author": {
     "email": "me@yunyoujun.cn",
     "name": "YunYouJun",
@@ -20,14 +20,19 @@
   "main": "index.ts",
   "module": "index.ts",
   "dependencies": {
+    "@ctrl/tinycolor": "^4.1.0",
     "@explosions/fireworks": "^0.0.2",
     "@iconify-json/ant-design": "^1.2.1",
-    "@iconify-json/simple-icons": "^1.2.4",
-    "animejs": "^3.2.2"
+    "@iconify-json/simple-icons": "^1.2.5",
+    "@vueuse/motion": "^2.2.5",
+    "animejs": "^3.2.2",
+    "gsap": "^3.12.5",
+    "primevue": "^4.0.7",
+    "radix-vue": "^1.9.6"
   },
   "devDependencies": {
     "@types/animejs": "^3.1.12",
-    "valaxy": "0.19.13",
-    "valaxy-addon-waline": "0.2.0"
+    "valaxy-addon-waline": "0.2.0",
+    "valaxy": "0.20.0-beta.1"
   }
 }

package/pages/page/[page].vue

@@ -1,11 +1,8 @@
 <script setup lang="ts">
-import { useRoute } from 'vue-router'
-import { computed } from 'vue'
-
-const route = useRoute()
-const pageIndex = computed(() => Number.parseInt((route.params as { page: string }).page))
+// dynamic page
+// layout is home
 </script>
 
 <template>
-  <YunPostList :cur-page="pageIndex" />
+  <YunPostList />
 </template>

package/pages/posts/index.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+// TODO
+</script>
+
+<template>
+  <div class="mt-37 mb-4">
+    <YunPostList />
+  </div>
+
+  <YunFooter />
+</template>