kirigaya/openmcp-document
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

添加评论区

Browse Source
This commit is contained in:
锦恢 2025-06-15 23:36:27 +08:00
parent 04d61a27b2
commit 5b170c5b35
8 changed files with 257 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.vitepress/config.mts
View File

@ -34,7 +34,7 @@ export default withMermaid({
mapAuthors: contributors
}),
GitChangelogMarkdownSection({
excludes: ['preview/contributors.md', 'index.md', 'en/index.md', 'ja/index.md']
excludes: ['preview/contributors.md', 'index.md', 'zh/index.md', 'ja/index.md']
}),
ThumbnailHashImages(),
],

10
.vitepress/theme/Layout.vue
View File

@ -3,6 +3,15 @@
<template #home-hero-image>
<HeroImage />
</template>
<template #doc-before>
</template>
<template #doc-after>
<Comments />
</template>
</DefaultTheme.Layout>
<ClientOnly>
<ScrollBar v-if="mounted" />
@ -22,6 +31,7 @@ import HeroImage from './components/home/HeroImage.vue';
import { gsap } from "gsap/dist/gsap";
import { ScrollTrigger } from "gsap/dist/ScrollTrigger";
import { watchEffect } from 'vue';
import Comments from './components/Comments/index.vue';
const data = useData();
const router = useRouter();

38
.vitepress/theme/components/Comments/index.vue Normal file
View File

@ -0,0 +1,38 @@
<script setup lang="ts">
import { useData } from 'vitepress'
const { title } = useData()
</script>
<template>
<div :key="title" class="giscus comment-block">
<component
:is="'script'"
src="https://giscus.app/client.js"
data-repo="LSTM-Kirigaya/openmcp-document"
data-repo-id="R_kgDOOuuE1g"
data-category="General"
data-category-id="DIC_kwDOOuuE1s4Crh0z"
data-mapping="pathname"
data-strict="0"
data-reactions-enabled="1"
data-emit-metadata="0"
data-input-position="bottom"
data-theme="preferred_color_scheme"
data-lang="zh-CN"
crossorigin="anonymous"
async
/>
</div>
</template>
<style>
.comment-block {
margin-top: 100px;
}
.comment-block iframe {
box-shadow: none !important;
}
</style>

187
.vitepress/theme/css/giscus.css Normal file
View File

