Skip to content

Commit 174e2c4

Browse files
14114305561411430556
committed
✨feat: 添加@vueuse/core依赖并更新文档
在package.json和pnpm-lock.yaml中添加了@vueuse/core依赖，并更新了相关配置。同时，修改了.vitepress/config.mjs以引入版本信息，提升文档的动态性和用户体验。此外，删除了不再使用的custom.css文件，优化项目结构和可维护性。
1 parent 7340dac commit 174e2c4

13 files changed

Lines changed: 10737 additions & 23 deletions

File tree

‎docs/.vitepress/cache/deps/@vueuse_core.js‎

Lines changed: 9839 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎docs/.vitepress/cache/deps/@vueuse_core.js.map‎

Lines changed: 7 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎docs/.vitepress/cache/deps/_metadata.json‎

Lines changed: 15 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,43 +1,49 @@
11
{
2-
"hash": "17be5405",
2+
"hash": "1102f9e0",
33
"configHash": "c4ff5e8c",
4-
"lockfileHash": "f681912f",
5-
"browserHash": "b0a79d73",
4+
"lockfileHash": "210c877b",
5+
"browserHash": "e6480123",
66
"optimized": {
77
"vue": {
88
"src": "../../../../node_modules/.pnpm/vue@3.5.17/node_modules/vue/dist/vue.runtime.esm-bundler.js",
99
"file": "vue.js",
10-
"fileHash": "29971fd0",
10+
"fileHash": "c6400890",
1111
"needsInterop": false
1212
},
1313
"vitepress > @vue/devtools-api": {
1414
"src": "../../../../node_modules/.pnpm/@vue+devtools-api@7.7.7/node_modules/@vue/devtools-api/dist/index.js",
1515
"file": "vitepress___@vue_devtools-api.js",
16-
"fileHash": "ed59169c",
16+
"fileHash": "c201cce1",
1717
"needsInterop": false
1818
},
1919
"vitepress > @vueuse/core": {
2020
"src": "../../../../node_modules/.pnpm/@vueuse+core@12.8.2_typescript@5.8.3/node_modules/@vueuse/core/index.mjs",
2121
"file": "vitepress___@vueuse_core.js",
22-
"fileHash": "5ca8f68d",
22+
"fileHash": "211e9208",
2323
"needsInterop": false
2424
},
2525
"medium-zoom": {
2626
"src": "../../../../node_modules/.pnpm/medium-zoom@1.1.0/node_modules/medium-zoom/dist/medium-zoom.esm.js",
2727
"file": "medium-zoom.js",
28-
"fileHash": "a281b253",
28+
"fileHash": "16b30969",
2929
"needsInterop": false
3030
},
3131
"nprogress-v2/dist/index.js": {
3232
"src": "../../../../node_modules/.pnpm/nprogress-v2@1.1.10/node_modules/nprogress-v2/dist/index.js",
3333
"file": "nprogress-v2_dist_index__js.js",
34-
"fileHash": "e2fd981e",
34+
"fileHash": "06cd2793",
3535
"needsInterop": true
3636
},
3737
"canvas-confetti": {
3838
"src": "../../../../node_modules/.pnpm/canvas-confetti@1.9.3/node_modules/canvas-confetti/dist/confetti.module.mjs",
3939
"file": "canvas-confetti.js",
40-
"fileHash": "63c726ea",
40+
"fileHash": "f13940ec",
41+
"needsInterop": false
42+
},
43+
"@vueuse/core": {
44+
"src": "../../../../node_modules/.pnpm/@vueuse+core@13.5.0_vue@3.5.17_typescript@5.8.3_/node_modules/@vueuse/core/index.mjs",
45+
"file": "@vueuse_core.js",
46+
"fileHash": "81044540",
4147
"needsInterop": false
4248
}
4349
},

‎docs/.vitepress/config.mjs‎

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,8 @@ import { groupIconMdPlugin, groupIconVitePlugin } from 'vitepress-plugin-group-i
33
import { withSidebar } from 'vitepress-sidebar'
44
import footnote from 'markdown-it-footnote'
55
import { figure } from '@mdit/plugin-figure'
6-
import { algolia } from "./configs/algolia"
6+
import { algolia } from './configs/algolia'
7+
import { version } from '../../package.json'
78

89
// https://vitepress.dev/reference/site-config
910
const vitePressOptions = {
@@ -63,12 +64,18 @@ const vitePressOptions = {
6364
logo: '/蒙面人小偷.svg',
6465
nav: [
6566
{
66-
text: '导航',
67+
text: `v${version}`,
6768
items: [
6869
{ text: '主页', link: '/index.md' },
6970
{ text: '情感故事', link: '/文档/6-图书馆30秒' },
7071
{ text: 'Go初学者', link: '/文档/7-Go初学者' },
7172
{ text: '哔哩哔哩', link: 'https://space.bilibili.com/44113085' },
73+
{
74+
component: 'RainbowAnimationSwitcher',
75+
props: {
76+
text: '彩虹动画',
77+
},
78+
},
7279
],
7380
},
7481
],

‎docs/.vitepress/theme/components/RainbowAnimationSwitcher.vue‎

Lines changed: 123 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,123 @@
1+
<script lang="ts" setup>
2+
import { useLocalStorage, useMediaQuery } from '@vueuse/core'
3+
import { inBrowser } from 'vitepress'
4+
import { computed, watch } from 'vue'
5+
import RainbowSwitcher from './RainbowSwitcher.vue'
6+
7+
defineProps<{ text?: string; screenMenu?: boolean }>()
8+
9+
const reduceMotion = useMediaQuery('(prefers-reduced-motion: reduce)').value
10+
11+
const animated = useLocalStorage('animate-rainbow', inBrowser ? !reduceMotion : true)
12+
13+
function toggleRainbow() {
14+
animated.value = !animated.value
15+
}
16+
17+
watch(
18+
animated,
19+
anim => {
20+
document.documentElement.classList.remove('rainbow')
21+
if (anim) {
22+
document.documentElement.classList.add('rainbow')
23+
}
24+
},
25+
{ immediate: inBrowser, flush: 'post' },
26+
)
27+
28+
const switchTitle = computed(() => {
29+
return animated.value ? '禁用彩虹动画' : '启用彩虹动画'
30+
})
31+
</script>
32+
33+
<template>
34+
<ClientOnly>
35+
<div class="group" :class="{ mobile: screenMenu }">
36+
<div class="NavScreenRainbowAnimation">
37+
<p class="text">
38+
{{ text ?? 'Rainbow Animation' }}
39+
</p>
40+
<RainbowSwitcher
41+
:title="switchTitle"
42+
class="RainbowAnimationSwitcher"
43+
:aria-checked="animated ? 'false' : 'true'"
44+
@click="toggleRainbow"
45+
>
46+
<span class="i-tabler:rainbow animated" />
47+
<span class="i-tabler:rainbow-off non-animated" />
48+
</RainbowSwitcher>
49+
</div>
50+
</div>
51+
</ClientOnly>
52+
</template>
53+
54+
<style scoped>
55+
.group {
56+
border-top: 1px solid var(--vp-c-divider);
57+
padding-top: 10px;
58+
margin-top: 1rem !important;
59+
}
60+
61+
.group.mobile {
62+
border: none !important;
63+
margin-top: 24px;
64+
}
65+
66+
.group.mobile .NavScreenRainbowAnimation {
67+
background-color: var(--vp-c-bg-soft);
68+
}
69+
70+
.group.mobile .NavScreenRainbowAnimation::before {
71+
margin-top: 16px;
72+
background-color: var(--vp-c-bg);
73+
}
74+
75+
@media (min-width: 960px) {
76+
.group:not(.mobile) {
77+
margin-top: 10px !important;
78+
margin-bottom: -10px;
79+
padding-top: 0;
80+
width: 220px;
81+
}
82+
}
83+
84+
.NavScreenRainbowAnimation {
85+
display: flex;
86+
justify-content: space-between;
87+
align-items: center;
88+
border-radius: 8px;
89+
padding: 12px 12px 12px 12px;
90+
background-color: var(--vp-c-bg-elv);
91+
max-width: 220px;
92+
}
93+
.group.mobile .NavScreenRainbowAnimation {
94+
max-width: unset;
95+
}
96+
97+
.text {
98+
line-height: 24px;
99+
font-size: 12px;
100+
font-weight: 500;
101+
color: var(--vp-c-text-2);
102+
}
103+
104+
.animated {
105+
opacity: 1;
106+
}
107+
108+
.non-animated {
109+
opacity: 0;
110+
}
111+
112+
.RainbowAnimationSwitcher[aria-checked='false'] .non-animated {
113+
opacity: 1;
114+
}
115+
116+
.RainbowAnimationSwitcher[aria-checked='true'] .animated {
117+
opacity: 1;
118+
}
119+
120+
.RainbowAnimationSwitcher[aria-checked='false'] :deep(.check) {
121+
transform: translateX(18px);
122+
}
123+
</style>

‎docs/.vitepress/theme/components/RainbowSwitcher.vue‎

Lines changed: 63 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,63 @@
1+
<template>
2+
<button class="VPSwitch" type="button" role="switch">
3+
<span class="check">
4+
<span v-if="$slots.default" class="icon">
5+
<slot />
6+
</span>
7+
</span>
8+
</button>
9+
</template>
10+
11+
<style scoped>
12+
.VPSwitch {
13+
position: relative;
14+
border-radius: 11px;
15+
display: block;
16+
width: 40px;
17+
height: 22px;
18+
flex-shrink: 0;
19+
border: 1px solid var(--vp-input-border-color);
20+
background-color: var(--vp-input-switch-bg-color);
21+
transition: border-color 0.25s !important;
22+
}
23+
24+
.VPSwitch:hover {
25+
border-color: var(--vp-c-brand-1);
26+
}
27+
28+
.check {
29+
position: absolute;
30+
top: 1px;
31+
/*rtl:ignore*/
32+
left: 1px;
33+
width: 18px;
34+
height: 18px;
35+
border-radius: 50%;
36+
background-color: var(--vp-c-neutral-inverse);
37+
box-shadow: var(--vp-shadow-1);
38+
transition: transform 0.25s !important;
39+
}
40+
41+
.icon {
42+
position: relative;
43+
display: block;
44+
width: 18px;
45+
height: 18px;
46+
border-radius: 50%;
47+
overflow: hidden;
48+
}
49+
50+
.icon :deep([class^='i-']) {
51+
position: absolute;
52+
top: 3px;
53+
left: 3px;
54+
width: 12px;
55+
height: 12px;
56+
color: var(--vp-c-text-2);
57+
}
58+
59+
.dark .icon :deep([class^='i-']) {
60+
color: var(--vp-c-text-1);
61+
transition: opacity 0.25s !important;
62+
}
63+
</style>

‎docs/.vitepress/theme/index.ts‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,10 +19,11 @@ import '@theojs/lumen/style'
1919
// 代码组图标
2020
import 'virtual:group-icons.css'
2121
import './style.css'
22-
// import './custom.css'
2322
import './style/index.scss'
23+
// import './style/custom.css'
2424
// 明亮、暗黑模式切换
2525
import MyLayout from './components/MyLayout.vue'
26+
import RainbowAnimationSwitcher from './components/RainbowAnimationSwitcher.vue'
2627
// 切换路由进度条
2728
import { NProgress } from 'nprogress-v2/dist/index.js' // 进度条组件
2829
import 'nprogress-v2/dist/index.css' // 进度条样式
@@ -61,6 +62,7 @@ export default {
6162
app.component('MouseClick', MouseClick)
6263
app.component('MouseFollower', MouseFollower)
6364
app.component('ArticleMetadata', ArticleMetadata)
65+
app.component('RainbowAnimationSwitcher', RainbowAnimationSwitcher)
6466
// 切换路由进度条
6567
if (inBrowser) {
6668
NProgress.configure({ showSpinner: false })

‎docs/.vitepress/theme/style/blur.css‎

Lines changed: 1 addition & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -12,13 +12,6 @@
1212
backdrop-filter: blur(10px);
1313
}
1414

15-
/* Feature透明 */
16-
.VPFeature {
17-
border: none;
18-
box-shadow: 0 10px 30px 0 rgb(0 0 0 / 15%);
19-
background-color: transparent;
20-
}
21-
2215
/* 文档页侧边栏顶部透明 */
2316
.curtain {
2417
background-color: rgba(255, 255, 255, 0);
@@ -38,4 +31,4 @@
3831
background-color: rgba(255, 255, 255, 0);
3932
backdrop-filter: blur(10px);
4033
}
41-
}
34+
}

docs/.vitepress/theme/custom.css renamed to docs/.vitepress/theme/style/custom.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,4 +42,4 @@
4242

4343
.VPHero .image-container:hover .image-bg {
4444
opacity: 0;
45-
}
45+
}

‎docs/.vitepress/theme/style/index.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
/* .vitepress/theme/style/index.css */
2-
@use "./vp-code.css";
2+
// @use "./vp-code.css";
33
@use "./vp-code-group.css";
4-
@use "./rainbow.scss";
4+
@use "./rainbow.css";
55
@use "./blur.css";
66
@use "./vars.scss";
77
@use "./vitepress.scss";

0 commit comments

Comments
 (0)