valaxy-theme-yun 0.1.1 → 0.2.1

package/layouts/post.vue

@@ -13,7 +13,11 @@ const url = useFullUrl()
         <slot name="header">
           <YunPostMeta :frontmatter="frontmatter" />
         </slot>
-        <router-view />
+        <router-view v-slot="{Component}">
+          <Transition appear>
+            <component :is="Component" />
+          </Transition>
+        </router-view>
         <YunSponsor v-if="frontmatter.sponsor || config.sponsor.enable" />
         <ValaxyCopyright v-if="frontmatter.copyright || config.license.enabled" :url="url" m="y-4" />
       </main>

package/layouts/tags.vue

@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { useFrontmatter, useInvisibleElement, usePostList, useTags } from 'valaxy'
+import { useFrontmatter, useInvisibleElement, usePostList, usePostTitle, useTags, useThemeConfig } from 'valaxy'
 import { useI18n } from 'vue-i18n'
 import { computed, ref } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
@@ -7,9 +7,13 @@ import { useRoute, useRouter } from 'vue-router'
 const route = useRoute()
 const router = useRouter()
 
+const themeConfig = useThemeConfig()
+
 const { t } = useI18n()
 const frontmatter = useFrontmatter()
-const { tags, getTagStyle } = useTags()
+const { tags, getTagStyle } = useTags({
+  primary: themeConfig.value.colors.primary,
+})
 
 const postList = usePostList()
 const curTag = computed(() => route.query.tag as string || '')
@@ -40,13 +44,14 @@ const displayTag = (tag: string) => {
   show()
 }
 
+const title = usePostTitle(frontmatter)
 </script>
 
 <template>
   <YunBase>
     <template #header>
       <YunPageHeader
-        :title="frontmatter.title || t('menu.tags')"
+        :title="title || t('menu.tags')"
         :icon="frontmatter.icon || 'i-ri-tag-line'"
         :color="frontmatter.color"
       />
@@ -77,7 +82,7 @@ const displayTag = (tag: string) => {
   color: var(--yun-tag-color);
 
   &:hover {
-    color: var(--yun-c-primary);
+    color: var(--va-c-primary);
   }
 }
 </style>

package/locales/en.yml

@@ -0,0 +1 @@
+valaxy_theme_yun: Valaxy Theme Yun

package/locales/zh-CN.yml

