Skip to content

Commit 3b7c009

Browse files
T-miracleT-miracle
committed
Update: 新主题（待完善）
1. 临时兼容多端，不完善
1 parent f0e5c3a commit 3b7c009

File tree

24 files changed

+325
-89
lines changed

24 files changed

+325
-89
lines changed

‎.vitepress/plugins/hideFooter/hideFooter.ts‎

Lines changed: 0 additions & 29 deletions
This file was deleted.

‎.vitepress/sidebar/icons.ts‎

Lines changed: 4 additions & 4 deletions
Large diffs are not rendered by default.

‎.vitepress/theme/index.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,6 @@ import vSetup from '../components/vSetup.vue';
33
import vPageTips from '../components/vPageTips.vue';
44
import vDisplayList from '../components/vDisplayList.vue';
55
import vScratchPaper from '../components/vScratchPaper.vue';
6-
import hideFooter from '../plugins/hideFooter/hideFooter';
76
import { EnhanceAppContext, useData, useRoute } from 'vitepress';
87
import googleAnalysis from './scripts/googleAnalysis';
98
import giscusTalk from 'vitepress-plugin-comment-with-giscus';
@@ -33,7 +32,6 @@ export default {
3332
const { frontmatter } = useData();
3433
const route = useRoute();
3534
imageViewer(route, '.vp-doc', { toolbar: true });
36-
hideFooter(frontmatter);
3735
giscusTalk({
3836
repo: 'T-miracle/blog',
3937
repoId: 'R_kgDOJCf-FQ',

‎eslint.config.js‎

Lines changed: 12 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -49,7 +49,6 @@ export default [
4949
'template-curly-spacing': [ 'error', 'always' ],
5050
// vue 插槽表达式空格
5151
'vue/mustache-interpolation-spacing': [ 'error', 'always' ],
52-
'vue/html-closing-bracket-spacing': [ 'error', { 'startTag': 'never', 'endTag': 'never', 'selfClosingTag': 'never' } ],
5352

5453
/** 数组、对象对齐 */
5554
// 确保数组的多行格式对齐
@@ -75,7 +74,18 @@ export default [
7574
// 禁用 v-text、v-html、v-on 指令在组件上
7675
'vue/no-v-text-v-html-on-component': 'off',
7776
// 允许 v-html 指令
78-
'vue/ no-v-html': 'allow',
77+
'vue/no-v-html': 'off',
78+
// 闭合标签去除多余的空格
79+
'vue/html-closing-bracket-spacing': [ 'error', {
80+
'startTag': 'never',
81+
'endTag': 'never',
82+
'selfClosingTag': 'never'
83+
} ],
84+
// 闭合标签换行
85+
'vue/html-closing-bracket-newline': [ 'error', {
86+
'singleline': 'never',
87+
'multiline': 'always'
88+
} ],
7989

8090
/** 其他 */
8191
// 强制使用强类型判断（例如 `===` 和 `!==`）

‎package/App.vue‎

Lines changed: 79 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,87 @@
11
<template>
2-
<div class="absolute h-screen w-screen">
3-
<NanoHeader/>
4-
<NanoBody/>
5-
<NanoFooter/>
2+
<div
3+
ref="root"
4+
class="relative h-screen w-screen"
5+
>
6+
<NanoContainer/>
67
</div>
78
</template>
89

910
<script setup lang="ts">
10-
import NanoHeader from '@NanoUI/NanoHeader/index.vue';
11-
import NanoBody from '@NanoUI/NanoBody/index.vue';
12-
import NanoFooter from '@NanoUI/NanoFooter/index.vue';
11+
import NanoContainer from '@NanoUI/NanoContainer/index.vue';
12+
import { nextTick, onBeforeUnmount, onMounted, ref } from 'vue';
13+
import { controllerStore } from '@store/controller';
14+
15+
const ctl = controllerStore();
16+
17+
const root = ref<HTMLElement | null>(null);
18+
const resizeObserver = ref<ResizeObserver | null>(null);
19+
20+
onMounted(() => {
21+
resizeObserver.value = new ResizeObserver((entries: ResizeObserverEntry[]) => {
22+
const htmlEl = document.documentElement;
23+
for (const entry of entries) {
24+
const { target } = entry;
25+
const { clientWidth } = target as HTMLElement;
26+
if (clientWidth >= 2560) {
27+
htmlEl.style.setProperty('font-size', '18px');
28+
ctl.allowDrag = true;
29+
ctl.articleFullscreen = false;
30+
ctl.hideLeftSidebar = false;
31+
ctl.hideRightSidebar = false;
32+
ctl.hideActionBar = false;
33+
ctl.hideHeaderTopNav = false;
34+
ctl.hidePaths = false;
35+
ctl.hideCopyright = false;
36+
} else if (clientWidth >= 1920) {
37+
htmlEl.style.setProperty('font-size', '16px');
38+
ctl.allowDrag = true;
39+
ctl.articleFullscreen = false;
40+
ctl.hideLeftSidebar = false;
41+
ctl.hideRightSidebar = false;
42+
ctl.hideActionBar = false;
43+
ctl.hideHeaderTopNav = false;
44+
ctl.hidePaths = false;
45+
ctl.hideCopyright = false;
46+
} else if (clientWidth >= 1280) {
47+
htmlEl.style.setProperty('font-size', '14px');
48+
ctl.allowDrag = false;
49+
ctl.articleFullscreen = false;
50+
ctl.hideLeftSidebar = false;
51+
ctl.hideRightSidebar = false;
52+
ctl.hideActionBar = false;
53+
ctl.hideHeaderTopNav = false;
54+
ctl.hidePaths = false;
55+
ctl.hideCopyright = false;
56+
} else if (clientWidth >= 768) {
57+
htmlEl.style.setProperty('font-size', '12px');
58+
ctl.allowDrag = false;
59+
ctl.articleFullscreen = false;
60+
ctl.hideLeftSidebar = false;
61+
ctl.hideRightSidebar = true;
62+
ctl.hideActionBar = true;
63+
ctl.hideHeaderTopNav = true;
64+
ctl.hidePaths = true;
65+
ctl.hideCopyright = true;
66+
} else {
67+
htmlEl.style.setProperty('font-size', '10px');
68+
ctl.allowDrag = false;
69+
ctl.articleFullscreen = true;
70+
ctl.hideLeftSidebar = true;
71+
ctl.hideRightSidebar = true;
72+
ctl.hideActionBar = true;
73+
ctl.hideHeaderTopNav = true;
74+
ctl.hidePaths = true;
75+
ctl.hideCopyright = true;
76+
}
77+
}
78+
});
79+
resizeObserver.value.observe(root.value as HTMLElement);
80+
});
81+
82+
onBeforeUnmount(() => {
83+
resizeObserver.value?.disconnect();
84+
});
1385
</script>
1486

1587
<style lang="scss">

‎package/components/NanoBody/index.vue‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<template>
2-
<NanoLeftActionBar/>
3-
<NanoLeftSidebar/>
2+
<NanoLeftActionBar v-if="!ctl.hideActionBar"/>
3+
<NanoLeftSidebar v-if="!ctl.hideLeftSidebar"/>
44
<NanoMain/>
5-
<NanoRightSidebar/>
6-
<NanoRightActionBar/>
5+
<NanoRightSidebar v-if="!ctl.hideRightSidebar"/>
6+
<NanoRightActionBar v-if="!ctl.hideActionBar"/>
77
</template>
88

99
<script setup lang="ts">
@@ -12,6 +12,8 @@
1212
import NanoRightSidebar from '@NanoUI/NanoRightSidebar/index.vue';
1313
import NanoLeftActionBar from '@NanoUI/NanoLeftActionBar/index.vue';
1414
import NanoRightActionBar from '@NanoUI/NanoRightActionBar/index.vue';
15+
import { controllerStore } from '@store/controller';
16+
const ctl = controllerStore();
1517
</script>
1618

1719
<style scoped lang="scss">

‎package/components/NanoContainer/index.vue‎

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
<template>
2+
<div class="absolute h-full w-full">
3+
<NanoHeader/>
4+
<NanoBody/>
5+
<NanoFooter/>
6+
</div>
7+
</template>
8+
9+
<script setup lang="ts">
10+
import NanoHeader from '@NanoUI/NanoHeader/index.vue';
11+
import NanoBody from '@NanoUI/NanoBody/index.vue';
12+
import NanoFooter from '@NanoUI/NanoFooter/index.vue';
13+
</script>
14+
15+
<style scoped lang="scss">
16+
</style>
17+

‎package/components/NanoCopyright/index.vue‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
11
<template>
2-
<p
3-
class="text-gray-500 text-[calc(var(--footer-size)*.4)] underline"
4-
v-html="theme.footer.copyright"
5-
/>
2+
<div class="h-full w-a shrink-0 whitespace-nowrap">
3+
<p
4+
class="text-gray-500 text-[calc(var(--footer-size)*.4)] underline"
5+
v-html="theme.footer.copyright"
6+
/>
7+
</div>
68
</template>
79

810
<script setup lang="ts">

‎package/components/NanoFooter/index.vue‎

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,18 +5,20 @@
55
un-flex="~ items-center justify-between shrink-0"
66
style="background: var(--footer-bg);"
77
>
8-
<div class="relative h-full min-w-0 flex-1 flex items-center px-4">
9-
<NanoPaths/>
8+
<div class="relative h-full min-w-0 grow flex items-center px-4">
9+
<NanoPaths v-if="!ctl.hidePaths"/>
1010
</div>
11-
<div class="relative h-full min-w-0 flex-1 flex items-center flex-row-reverse px-4">
12-
<NanoCopyright/>
11+
<div class="relative h-full min-w-0 grow flex items-center flex-row-reverse px-4">
12+
<NanoCopyright v-if="!ctl.hideCopyright"/>
1313
</div>
1414
</footer>
1515
</template>
1616

1717
<script setup lang="ts">
1818
import NanoCopyright from '@NanoUI/NanoCopyright/index.vue';
1919
import NanoPaths from '@NanoUI/NanoPaths/index.vue';
20+
import { controllerStore } from '@store/controller';
21+
const ctl = controllerStore();
2022
</script>
2123

2224
<style scoped lang="scss">

‎package/components/NanoHeader/index.vue‎

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
<!--header left-->
99
<div class="relative flex-center gap-.8">
1010
<NanoLogo/>
11-
<NanoHeaderTopNav/>
11+
<NanoHeaderTopNav v-if="!ctl.hideHeaderTopNav"/>
1212
</div>
1313
<!--header right-->
1414
<div class="relative flex flex-row-reverse">
@@ -21,6 +21,8 @@
2121
import NanoLogo from '@NanoUI/NanoLogo/index.vue';
2222
import NanoHeaderTopNav from '@NanoUI/NanoHeaderTopNav/index.vue';
2323
import NanoWindowController from '@NanoUI/NanoWindowController/index.vue';
24+
import { controllerStore } from '@store/controller';
25+
const ctl = controllerStore();
2426
</script>
2527

2628
<style scoped lang="scss">

0 commit comments

Comments
 (0)