valaxy-theme-yun 0.2.4 → 0.3.2
Sign up to get free protection for your applications and to get access to all the features.
- package/components/YunAlgoliaSearch.vue +0 -1
- package/components/YunBackToTop.vue +9 -4
- package/components/YunBanner.vue +1 -1
- package/components/YunCategory.vue +7 -6
- package/components/YunConfig.vue +1 -1
- package/components/YunGirls.vue +3 -3
- package/components/YunLinks.vue +1 -2
- package/components/YunPostCollapse.vue +3 -4
- package/components/YunPostMeta.vue +2 -2
- package/components/YunPostNav.vue +2 -2
- package/components/YunSay.vue +1 -1
- package/composables/index.ts +1 -1
- package/layouts/base.vue +6 -6
- package/layouts/categories.vue +1 -1
- package/layouts/post.vue +10 -2
- package/package.json +4 -5
- package/styles/layout/post.scss +1 -1
@@ -27,17 +27,22 @@ const strokeOffset = computed(() => {
|
|
27
27
|
@use "sass:map";
|
28
28
|
|
29
29
|
.back-to-top {
|
30
|
-
position: relative;
|
31
30
|
position: fixed;
|
32
|
-
right: -
|
33
|
-
bottom:
|
31
|
+
right: -1.5rem;
|
32
|
+
bottom: 1rem;
|
34
33
|
z-index: var(--yun-z-go-up-btn);
|
35
34
|
opacity: 0;
|
35
|
+
pointer-events: none;
|
36
|
+
|
36
37
|
color: var(--va-c-primary);
|
38
|
+
transform: translateX(0) rotate(270deg);
|
39
|
+
// override yun-icon-btn transition
|
40
|
+
transition: transform var(--va-transition-duration), opacity var(--va-transition-duration-fast) !important;
|
37
41
|
|
38
42
|
&.show {
|
39
|
-
transform: translateX(-
|
43
|
+
transform: translateX(-32px) rotate(360deg);
|
40
44
|
opacity: 1;
|
45
|
+
pointer-events: fill;
|
41
46
|
}
|
42
47
|
|
43
48
|
.icon {
|
package/components/YunBanner.vue
CHANGED
@@ -35,7 +35,7 @@ const lintStyle = computed(() => (
|
|
35
35
|
<div class="banner-char-container">
|
36
36
|
<div v-for="c, i in themeConfig.banner.title" :key="i" class="char-box">
|
37
37
|
<span
|
38
|
-
:class="[i%2 !== 0 ? 'char-right' : 'char-left']" :style="{
|
38
|
+
:class="[i % 2 !== 0 ? 'char-right' : 'char-left']" :style="{
|
39
39
|
'--banner-char-size': `${chars[i]}rem`,
|
40
40
|
} as CSSProperties"
|
41
41
|
>
|
@@ -1,6 +1,7 @@
|
|
1
1
|
<script lang="ts" setup>
|
2
2
|
import { ref } from 'vue'
|
3
|
-
import type { Category,
|
3
|
+
import type { Category, Post } from 'valaxy'
|
4
|
+
import { isParentCategory } from 'valaxy'
|
4
5
|
import { useI18n } from 'vue-i18n'
|
5
6
|
|
6
7
|
const props = withDefaults(defineProps<{
|
@@ -20,9 +21,9 @@ const props = withDefaults(defineProps<{
|
|
20
21
|
|
21
22
|
const collapsable = ref(props.collapsable)
|
22
23
|
const { t, locale } = useI18n()
|
23
|
-
const lang = locale.value === 'zh-CN' ? 'zh' : locale.value
|
24
24
|
|
25
25
|
const getTitle = (post: Post | any) => {
|
26
|
+
const lang = locale.value === 'zh-CN' ? 'zh' : locale.value
|
26
27
|
return post[`title_${lang}`] ? post[`title_${lang}`] : post.title
|
27
28
|
}
|
28
29
|
</script>
|
@@ -38,14 +39,14 @@ const getTitle = (post: Post | any) => {
|
|
38
39
|
</li>
|
39
40
|
|
40
41
|
<template v-if="!collapsable">
|
41
|
-
<ul v-if="(category
|
42
|
-
<li v-for="post, i in
|
43
|
-
<router-link v-if="post.title" :to="post.path" class="inline-flex items-center">
|
42
|
+
<ul v-if="!isParentCategory(category)">
|
43
|
+
<li v-for="post, i in category.posts" :key="i" class="post-list-item" m="l-4">
|
44
|
+
<router-link v-if="post.title" :to="post.path || ''" class="inline-flex items-center">
|
44
45
|
<div i-ri-file-text-line />
|
45
46
|
<span m="l-1" font="serif black">{{ getTitle(post) }}</span>
|
46
47
|
</router-link>
|
47
48
|
</li>
|
48
49
|
</ul>
|
49
|
-
<YunCategories v-else :categories="
|
50
|
+
<YunCategories v-else :categories="category.children" :display-category="displayCategory" :collapsable="collapsable" />
|
50
51
|
</template>
|
51
52
|
</template>
|
package/components/YunConfig.vue
CHANGED
@@ -7,7 +7,7 @@ const { t } = useI18n()
|
|
7
7
|
|
8
8
|
<template>
|
9
9
|
<div>
|
10
|
-
<button class="yun-icon-btn" :title="t('button.toggle_dark')" :style="{color: isDark ? '' : '#f1cb64'}" @click="toggleDark()">
|
10
|
+
<button class="yun-icon-btn" :title="t('button.toggle_dark')" :style="{ color: isDark ? '' : '#f1cb64' }" @click="toggleDark()">
|
11
11
|
<div i="ri-sun-line dark:ri-moon-line" />
|
12
12
|
</button>
|
13
13
|
|
package/components/YunGirls.vue
CHANGED
@@ -2,7 +2,7 @@
|
|
2
2
|
import { useRandomData } from 'valaxy-theme-yun/composables'
|
3
3
|
import { onImgError } from '../utils'
|
4
4
|
|
5
|
-
|
5
|
+
interface GirlType {
|
6
6
|
name: string
|
7
7
|
url: string
|
8
8
|
avatar: string
|
@@ -22,10 +22,10 @@ const { data } = useRandomData(props.girls, props.random)
|
|
22
22
|
<div class="girls">
|
23
23
|
<ul class="girl-items">
|
24
24
|
<li v-for="girl, i in data" :key="girl.name" class="girl-item">
|
25
|
-
<a :href="girl.url ||
|
25
|
+
<a :href="girl.url || `https://zh.moegirl.org/${girl.name}`" :title="girl.reason" alt="portrait" target="_blank" rel="noopener">
|
26
26
|
<figure class="girl-info">
|
27
27
|
<img class="girl-avatar" loading="lazy" :src="girl.avatar" :alt="girl.name" :onError="onImgError">
|
28
|
-
<figcaption class="girl-name" :title="(i+1).toString()">{{ girl.name }}</figcaption>
|
28
|
+
<figcaption class="girl-name" :title="(i + 1).toString()">{{ girl.name }}</figcaption>
|
29
29
|
<figcaption class="girl-from">{{ girl.from }}</figcaption>
|
30
30
|
</figure>
|
31
31
|
</a>
|
package/components/YunLinks.vue
CHANGED
@@ -2,7 +2,7 @@
|
|
2
2
|
import { useRandomData } from '../composables'
|
3
3
|
import { onImgError } from '../utils'
|
4
4
|
|
5
|
-
|
5
|
+
interface LinkType {
|
6
6
|
avatar: string
|
7
7
|
name: string
|
8
8
|
url: string
|
@@ -38,7 +38,6 @@ const { data } = useRandomData(props.links, props.random)
|
|
38
38
|
</template>
|
39
39
|
|
40
40
|
<stye lang="scss">
|
41
|
-
|
42
41
|
.link-item {
|
43
42
|
display: inline-flex;
|
44
43
|
}
|
@@ -4,12 +4,12 @@ import type { Post } from 'valaxy'
|
|
4
4
|
import { formatDate, sortByDate } from 'valaxy'
|
5
5
|
import { useI18n } from 'vue-i18n'
|
6
6
|
|
7
|
-
const { t } = useI18n()
|
8
|
-
|
9
7
|
const props = defineProps<{
|
10
8
|
posts: Post[]
|
11
9
|
}>()
|
12
10
|
|
11
|
+
const { t } = useI18n()
|
12
|
+
|
13
13
|
const years = ref<number[]>([])
|
14
14
|
const postList = ref<Record<string, Post[]>>({})
|
15
15
|
|
@@ -34,7 +34,6 @@ const sortedYears = computed(() => {
|
|
34
34
|
const arr = y.sort((a, b) => b - a)
|
35
35
|
return isDesc.value ? arr : arr.reverse()
|
36
36
|
})
|
37
|
-
|
38
37
|
</script>
|
39
38
|
|
40
39
|
<template>
|
@@ -57,7 +56,7 @@ const sortedYears = computed(() => {
|
|
57
56
|
</h2>
|
58
57
|
</div>
|
59
58
|
|
60
|
-
<article v-for="post,j in sortByDate(postList[year], isDesc)" :key="j" class="post-item">
|
59
|
+
<article v-for="post, j in sortByDate(postList[year], isDesc)" :key="j" class="post-item">
|
61
60
|
<header class="post-header">
|
62
61
|
<div class="post-meta">
|
63
62
|
<time v-if="post.date" class="post-time" font="mono" opacity="80">{{ formatDate(post.date, 'MM-DD') }}</time>
|
@@ -6,13 +6,13 @@ const [prev, next] = usePrevNext()
|
|
6
6
|
<template>
|
7
7
|
<div class="post-nav">
|
8
8
|
<div class="post-nav-item">
|
9
|
-
<router-link v-if="prev" class="post-nav-prev" :to="prev.path" :title="prev.title">
|
9
|
+
<router-link v-if="prev" class="post-nav-prev" :to="prev.path || ''" :title="prev.title">
|
10
10
|
<div class="icon" i-ri-arrow-left-s-line />
|
11
11
|
<span class="title truncate" text="sm">{{ prev.title }}</span>
|
12
12
|
</router-link>
|
13
13
|
</div>
|
14
14
|
<div class="post-nav-item">
|
15
|
-
<router-link v-if="next" :to="next.path" :title="next.title" class="post-nav-next">
|
15
|
+
<router-link v-if="next" :to="next.path || ''" :title="next.title" class="post-nav-next">
|
16
16
|
<span class="title truncate" text="sm">{{ next.title }}</span>
|
17
17
|
<div class="icon" i-ri-arrow-right-s-line />
|
18
18
|
</router-link>
|
package/components/YunSay.vue
CHANGED
@@ -56,7 +56,7 @@ onMounted(() => {
|
|
56
56
|
|
57
57
|
<template>
|
58
58
|
<div class="say">
|
59
|
-
<span v-if="sayContent" class="say-content
|
59
|
+
<span v-if="sayContent" class="say-content animate-fade-in animate-iteration-1">{{ sayContent }}</span>
|
60
60
|
<span v-if="sayAuthor" class="say-author"> {{ sayAuthor }}</span>
|
61
61
|
<span v-if="sayFrom" class="say-from">{{ sayFrom }}</span>
|
62
62
|
</div>
|
package/composables/index.ts
CHANGED
@@ -10,7 +10,7 @@ import { isClient } from '@vueuse/core'
|
|
10
10
|
export function useRandomData<T>(source: string | T[], random = false) {
|
11
11
|
const data = ref<T[]>()
|
12
12
|
|
13
|
-
watch(() => source, async() => {
|
13
|
+
watch(() => source, async () => {
|
14
14
|
let rawData: T[]
|
15
15
|
if (typeof source === 'string') {
|
16
16
|
if (!isClient)
|
package/layouts/base.vue
CHANGED
@@ -19,8 +19,8 @@ const title = usePostTitle(frontmatter)
|
|
19
19
|
</ValaxySidebar>
|
20
20
|
|
21
21
|
<main class="yun-main flex lt-md:ml-0">
|
22
|
-
<div flex="~ 1 col" w="full" p="l-4 lt-md:0">
|
23
|
-
<YunCard m="0" p="4" class="relative
|
22
|
+
<div flex="~ 1 col" w="full" p="l-4 lt-md:0" class="content">
|
23
|
+
<YunCard m="0" p="4" class="relative sm:p-6 lg:px-12 xl:px-16" :style="styles">
|
24
24
|
<slot name="header">
|
25
25
|
<YunPageHeader :title="title" :icon="frontmatter.icon || icon" :color="frontmatter.color || color" />
|
26
26
|
</slot>
|
@@ -38,7 +38,7 @@ const title = usePostTitle(frontmatter)
|
|
38
38
|
</slot>
|
39
39
|
|
40
40
|
<slot v-if="frontmatter.comment !== false" name="comment">
|
41
|
-
<YunCard w="full" p="4" class="comment sm:p-
|
41
|
+
<YunCard w="full" p="4" class="comment sm:p-6 lg:px-12 xl:px-16" :class="frontmatter.nav === false ? 'mt-4' : 0">
|
42
42
|
<YunWaline v-if="config.comment.waline.enable" />
|
43
43
|
<YunTwikoo v-if="config.comment.twikoo.enable" />
|
44
44
|
</YunCard>
|
@@ -50,7 +50,7 @@ const title = usePostTitle(frontmatter)
|
|
50
50
|
</div>
|
51
51
|
|
52
52
|
<slot name="right-sidebar">
|
53
|
-
<ValaxyRightSidebar :frontmatter="frontmatter"
|
53
|
+
<ValaxyRightSidebar :frontmatter="frontmatter">
|
54
54
|
<template #custom>
|
55
55
|
<slot name="right-custom" />
|
56
56
|
</template>
|
@@ -65,9 +65,9 @@ const title = usePostTitle(frontmatter)
|
|
65
65
|
<style lang="scss">
|
66
66
|
@use '~/styles/mixins' as *;
|
67
67
|
@include xl {
|
68
|
-
.
|
68
|
+
.content{
|
69
69
|
// 8px scrollbar width
|
70
|
-
max-width: calc(100vw - 2 * var(--va-sidebar-width-mobile) -
|
70
|
+
max-width: calc(100vw - 2 * var(--va-sidebar-width-mobile) - 1rem - 8px);
|
71
71
|
}
|
72
72
|
}
|
73
73
|
</style>
|
package/layouts/categories.vue
CHANGED
@@ -54,7 +54,7 @@ const title = usePostTitle(frontmatter)
|
|
54
54
|
</template>
|
55
55
|
<template #content>
|
56
56
|
<div text="center" class="yun-text-light" p="2">
|
57
|
-
{{ t('counter.categories', categories.children!.size
|
57
|
+
{{ t('counter.categories', categories.children!.size) }}
|
58
58
|
</div>
|
59
59
|
<YunCategories :categories="categories.children!" :display-category="displayCategory" />
|
60
60
|
<router-view />
|
package/layouts/post.vue
CHANGED
@@ -1,9 +1,17 @@
|
|
1
1
|
<script lang="ts" setup>
|
2
|
+
import { computed } from '@vue/reactivity';
|
2
3
|
import { useConfig, useFrontmatter, useFullUrl } from 'valaxy'
|
3
4
|
|
4
5
|
const config = useConfig()
|
5
6
|
const frontmatter = useFrontmatter()
|
6
7
|
const url = useFullUrl()
|
8
|
+
|
9
|
+
const showSponsor = computed(() => {
|
10
|
+
if (typeof frontmatter.value.sponsor === 'boolean') {
|
11
|
+
return frontmatter.value.sponsor
|
12
|
+
}
|
13
|
+
return config.value.sponsor.enable
|
14
|
+
})
|
7
15
|
</script>
|
8
16
|
|
9
17
|
<template>
|
@@ -13,12 +21,12 @@ const url = useFullUrl()
|
|
13
21
|
<slot name="header">
|
14
22
|
<YunPostMeta :frontmatter="frontmatter" />
|
15
23
|
</slot>
|
16
|
-
<router-view v-slot="{Component}">
|
24
|
+
<router-view v-slot="{ Component }">
|
17
25
|
<Transition appear>
|
18
26
|
<component :is="Component" />
|
19
27
|
</Transition>
|
20
28
|
</router-view>
|
21
|
-
<YunSponsor v-if="
|
29
|
+
<YunSponsor v-if="showSponsor" />
|
22
30
|
<ValaxyCopyright v-if="frontmatter.copyright || config.license.enabled" :url="url" m="y-4" />
|
23
31
|
</main>
|
24
32
|
</template>
|
package/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "valaxy-theme-yun",
|
3
|
-
"version": "0.2
|
3
|
+
"version": "0.3.2",
|
4
4
|
"main": "dist/index.js",
|
5
5
|
"types": "dist/index.d.ts",
|
6
6
|
"repository": {
|
@@ -10,7 +10,7 @@
|
|
10
10
|
"homepage": "https://valaxy.yyj.moe/",
|
11
11
|
"dependencies": {
|
12
12
|
"@iconify-json/ant-design": "^1.1.1",
|
13
|
-
"@iconify-json/simple-icons": "^1.1.
|
13
|
+
"@iconify-json/simple-icons": "^1.1.11"
|
14
14
|
},
|
15
15
|
"author": {
|
16
16
|
"email": "me@yunyoujun.cn",
|
@@ -18,11 +18,10 @@
|
|
18
18
|
"url": "https://www.yunyoujun.cn"
|
19
19
|
},
|
20
20
|
"devDependencies": {
|
21
|
-
"valaxy": "0.2
|
21
|
+
"valaxy": "0.3.2"
|
22
22
|
},
|
23
23
|
"scripts": {
|
24
24
|
"build": "tsup",
|
25
25
|
"dev": "tsup --watch"
|
26
|
-
}
|
27
|
-
"readme": "<p align='center'>\n <img width=\"200\" src=\"https://cdn.jsdelivr.net/gh/YunYouJun/yun/images/meme/yun-good-alpha-compressed.png\">\n</p>\n\n<p align='center'>\nTheme-Yun<sup><em>(vue)</em></sup>\n</p>\n\n## Usage\n\nTODO\n\n### Development\n\nJust run and visit <http://localhost:3333>\n\n```bash\npnpm dev\n```\n\n### Build\n\n```bash\npnpm build\n```\n\n## [Sponsors](https://sponsors.yunyoujun.cn)\n\n<p align=\"center\">\n <a href=\"https://cdn.jsdelivr.net/gh/YunYouJun/sponsors/public/sponsors.svg\">\n <img src='https://cdn.jsdelivr.net/gh/YunYouJun/sponsors/public/sponsors.svg'/>\n </a>\n</p>\n"
|
26
|
+
}
|
28
27
|
}
|