valaxy-theme-yun 0.19.2 → 0.19.4

package/components/YunFuseSearch.vue

@@ -127,7 +127,7 @@ onClickOutside(searchInputRef, () => {
   text-align: center;
   margin: 0;
   z-index: var(--yun-z-search-popup);
-  transition: 0.6s;
+  transition: 0.2s;
   background-color: var(--va-c-bg-opacity);
 }
 

package/components/YunPostCard.vue

@@ -26,7 +26,7 @@ const { icon, styles } = usePostProperty(props.post.type)
         loading="lazy"
       >
 
-      <div class="flex flex-col items-center" :class="post.cover && 'h-54'" w="full">
+      <div class="flex flex-col items-center relative" :class="post.cover && 'h-54'" w="full">
         <AppLink
           class="post-title-link cursor-pointer"
           :to="post.path || ''"
@@ -41,14 +41,15 @@ const { icon, styles } = usePostProperty(props.post.type)
 
         <YunPostMeta :frontmatter="post" />
 
-        <div class="flex flex-grow" w="full" justify="center" items="center">
+        <div flex="~ grow col" w="full" justify="center" items="center">
           <div v-if="post.excerpt_type === 'text'" py="1" />
           <div v-if="post.excerpt" class="markdown-body" op="90" text="left" w="full" p="x-6 lt-sm:4 y-2" v-html="post.excerpt" />
           <div v-else m="b-5" />
         </div>
-
         <!-- <div m="b-5" /> -->
 
+        <div v-if="post.excerpt" w="full" h="10" class="absolute bottom-0 bg-gradient-to-t from-$va-c-bg-light to-transparent z-1" />
+
         <a
           v-if="post.url"
           :href="post.url"

package/components/YunSearchTrigger.vue

@@ -1,6 +1,7 @@
 <script lang="ts" setup>
 import { useSiteConfig } from 'valaxy'
-import { computed, defineAsyncComponent, onMounted, onUnmounted, ref } from 'vue'
+import { computed, defineAsyncComponent, onMounted, ref } from 'vue'
+import { useEventListener } from '@vueuse/core'
 
 const siteConfig = useSiteConfig()
 
@@ -13,27 +14,29 @@ function togglePopup() {
   open.value = !open.value
 }
 
-onMounted(() => {
-  const handleSearchHotKey = (event: KeyboardEvent) => {
-    if (
-      (event.key.toLowerCase() === 'k' && (event.metaKey || event.ctrlKey))
-    ) {
-      event.preventDefault()
-      togglePopup()
-    }
-  }
-
-  const remove = () => {
-    window.removeEventListener('keydown', handleSearchHotKey)
+function handleSearchHotKey(event: KeyboardEvent) {
+  if (
+    (event.key.toLowerCase() === 'k' && (event.metaKey || event.ctrlKey))
+  ) {
+    event.preventDefault()
+    togglePopup()
   }
+}
 
-  window.addEventListener('keydown', handleSearchHotKey)
-
-  onUnmounted(remove)
+const algoliaRef = ref()
+onMounted(() => {
+  // algolia has its own hotkey
+  if (isFuse.value)
+    useEventListener('keydown', handleSearchHotKey)
 })
 
 function openSearch() {
   open.value = true
+
+  if (isAlgolia.value) {
+    algoliaRef.value.load()
+    algoliaRef.value.dispatchEvent()
+  }
 }
 
 function closeSearch() {
@@ -48,6 +51,6 @@ const YunAlgoliaSearch = isAlgolia.value
 <template>
   <YunSearchBtn :open="open && !isAlgolia" @open="openSearch" @close="closeSearch" />
 
-  <YunAlgoliaSearch v-if="isAlgolia" :open="open" @close="closeSearch" />
+  <YunAlgoliaSearch v-if="isAlgolia" ref="algoliaRef" :open="open" @close="closeSearch" />
   <YunFuseSearch v-else-if="isFuse" :open="open" @close="closeSearch" />
 </template>

package/components/YunSelect.vue

@@ -22,10 +22,10 @@ function toggleOptionVisible(e: MouseEvent) {
 </script>
 
 <template>
-  <div class="relative h-8 w-30 text-[var(--va-c-text-2)] z-20" @mousedown.stop>
+  <div class="relative h-8 w-30 text-$va-c-text-2 z-10" @mousedown.stop>
     <button
       class="flex h-full w-full px-2 items-center justify-between border rounded transition"
-      :class="optionVisible ? 'border-[var(--va-c-primary)] shadow-lg' : ''"
+      :class="optionVisible ? 'border-$va-c-primary' : ''"
       @click="toggleOptionVisible"
     >
       <span case-capital op-90>{{ activeValue }}</span>
@@ -34,13 +34,13 @@ function toggleOptionVisible(e: MouseEvent) {
     <Transition>
       <ul
         v-show="optionVisible"
-        class="select-options absolute translate-y-1 left-0 top-full w-full bg-[var(--va-c-bg-light)] overflow-hidden rounded-1 border"
+        class="shadow-lg select-options absolute translate-y-1 left-0 top-full w-full bg-$va-c-bg-light overflow-hidden rounded-1"
       >
         <li
           v-for="option in options"
           :key="option"
-          class="cursor-pointer list-none px-2 hover:bg-[var(--va-c-primary-light)] hover:text-white case-capital"
-          :class="{ 'bg-[var(--va-c-primary)] text-white': activeValue === option }"
+          class="cursor-pointer list-none px-2 hover:bg-$va-c-primary-light hover:text-white case-capital"
+          :class="{ 'bg-$va-c-primary text-white': activeValue === option }"
           @click="activeValue = option"
         >
           {{ option }}

package/components/third/YunAlgoliaSearch.vue

@@ -1,9 +1,8 @@
 <script lang="ts" setup>
 import * as addonAlgolia from 'valaxy-addon-algolia'
 import { isEmptyAddon } from 'valaxy'
-import { watch } from 'vue'
 
-const props = defineProps<{
+defineProps<{
   open: boolean
 }>()
 
@@ -11,12 +10,11 @@ if (isEmptyAddon(addonAlgolia))
   throw new Error('Algolia addon is not installed')
 
 const { loaded, load, dispatchEvent } = addonAlgolia.useAddonAlgolia()
-watch(() => props.open, () => {
-  if (props.open)
-    load()
 
-  if (loaded)
-    dispatchEvent()
+defineExpose({
+  loaded,
+  load,
+  dispatchEvent,
 })
 </script>
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "valaxy-theme-yun",
-  "version": "0.19.2",
+  "version": "0.19.4",
   "author": {
     "email": "me@yunyoujun.cn",
     "name": "YunYouJun",
@@ -25,7 +25,7 @@
   },
   "devDependencies": {
     "@types/animejs": "^3.1.12",
-    "valaxy": "0.19.2",
-    "valaxy-addon-waline": "0.2.0"
+    "valaxy-addon-waline": "0.2.0",
+    "valaxy": "0.19.4"
   }
 }