@ -0,0 +1,187 @@
/* Giscus评论系统主题适配 */
:root {
/* 浅色主题变量 */
--giscus-light-bg: #ffffff;
--giscus-light-text: #22272e;
--giscus-light-border: #e1e4e8;
--giscus-light-btn-bg: #f6f8fa;
--giscus-light-btn-hover: #f3f4f6;
--giscus-light-comment-bg: #f6f8fa;
--giscus-light-link: var(--vp-c-brand-2);
--giscus-light-code-bg: rgba(175, 184, 193, 0.2);
/* 深色主题变量 */
--giscus-dark-bg: #15202b;
--giscus-dark-text: #adbac7;
--giscus-dark-border: #444c56;
--giscus-dark-btn-bg: #373e47;
--giscus-dark-btn-hover: #444c56;
--giscus-dark-comment-bg: #1e2d3b;
--giscus-dark-link: var(--vp-c-brand-1);
--giscus-dark-code-bg: rgba(99, 110, 123, 0.4);
}
/* 基础样式 */
main {
/* 使用您的品牌色重新定义语法高亮 */
--color-prettylights-syntax-comment: var(--vp-c-text-2);
--color-prettylights-syntax-constant: var(--vp-c-brand-1);
--color-prettylights-syntax-entity: var(--vp-c-brand-2);
--color-prettylights-syntax-storage-modifier-import: var(--vp-c-text-1);
--color-prettylights-syntax-entity-tag: #8ddb8c;
--color-prettylights-syntax-keyword: #f47067;
--color-prettylights-syntax-string: #96d0ff;
--color-prettylights-syntax-variable: #f69d50;
--color-prettylights-syntax-brackethighlighter-unmatched: #e5534b;
--color-prettylights-syntax-invalid-illegal-text: var(--vp-c-text-1);
--color-prettylights-syntax-invalid-illegal-bg: #922323;
--color-prettylights-syntax-carriage-return-text: var(--vp-c-text-1);
--color-prettylights-syntax-carriage-return-bg: #ad2e2c;
--color-prettylights-syntax-string-regexp: #8ddb8c;
--color-prettylights-syntax-markup-list: #eac55f;
--color-prettylights-syntax-markup-heading: var(--vp-c-brand-3);
--color-prettylights-syntax-markup-italic: var(--vp-c-text-1);
--color-prettylights-syntax-markup-bold: var(--vp-c-text-1);
--color-prettylights-syntax-markup-deleted-text: #ffd8d3;
--color-prettylights-syntax-markup-deleted-bg: #78191b;
--color-prettylights-syntax-markup-inserted-text: #b4f1b4;
--color-prettylights-syntax-markup-inserted-bg: #1b4721;
--color-prettylights-syntax-markup-changed-text: #ffddb0;
--color-prettylights-syntax-markup-changed-bg: #682d0f;
--color-prettylights-syntax-markup-ignored-text: var(--vp-c-text-2);
--color-prettylights-syntax-markup-ignored-bg: #255ab2;
--color-prettylights-syntax-meta-diff-range: var(--vp-c-brand-2);
/* 按钮样式 */
--color-btn-text: var(--vp-c-text-1);
--color-btn-bg: var(--vp-c-default-soft);
--color-btn-border: var(--vp-c-border);
--color-btn-shadow: 0 0 transparent;
--color-btn-inset-shadow: 0 0 transparent;
--color-btn-hover-bg: var(--vp-c-default-2);
--color-btn-hover-border: var(--vp-c-border);
--color-btn-active-bg: var(--vp-c-default-3);
--color-btn-active-border: var(--vp-c-border);
--color-btn-selected-bg: var(--vp-c-default-3);
/* 主按钮样式 - 使用您的品牌色 */
--color-btn-primary-text: var(--vp-c-white);
--color-btn-primary-bg: var(--vp-c-brand-3);
--color-btn-primary-border: transparent;
--color-btn-primary-shadow: 0 0 transparent;
--color-btn-primary-inset-shadow: 0 0 transparent;
--color-btn-primary-hover-bg: var(--vp-c-brand-2);
--color-btn-primary-hover-border: transparent;
--color-btn-primary-selected-bg: var(--vp-c-brand-3);
--color-btn-primary-selected-shadow: 0 0 transparent;
--color-btn-primary-disabled-text: rgba(255, 255, 255, 0.5);
--color-btn-primary-disabled-bg: rgba(163, 104, 184, 0.6);
--color-btn-primary-disabled-border: transparent;
/* 其他元素 */
--color-fg-default: var(--vp-c-text-1);
--color-fg-muted: var(--vp-c-text-2);
--color-fg-subtle: var(--vp-c-text-3);
--color-canvas-default: var(--vp-c-bg);
--color-canvas-overlay: var(--vp-c-bg-soft);
--color-canvas-inset: var(--vp-c-bg-alt);
--color-canvas-subtle: var(--vp-c-bg-soft);
--color-border-default: var(--vp-c-border);
--color-border-muted: var(--vp-c-divider);
--color-accent-fg: var(--vp-c-brand-1);
--color-accent-emphasis: var(--vp-c-brand-3);
--color-accent-muted: var(--vp-c-brand-soft);
--color-accent-subtle: var(--vp-c-brand-soft);
/* 加载动画 */
--color-homepage-bg: var(--vp-c-bg);
}
/* 浅色主题适配 */
@media (prefers-color-scheme: light) {
main {
--color-canvas-default: var(--giscus-light-bg);
--color-canvas-overlay: var(--giscus-light-comment-bg);
--color-canvas-inset: var(--giscus-light-comment-bg);
--color-canvas-subtle: var(--giscus-light-btn-bg);
--color-fg-default: var(--giscus-light-text);
--color-fg-muted: #57606a;
--color-fg-subtle: #6e7781;
--color-border-default: var(--giscus-light-border);
--color-border-muted: #d0d7de;
--color-btn-bg: var(--giscus-light-btn-bg);
--color-btn-hover-bg: var(--giscus-light-btn-hover);
--color-accent-fg: var(--giscus-light-link);
--color-prettylights-syntax-comment: #6e7781;
}
}
/* 深色主题适配 */
@media (prefers-color-scheme: dark) {
main {
--color-canvas-default: var(--giscus-dark-bg);
--color-canvas-overlay: var(--giscus-dark-comment-bg);
--color-canvas-inset: var(--giscus-dark-comment-bg);
--color-canvas-subtle: var(--giscus-dark-btn-bg);
--color-fg-default: var(--giscus-dark-text);
--color-fg-muted: #768390;
--color-fg-subtle: #545d68;
--color-border-default: var(--giscus-dark-border);
--color-border-muted: #373e47;
--color-btn-bg: var(--giscus-dark-btn-bg);
--color-btn-hover-bg: var(--giscus-dark-btn-hover);
--color-accent-fg: var(--giscus-dark-link);
--color-prettylights-syntax-comment: #768390;
}
}
/* 自定义样式 */
.gsc-reactions-count {
display: none;
}
.gsc-timeline {
flex-direction: column-reverse;
}
.gsc-header {
padding-bottom: 1rem;
}
.gsc-comments>.gsc-header {
order: 1;
}
.gsc-comments>.gsc-comment-box {
margin-bottom: 1rem;
order: 2;
}
.gsc-comments>.gsc-timeline {
order: 3;
}
main .gsc-loading-image {
background-image: url(https://github.githubassets.com/images/mona-loading-dimmed.gif);
}
/* 链接颜色 */
.gsc-comment a {
color: var(--color-accent-fg) !important;
}
/* 代码块背景 */
.gsc-comment markdown-body pre {
background-color: var(--color-canvas-subtle) !important;
}
/* 评论框样式 */
.gsc-comment-box {
border: 1px solid var(--color-border-default) !important;
background-color: var(--color-canvas-default) !important;
}
/* 按钮悬停效果 */
.gsc-reaction-button:hover {
background-color: var(--color-btn-hover-bg) !important;
}

3
.vitepress/theme/css/style.css
View File

@ -314,4 +314,5 @@ iframe {
font-size: 20px;
opacity: 0.5;
line-height: 0.8;
}
}