@@ -0,0 +1 @@
+valaxy_theme_yun: Valaxy 主题 云

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "valaxy-theme-yun",
-  "version": "0.1.1",
+  "version": "0.2.1",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "repository": {
@@ -10,7 +10,7 @@
   "homepage": "https://valaxy.yyj.moe/",
   "dependencies": {
     "@iconify-json/ant-design": "^1.1.1",
-    "@iconify-json/simple-icons": "^1.1.6"
+    "@iconify-json/simple-icons": "^1.1.7"
   },
   "author": {
     "email": "me@yunyoujun.cn",
@@ -18,7 +18,7 @@
     "url": "https://www.yunyoujun.cn"
   },
   "devDependencies": {
-    "valaxy": "0.1.1"
+    "valaxy": "0.2.1"
   },
   "scripts": {
     "build": "tsup",

package/styles/css-vars.scss

@@ -0,0 +1,17 @@
+@use './vars' as *;
+@use '~/styles/mixins' as * with(
+  $namespace: 'yun'
+);
+
+:root {
+  @include set-css-var-from-map($common);
+  @include set-css-var-from-map($z-index, 'z');
+}
+
+:root {
+  @include set-css-var-from-map($light);
+}
+
+html.dark {
+  @include set-css-var-from-map($dark);
+}

package/styles/layout/index.scss

@@ -2,6 +2,6 @@
 @use "./post" as *;
 
 .yun-main {
-  padding-left: var(--yun-sidebar-width-mobile);
-  transition: padding-left var(--yun-transition-duration);
+  padding-left: var(--va-sidebar-width-mobile);
+  transition: padding-left var(--va-transition-duration);
 }

package/styles/layout/post.scss

@@ -1,13 +1,10 @@
-@use 'sass:map';
-@use '~/styles/mixins' as *;
-@use '~/styles/palette.scss' as *;
+@use "~/styles/mixins" as *;
 
 .post-card {
   position: relative;
-  max-width: 900px;
+  max-width: var(--yun-post-card-max-width);
 }
 
-
 .post-title {
   display: flex;
   justify-content: center;
@@ -21,7 +18,8 @@
 .post-title-link {
   position: relative;
   padding: 0.7rem 1.2rem;
-  color: var(--card-c-primary, var(--yun-c-link));
+  color: var(--card-c-primary, var(--va-c-link));
+  font-weight: 900;
 
   .icon {
     width: 1.6rem;
@@ -29,8 +27,9 @@
     margin-right: 0.4rem;
   }
 
-  &::before, &::after {
-    content: '';
+  &::before,
+  &::after {
+    content: "";
     position: absolute;
     width: 10px;
     height: 10px;
@@ -54,20 +53,13 @@
     transform: translate3d(-10px, -10px, 0);
   }
 
-  &:hover::before, &:hover::after {
+  &:hover::before,
+  &:hover::after {
     opacity: 1;
     transform: translate3d(0, 0, 0);
   }
 }
 
-.post-top-icon {
-  position: absolute;
-  top: 1rem;
-  right: 1rem;
-  color: var(--yun-c-warning);
-  font-size: 1.2rem;
-}
-
 .post-link-btn,
 .markdown-body .post-link-btn {
   background-color: var(--card-c-primary);
@@ -78,7 +70,7 @@
 
   margin-top: -0.2rem;
 
-  transition: box-shadow var(--yun-transition-duration);
+  transition: box-shadow var(--va-transition-duration);
 
   &:before {
     content: none;

package/styles/markdown.scss

@@ -1,31 +1,29 @@
 @use "~/styles/mixins" as *;
 
 .markdown-body {
-  --smc-font-family: var(--yun-font-sans);
-
-  --c-toc-link: var(--yun-c-text-light);
+  --c-toc-link: var(--va-c-text-light);
 }
 
 html.dark {
   .markdown-body {
-    --smc-header-bottom-color: #333;
-
-    --c-toc-link: var(--yun-c-text-dark);
+    --c-toc-link: var(--va-c-text-dark);
   }
 }
 
 .markdown-body {
-  ul {
-    > li {
-      list-style-type: disc;
-
-      li {
-        list-style-type: circle;
+  h1,
+  h2,
+  h3,
+  h4,
+  h5,
+  h6 {
+    font-family: var(--va-font-serif);
+    font-weight: 900;
+  }
 
-        li {
-          list-style-type: square;
-        }
-      }
+  ul {
+    li > p {
+      margin-bottom: 0;
     }
   }
 }

package/styles/vars.scss

@@ -1,7 +1,33 @@
-:root {
-  --yun-sidebar-bg-image: url("https://cdn.jsdelivr.net/gh/YunYouJun/cdn@master/img/bg/alpha-stars-timing-1.webp")
-}
+@use 'sass:map';
 
-html.dark {
-  --yun-sidebar-bg-image: none;
-}
+// palette
+$light: () !default;
+$light: map.merge((
+  'bg-image': url('https://cdn.jsdelivr.net/gh/YunYouJun/cdn/img/bg/stars-timing-0-blur-30px.jpg'),
+  'sidebar-bg-color': var(--va-c-bg-light),
+  'sidebar-bg-image': url("https://cdn.jsdelivr.net/gh/YunYouJun/cdn@master/img/bg/alpha-stars-timing-1.webp")
+), $light);
+
+$dark: () !default;
+$dark: map.merge((
+  'bg-image': none,
+  'sidebar-bg-image': none
+), $dark);
+
+// common
+$common: () !default;
+$common: map.merge((
+  'post-card-max-width': 900px
+), $common);
+
+$z-index: () !default;
+$z-index: map.merge((
+  'cloud': 8,
+  'go-down': 9,
+  'sidebar': 10,
+  'fireworks': 11,
+  'menu-btn': 20,
+  'go-up-btn': 20,
+  'search-popup': 30,
+  'search-btn': 31,
+), $z-index);