valaxy-theme-yun 0.10.3 → 0.11.0

package/components/ValaxyMain.vue

@@ -62,9 +62,9 @@ const YunTwikoo = config.value.comment.waline.enable
             </YunCard>
           </slot>
 
-          <YunFooter>
-            <slot name="footer" />
-          </YunFooter>
+          <slot name="main-footer-before" />
+          <YunFooter />
+          <slot name="main-footer-after" />
         </div>
       </slot>
 

package/components/YunFooter.vue

@@ -2,15 +2,12 @@
 import { capitalize, computed } from 'vue'
 import { useConfig } from 'valaxy'
 import { useI18n } from 'vue-i18n'
-
 import pkg from 'valaxy/package.json'
 import { useThemeConfig } from '../composables'
 
 const { t } = useI18n()
-
 const config = useConfig()
 const themeConfig = useThemeConfig()
-
 const year = new Date().getFullYear()
 
 const isThisYear = computed(() => {
@@ -18,11 +15,15 @@ const isThisYear = computed(() => {
 })
 
 const poweredHtml = computed(() => t('footer.powered', [`<a href="${pkg.repository}" target="_blank" rel="noopener">Valaxy</a> v${pkg.version}`]))
-const footerIcon = computed(() => themeConfig.value.footer.icon!)
+const footerIcon = computed(() => themeConfig.value.footer.icon || {
+  url: pkg.repository,
+  name: 'i-ri-cloud-line',
+  title: pkg.name,
+})
 </script>
 
 <template>
-  <footer class="va-footer p-4" text="center sm" style="color:var(--va-c-text-light)">
+  <footer class="va-footer p-4 text-$va-c-text-light" text="center sm">
     <div v-if="themeConfig.footer.beian?.enable && themeConfig.footer.beian.icp" class="beian" m="y-2">
       <a href="https://beian.miit.gov.cn/" target="_blank" rel="noopener">
         {{ themeConfig.footer.beian.icp }}
@@ -38,15 +39,14 @@ const footerIcon = computed(() => themeConfig.value.footer.icon!)
         {{ year }}
       </span>
 
-      <a m="x-2" class="inline-flex animate-pulse" :href="footerIcon.url" target="_blank" :title="footerIcon.title">
+      <a v-if="themeConfig.footer.icon" m="x-2" class="inline-flex animate-pulse" :href="footerIcon.url" target="_blank" :title="footerIcon.title">
         <div :class="footerIcon.name" />
       </a>
-
       <span>{{ config.author.name }}</span>
     </div>
 
     <div v-if="themeConfig.footer.powered" class="powered" m="2">
-      <span v-html="poweredHtml" /> | <span>{{ t('footer.theme') }} - <a :href="themeConfig.pkg.homepage" :title="`valaxy-theme-${config.theme}`" target="_blank">{{ capitalize(config.theme) }}</a> v{{ themeConfig.pkg.version }}</span>
+      <span v-html="poweredHtml" /> | <span>{{ t('footer.theme') }} - <a :href="themeConfig.pkg.homepage" :title="themeConfig.pkg.name" target="_blank">{{ capitalize(config.theme) }}</a> v{{ themeConfig.pkg.version }}</span>
     </div>
 
     <slot />

package/components/YunWaline.vue

@@ -1,26 +1,8 @@
 <script lang="ts" setup>
 import { useConfig } from 'valaxy'
-// we need import on demand
-import { useWaline } from 'valaxy/client/composables/comments/waline'
-
 const config = useConfig()
-useWaline(config.value.comment.waline, config.value.cdn.prefix)
 </script>
 
 <template>
-  <div id="waline" w="full" />
+  <WalineClient w="full" :server-u-r-l="config.comment.waline.serverURL" :cdn="config.cdn.prefix" />
 </template>
-
-<style lang="scss">
-#waline {
-  --waline-theme-color: var(--va-c-primary);
-  --waline-active-color: var(--va-c-primary-light);
-
-  .v[data-class=v] {
-    .veditor {
-      width: calc(100% - 2em);
-      padding: 0.5rem;
-    }
-  }
-}
-</style>

package/layouts/home.vue

@@ -27,9 +27,7 @@ const isHome = useLayout('home')
       <router-view />
     </slot>
 
-    <YunFooter>
-      <slot name="footer" />
-    </YunFooter>
+    <YunFooter />
   </main>
 
   <YunSearch v-if="config.search.enable" />

package/layouts/layout.vue

@@ -45,9 +45,6 @@ const config = useConfig()
       <template #aside-custom>
         <slot name="aside-custom" />
       </template>
-      <template #footer>
-        <slot name="footer" />
-      </template>
     </component>
   </router-view>
 

package/layouts/tags.vue

@@ -62,7 +62,7 @@ const title = usePostTitle(frontmatter)
         {{ t('counter.tags', Array.from(tags).length) }}
       </div>
 
-      <div text="center">
+      <div text="center" class="break-words">
         <span v-for="[key, tag] in Array.from(tags).sort()" :key="key" class="post-tag cursor-pointer" :style="getTagStyle(tag.count)" p="1" @click="displayTag(key.toString())">
           #{{ key }}<span text="xs">[{{ tag.count }}]</span>
         </span>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "valaxy-theme-yun",
-  "version": "0.10.3",
+  "version": "0.11.0",
   "author": {
     "email": "me@yunyoujun.cn",
     "name": "YunYouJun",
@@ -17,12 +17,13 @@
   "main": "node/index.ts",
   "types": "types/index.d.ts",
   "dependencies": {
-    "@docsearch/css": "^3.1.1",
-    "@docsearch/js": "^3.1.1",
+    "@docsearch/css": "^3.2.1",
+    "@docsearch/js": "^3.2.1",
     "@iconify-json/ant-design": "^1.1.3",
-    "@iconify-json/simple-icons": "^1.1.19"
+    "@iconify-json/simple-icons": "^1.1.28",
+    "valaxy-addon-waline": "0.0.2"
   },
   "devDependencies": {
-    "valaxy": "0.10.3"
+    "valaxy": "0.11.0"
   }
 }

package/valaxy.config.ts

@@ -30,6 +30,7 @@ function ThemeVitePlugin(options: ResolvedValaxyOptions<ThemeConfig>): Plugin {
 export default defineTheme<ThemeConfig>((options) => {
   return {
     themeConfig: defaultThemeConfig,
+    addons: ['valaxy-addon-waline'],
     vite: {
       plugins: [ThemeVitePlugin(options)],
     },