11
.vitepress/theme/index.mts
View File

@ -1,6 +1,8 @@
// https://vitepress.dev/guide/custom-theme
import { h } from 'vue';
import type { Theme } from 'vitepress';
import { inBrowser } from 'vitepress';
import busuanzi from 'busuanzi.pure.js';
import DefaultTheme from 'vitepress/theme';
import CustomLayout from './Layout.vue';
@ -14,7 +16,7 @@ import Contributors from './components/Contributors/index.vue';
import { NolebaseGitChangelogPlugin } from '@nolebase/vitepress-plugin-git-changelog/client';
import { NolebaseInlineLinkPreviewPlugin } from '@nolebase/vitepress-plugin-inline-link-preview/client';
import { NolebaseUnlazyImg } from '@nolebase/vitepress-plugin-thumbnail-hash/client';
import { ElCollapse, ElCollapseItem, ElTimeline, ElTimelineItem } from 'element-plus';
import './css/style.css';
@ -46,5 +48,12 @@ export default {
app.use(NolebaseGitChangelogPlugin);
app.use(NolebaseInlineLinkPreviewPlugin);
// 添加浏览量统计
if (inBrowser) {
router.onAfterRouteChange = () => {
busuanzi.fetch()
}
}
}
} satisfies Theme

8
package-lock.json generated
View File

@ -17,6 +17,7 @@
"@nolebase/vitepress-plugin-inline-link-preview": "^2.17.1",
"@nolebase/vitepress-plugin-page-properties": "^2.17.1",
"@nolebase/vitepress-plugin-thumbnail-hash": "^2.17.1",
"busuanzi.pure.js": "^1.0.3",
"chalk": "^5.4.1",
"mermaid": "^11.6.0",
"ompipe": "^1.0.2",
@ -2727,6 +2728,13 @@
"node": ">=8"
}
},
"node_modules/busuanzi.pure.js": {
"version": "1.0.3",
"resolved": "https://registry.npmjs.org/busuanzi.pure.js/-/busuanzi.pure.js-1.0.3.tgz",
"integrity": "sha512-tPULdyx+8NNb9geZYDpktKmHAYx9f2LEOBaHyWCaM7iPEMIa/43KgYAUluuU7YG9UFSOFpj4dO7Nj2Vlu3V9Rg==",
"dev": true,
"license": "MIT"
},
"node_modules/canvaskit-wasm": {
"version": "0.40.0",
"resolved": "https://registry.npmjs.org/canvaskit-wasm/-/canvaskit-wasm-0.40.0.tgz",

1
package.json
View File

@ -19,6 +19,7 @@
"@nolebase/vitepress-plugin-inline-link-preview": "^2.17.1",
"@nolebase/vitepress-plugin-page-properties": "^2.17.1",
"@nolebase/vitepress-plugin-thumbnail-hash": "^2.17.1",
"busuanzi.pure.js": "^1.0.3",
"chalk": "^5.4.1",
"mermaid": "^11.6.0",
"ompipe": "^1.0.2",