valaxy-theme-yun 0.22.7 → 0.22.9

package/components/project/YunProjectCard.vue

@@ -1,8 +1,9 @@
 <script setup lang="ts">
+import type { CSSProperties } from 'vue'
 import type { ProjectItem } from '../../types'
 import { TinyColor } from '@ctrl/tinycolor'
 import { useMotion } from '@vueuse/motion'
-import { computed, type CSSProperties, ref } from 'vue'
+import { computed, ref } from 'vue'
 import { cubicBezier } from '../../client/constants'
 
 const props = defineProps<{

package/components/site/YunSiteTitle.vue

@@ -1,22 +1,30 @@
 <script setup lang="ts">
 import { useSiteConfig } from 'valaxy'
-import { ref } from 'vue'
 import { useRouter } from 'vue-router'
+import { useThemeConfig } from '../../composables'
 
 const router = useRouter()
 const siteConfig = useSiteConfig()
+const themeConfig = useThemeConfig()
 
-const classes = ref('site-name text-lg leading-loose bg-gradient-to-r gradient-text from-#1e3c72 to-dark dark:(from-#66a6ff to-blue-500)')
+// bg-gradient-to-r gradient-text from-#1e3c72 to-dark dark:(from-#66a6ff to-blue-500)
 </script>
 
 <template>
   <RouterLink
     v-if="router.hasRoute('/about/site')" to="/about/site"
-    :class="classes"
+    class="site-name text-lg leading-loose"
+    :class="themeConfig.banner.siteNameClass"
   >
     {{ siteConfig.title }}
   </RouterLink>
-  <span v-else :class="classes">{{ siteConfig.title }}</span>
+  <span
+    v-else
+    class="site-name text-lg leading-loose"
+    :class="themeConfig.banner.siteNameClass"
+  >
+    {{ siteConfig.title }}
+  </span>
 </template>
 
 <style lang="scss">

package/components/theme/nimbo/YunNimboNavMenu.vue

@@ -126,7 +126,7 @@ const app = useAppStore()
 
   align-items: center;
   justify-content: space-between;
-  height: 50px;
+  height: var(--yun-nav-height, 50px);
   transition: all 0.5s map.get($cubic-bezier, 'ease-in');
 
   &.play {

package/docs/zh-CN/config.md

@@ -38,12 +38,18 @@ export default defineConfig<ThemeConfig>({
 > 如果您想要更改云的色彩，请更改 `var(--yun-c-cloud)` 的值
 
 ```scss
-// 新建 styles/css-vars.scss
+// 新建 styles/vars.css 文件
 :root {
   --yun-c-cloud: red;
 }
 ```
 
+新建 `styles/index.ts` 文件，引入 `vars.css`。
+
+```ts
+import './vars.css'
+```
+
 ## 自定义友情链接
 
 新建 `pages/links/index.md` 文件。
@@ -88,9 +94,15 @@ random: true
 
 ### 覆盖背景、侧边栏图片
 
-您可以新建 `styles/css-vars.scss`，覆盖默认 CSS 变量。
+您可以新建样式文件并引入，以覆盖默认 CSS 变量。
 
-```css
+```ts
+// styles/index.ts
+import './vars.scss'
+```
+
+```scss
+// styles/vars.scss
 :root {
   /* 背景图片 */
   --yun-bg-img: url("https://cdn.yunyoujun.cn/img/bg/stars-timing-0-blur-30px.jpg");

package/layouts/home.vue

@@ -24,29 +24,32 @@ const showNotice = computed(() => {
       'mt-0!': !isPage,
     }"
   >
-    <template v-if="!isPage">
-      <YunBanner />
-      <Transition
-        enter-from-class="scale-60"
-        enter-to-class="scale-100"
-        enter-active-class="transition-300 transition-cubic-bezier-ease-in-out delay-1000"
-        appear
-      >
-        <div class="absolute top-0 left-5 right-5 bottom-0 flex-center">
-          <Transition
-            enter-from-class="op-0"
-            enter-to-class="op-100"
-            enter-active-class="transition-800 delay-1000"
-            appear
-          >
-            <YunPrologueSquare class="z-1" />
-          </Transition>
-        </div>
-      </Transition>
+    <template v-if="themeConfig.banner.enable">
+      <template v-if="!isPage">
+        <YunBanner />
+        <Transition
+          enter-from-class="scale-60"
+          enter-to-class="scale-100"
+          enter-active-class="transition-300 transition-cubic-bezier-ease-in-out delay-1000"
+          appear
+        >
+          <div class="absolute top-0 left-5 right-5 bottom-0 flex-center">
+            <Transition
+              enter-from-class="op-0"
+              enter-to-class="op-100"
+              enter-active-class="transition-800 delay-1000"
+              appear
+            >
+              <YunPrologueSquare class="z-1" />
+            </Transition>
+          </div>
+        </Transition>
 
-      <YunSay v-if="themeConfig.say.enable" w="full" />
-      <YunPrologue v-if="yun.isNimbo" class="absolute left-0 top-0 right-0 bottom-0" />
+        <YunSay v-if="themeConfig.say.enable" w="full" />
+        <YunPrologue v-if="yun.isNimbo" class="absolute left-0 top-0 right-0 bottom-0" />
+      </template>
     </template>
+    <div v-else class="h-$yun-nav-height" />
 
     <YunNotice
       v-if="showNotice"

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "valaxy-theme-yun",
   "type": "module",
-  "version": "0.22.7",
+  "version": "0.22.9",
   "author": {
     "email": "me@yunyoujun.cn",
     "name": "YunYouJun",
@@ -24,7 +24,7 @@
     "@ctrl/tinycolor": "^4.1.0",
     "@explosions/fireworks": "^0.1.0",
     "@iconify-json/ant-design": "^1.2.5",
-    "@iconify-json/simple-icons": "^1.2.21",
+    "@iconify-json/simple-icons": "^1.2.25",
     "@vueuse/motion": "^2.2.6",
     "animejs": "^3.2.2",
     "gsap": "^3.12.7",
@@ -32,7 +32,7 @@
   },
   "devDependencies": {
     "@types/animejs": "^3.1.13",
-    "valaxy": "0.22.7",
+    "valaxy": "0.22.9",
     "valaxy-addon-waline": "0.2.0"
   },
   "scripts": {

package/styles/css-vars.scss

@@ -9,6 +9,8 @@
   --yun-home-hero-image-filter: blur(48px);
   --yun-home-hero-name-background: -webkit-linear-gradient(120deg, var(--va-c-text) 30%, black);
   --yun-home-hero-image-background-image: linear-gradient(-45deg, #bd34fe 50%, #47caff 50%);
+
+  --yun-nav-height: 50px;
 }
 
 :root {

package/styles/index.ts

@@ -0,0 +1,2 @@
+import './css-vars.scss'
+import './main.scss'

package/types/index.d.ts

@@ -22,6 +22,11 @@ export namespace YunTheme {
     cloud?: {
       enable: boolean
     }
+
+    /**
+     * site-name class
+     */
+    siteNameClass?: string
   }
 }