valaxy 0.20.6 → 0.21.0

package/client/components/ValaxyApp.vue

@@ -1,6 +1,5 @@
 <script setup lang="ts">
 import { definePerson, defineWebPage, defineWebSite, useSchemaOrg } from '@unhead/schema-org'
-// import { useHead, useSeoMeta } from '@unhead/vue'
 import { useSeoMeta } from '@unhead/vue'
 
 // TODO: add docs to override ValaxyApp

package/client/components/ValaxyDecrypt.vue

@@ -1,9 +1,10 @@
 <script lang="ts" setup>
 import { runContentUpdated, useDecrypt, useFrontmatter } from 'valaxy'
-import { defineComponent, h, onMounted, ref } from 'vue'
+import { computed, defineComponent, h, ref } from 'vue'
 
 const props = defineProps<{
   encryptedContent: string
+  hint?: string
 }>()
 
 const password = ref('')
@@ -58,11 +59,7 @@ const ValaxyDeprecatedContent = defineComponent({
   },
 })
 
-const hasWarning = ref(false)
-onMounted(() => {
-  if (location.protocol !== 'https:')
-    hasWarning.value = true
-})
+const hasWarning = computed(() => location.protocol !== 'https:')
 </script>
 
 <template>
@@ -83,13 +80,17 @@ onMounted(() => {
           @keyup.enter="decryptContent"
         >
         <div
+          class="text-gray/70 hover:text-gray transition"
           cursor-pointer
           absolute text-2xl
           i-ri-arrow-right-circle-line right-3
-          text-gray hover:text-black
           @click="decryptContent"
         />
 
+        <div v-if="hint" class="-top-6" absolute text-xs op="50">
+          <div v-html="hint" />
+        </div>
+
         <div v-if="hasWarning" class="-bottom-6" absolute text-xs op="50">
           <a href="https://developer.mozilla.org/en-US/docs/Web/API/Web_Crypto_API" target="_blank">
             <span>Web Crypto API</span>

package/client/components/ValaxyLogo.vue

@@ -5,7 +5,11 @@ import valaxyLogoPng from '../assets/images/valaxy-logo.png'
 <template>
   <div class="valaxy-logo-container" relative inline-flex justify="center" items="center">
     <div class="absolute bg-img" />
-    <img class="fly-animation" w="50" aspect="420/386" m="auto" :src="valaxyLogoPng" alt="Valaxy Logo" z="1">
+    <img
+      class="fly-animation h-50"
+      aspect="420/386" m="auto"
+      :src="valaxyLogoPng" alt="Valaxy Logo" z="1"
+    >
   </div>
 </template>
 

package/client/composables/app/useValaxyHead.ts

@@ -11,10 +11,12 @@ export function useValaxyHead() {
 
   const fm = useFrontmatter()
   const siteConfig = useSiteConfig()
-  const title = computed(() => fm.value[`title_${locale.value}`] || fm.value.title)
+  const title = computed<string>(() => fm.value[`title_${locale.value}`] || fm.value.title)
   useHead({
     title,
-    titleTemplate: computed(() => fm.value.titleTemplate || ((title: string) => title ? `${title} - ${siteConfig.value.title}` : siteConfig.value.title)),
+    titleTemplate: (title) => {
+      return fm.value.titleTemplate || (title ? `${title} - ${siteConfig.value.title}` : siteConfig.value.title)
+    },
     link: [
       {
         rel: 'icon',
@@ -23,7 +25,12 @@ export function useValaxyHead() {
       },
     ],
     meta: [
-      { name: 'description', content: computed(() => siteConfig.value.description) },
+      computed(() => {
+        return {
+          name: 'description',
+          content: fm.value.description || siteConfig.value.description,
+        }
+      }),
       {
         name: 'generator',
         content: `Valaxy ${pkg.version}`,

package/client/composables/outline/anchor.ts

@@ -47,6 +47,10 @@ export function useActiveAnchor(
     window.removeEventListener('scroll', onScroll)
   })
 
+  /**
+   * 长目录自动滚动
+   * @TODO add e2e test
+   */
   const checkActiveLinkInViewport = () => {
     const activeLink = prevActiveLink
     if (!activeLink) {
@@ -54,15 +58,12 @@ export function useActiveAnchor(
       return
     }
 
-    const top = activeLink.getBoundingClientRect().top
-    const bottom = activeLink.getBoundingClientRect().bottom
-
     const parentEl = document.querySelector('.yun-aside') as HTMLElement
     if (parentEl) {
-      if (top < parentEl.scrollTop)
-        parentEl.scrollTo({ top: 0, behavior: 'smooth' })
-      if (bottom > parentEl.offsetHeight + parentEl.scrollTop)
-        parentEl.scrollTo({ top: bottom + 40, behavior: 'smooth' })
+      // 超出
+      const top = activeLink.offsetTop + topOffset + 60
+      if (top < parentEl.scrollTop || (top > parentEl.offsetHeight + parentEl.scrollTop))
+        parentEl.scrollTo({ top, behavior: 'smooth' })
     }
   }
 

package/client/setups.ts

@@ -8,7 +8,7 @@ import type { MermaidOptions } from './types'
  * The context object for the application setup function.
  *
  * @zh
- * 应用 setup 函数的上下文对象。（包括了 ViteSSG context）
+ * 应用 setup 函数的上下文对象。（包括了 `ViteSSGContext`）
  */
 export type AppContext = ViteSSGContext
 

package/client/styles/common/README.md

@@ -0,0 +1,7 @@
+# styles/common
+
+公共样式，可由主题作者自行引入。
+
+```ts
+import 'valaxy/client/styles/common/index.scss'
+```

package/client/styles/common/index.scss

@@ -0,0 +1,7 @@
+// common
+@use "./code.scss" as *;
+@use "./hamburger.scss" as *;
+@use "./transition.scss" as *;
+
+// markdown
+@use "./markdown.scss";

package/client/styles/common/markdown.scss

@@ -25,15 +25,15 @@
 
   // custom block
   .custom-block {
-    margin: 16px 0;
-
     p {
       margin: 8px 0;
       line-height: 24px;
     }
+  }
 
-    p:first-child {
-      margin: 0;
+  .custom-block div[lang] {
+    p {
+      margin: 8px 0;
     }
   }
 

package/client/styles/index.scss

@@ -9,13 +9,4 @@ $c-primary: #0078e7 !default;
 // https://github.com/valaxyjs/css-i18n
 @use "css-i18n/src/styles/index.scss" as *;
 
-// common
-@use "./common/code.scss" as *;
-@use "./common/hamburger.scss" as *;
-@use "./common/scrollbar.scss" as *;
-@use "./common/transition.scss" as *;
-
-// markdown
-@use "./common/markdown.scss";
-
 // components import by yourself