📝 Replace official website framework

2025-11-02 22:48:33 +08:00
1 parent 5688304817
commit 6a4780b002
@@ -0,0 +1,86 @@
+import {defineConfig} from 'vitepress'
+
+// https://vitepress.dev/reference/site-config
+export default defineConfig({
+    title: "voidraft",
+    description: "An elegant text snippet recording tool designed for developers.",
+    lang: 'zh-CN',
+    srcDir: 'src',
+    assetsDir: 'assets',
+    cacheDir: './.vitepress/cache',
+    outDir: './.vitepress/dist',
+    srcExclude: [],
+    ignoreDeadLinks: false,
+    head: [
+        [
+            "link",
+            {
+                rel: "icon",
+                type: "image/png",
+                href: "/static/icon/favicon-96x96.png",
+                sizes: "96x96",
+            },
+        ],
+        [
+            "link",
+            {
+                rel: "icon",
+                type: "image/svg+xml",
+                href: "/static/icon/favicon.svg",
+            },
+        ],
+        [
+            "link",
+            {
+                rel: "shortcut icon",
+                href: "/static/icon/favicon.ico",
+            },
+        ],
+        [
+            "link",
+            {
+                rel: "apple-touch-icon",
+                sizes: "180x180",
+                href: "/static/icon/apple-touch-icon.png",
+            },
+        ],
+        [
+            "meta",
+            {
+                name: "apple-mobile-web-app-title",
+                content: "voidraft",
+            },
+        ],
+        [
+            "link",
+            {
+                rel: "manifest",
+                href: "/static/icon/site.webmanifest",
+            },
+        ],
+        ['meta', {name: 'viewport', content: 'width=device-width,initial-scale=1'}]
+    ],
+    themeConfig: {
+        logo: '/static/icon/logo.png',
+        siteTitle: 'voidraft',
+        // https://vitepress.dev/reference/default-theme-config
+        nav: [
+            {text: 'Home', link: '/'},
+            {text: 'Examples', link: '/markdown-examples'}
+        ],
+
+        sidebar: [
+            {
+                text: 'Examples',
+                items: [
+                    {text: 'Markdown Examples', link: '/markdown-examples'},
+                    {text: 'Runtime API Examples', link: '/api-examples'}
+                ]
+            }
+        ],
+
+        socialLinks: [
+            {icon: 'github', link: 'https://github.com/landaiqing/voidraft'}
+        ]
+    }
+})
@@ -0,0 +1,17 @@
+// https://vitepress.dev/guide/custom-theme
+import { h } from 'vue'
+import type { Theme } from 'vitepress'
+import DefaultTheme from 'vitepress/theme'
+import './style.css'
+
+export default {
+  extends: DefaultTheme,
+  Layout: () => {
+    return h(DefaultTheme.Layout, null, {
+      // https://vitepress.dev/guide/extending-default-theme#layout-slots
+    })
+  },
+  enhanceApp({ app, router, siteData }) {
+    // ...
+  }
+} satisfies Theme
@@ -0,0 +1,139 @@
+/**
+ * Customize default theme styling by overriding CSS variables:
+ * https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/styles/vars.css
+ */
+
+/**
+ * Colors
+ *
+ * Each colors have exact same color scale system with 3 levels of solid
+ * colors with different brightness, and 1 soft color.
+ *
+ * - `XXX-1`: The most solid color used mainly for colored text. It must
+ *   satisfy the contrast ratio against when used on top of `XXX-soft`.
+ *
+ * - `XXX-2`: The color used mainly for hover state of the button.
+ *
+ * - `XXX-3`: The color for solid background, such as bg color of the button.
+ *   It must satisfy the contrast ratio with pure white (#ffffff) text on
+ *   top of it.
+ *
+ * - `XXX-soft`: The color used for subtle background such as custom container
+ *   or badges. It must satisfy the contrast ratio when putting `XXX-1` colors
+ *   on top of it.
+ *
+ *   The soft color must be semi transparent alpha channel. This is crucial
+ *   because it allows adding multiple "soft" colors on top of each other
+ *   to create an accent, such as when having inline code block inside
+ *   custom containers.
+ *
+ * - `default`: The color used purely for subtle indication without any
+ *   special meanings attached to it such as bg color for menu hover state.
+ *
+ * - `brand`: Used for primary brand colors, such as link text, button with
+ *   brand theme, etc.
+ *
+ * - `tip`: Used to indicate useful information. The default theme uses the
+ *   brand color for this by default.
+ *
+ * - `warning`: Used to indicate warning to the users. Used in custom
+ *   container, badges, etc.
+ *
+ * - `danger`: Used to show error, or dangerous message to the users. Used
+ *   in custom container, badges, etc.
+ * -------------------------------------------------------------------------- */
+
+:root {
+  --vp-c-default-1: var(--vp-c-gray-1);
+  --vp-c-default-2: var(--vp-c-gray-2);
+  --vp-c-default-3: var(--vp-c-gray-3);
+  --vp-c-default-soft: var(--vp-c-gray-soft);
+
+  --vp-c-brand-1: var(--vp-c-indigo-1);
+  --vp-c-brand-2: var(--vp-c-indigo-2);
+  --vp-c-brand-3: var(--vp-c-indigo-3);
+  --vp-c-brand-soft: var(--vp-c-indigo-soft);
+
+  --vp-c-tip-1: var(--vp-c-brand-1);
+  --vp-c-tip-2: var(--vp-c-brand-2);
+  --vp-c-tip-3: var(--vp-c-brand-3);
+  --vp-c-tip-soft: var(--vp-c-brand-soft);
+
+  --vp-c-warning-1: var(--vp-c-yellow-1);
+  --vp-c-warning-2: var(--vp-c-yellow-2);
+  --vp-c-warning-3: var(--vp-c-yellow-3);
+  --vp-c-warning-soft: var(--vp-c-yellow-soft);
+
+  --vp-c-danger-1: var(--vp-c-red-1);
+  --vp-c-danger-2: var(--vp-c-red-2);
+  --vp-c-danger-3: var(--vp-c-red-3);
+  --vp-c-danger-soft: var(--vp-c-red-soft);
+}
+
+/**
+ * Component: Button
+ * -------------------------------------------------------------------------- */
+
+:root {
+  --vp-button-brand-border: transparent;
+  --vp-button-brand-text: var(--vp-c-white);
+  --vp-button-brand-bg: var(--vp-c-brand-3);
+  --vp-button-brand-hover-border: transparent;
+  --vp-button-brand-hover-text: var(--vp-c-white);
+  --vp-button-brand-hover-bg: var(--vp-c-brand-2);
+  --vp-button-brand-active-border: transparent;
+  --vp-button-brand-active-text: var(--vp-c-white);
+  --vp-button-brand-active-bg: var(--vp-c-brand-1);
+}
+
+/**
+ * Component: Home
+ * -------------------------------------------------------------------------- */
+
+:root {
+  --vp-home-hero-name-color: transparent;
+  --vp-home-hero-name-background: -webkit-linear-gradient(
+    120deg,
+    #bd34fe 30%,
+    #41d1ff
+  );
+
+  --vp-home-hero-image-background-image: linear-gradient(
+    -45deg,
+    #bd34fe 50%,
+    #47caff 50%
+  );
+  --vp-home-hero-image-filter: blur(44px);
+}
+
+@media (min-width: 640px) {
+  :root {
+    --vp-home-hero-image-filter: blur(56px);
+  }
+}
+
+@media (min-width: 960px) {
+  :root {
+    --vp-home-hero-image-filter: blur(68px);
+  }
+}
+
+/**
+ * Component: Custom Block
+ * -------------------------------------------------------------------------- */
+
+:root {
+  --vp-custom-block-tip-border: transparent;
+  --vp-custom-block-tip-text: var(--vp-c-text-1);
+  --vp-custom-block-tip-bg: var(--vp-c-brand-soft);
+  --vp-custom-block-tip-code-bg: var(--vp-c-brand-soft);
+}
+
+/**
+ * Component: Algolia
+ * -------------------------------------------------------------------------- */
+
+.DocSearch {
+  --docsearch-primary-color: var(--vp-c-brand-1) !important;
+}
+
@@ -0,0 +1,49 @@
+---
+outline: deep
+---
+
+# Runtime API Examples
+
+This page demonstrates usage of some of the runtime APIs provided by VitePress.
+
+The main `useData()` API can be used to access site, theme, and page data for the current page. It works in both `.md` and `.vue` files:
+
+```md
+<script setup>
+import { useData } from 'vitepress'
+
+const { theme, page, frontmatter } = useData()
+</script>
+
+## Results
+
+### Theme Data
+<pre>{{ theme }}</pre>
+
+### Page Data
+<pre>{{ page }}</pre>
+
+### Page Frontmatter
+<pre>{{ frontmatter }}</pre>
+```
+
+<script setup>
+import { useData } from 'vitepress'
+
+const { site, theme, page, frontmatter } = useData()
+</script>
+
+## Results
+
+### Theme Data
+<pre>{{ theme }}</pre>
+
+### Page Data
+<pre>{{ page }}</pre>
+
+### Page Frontmatter
+<pre>{{ frontmatter }}</pre>
+
+## More
+
+Check out the documentation for the [full list of runtime APIs](https://vitepress.dev/reference/runtime-api#usedata).
@@ -0,0 +1,28 @@
+---
+# https://vitepress.dev/reference/default-theme-home-page
+layout: home
+
+hero:
+  name: "voidraft"
+  text: "An elegant text snippet recording tool designed for developers."
+  tagline: My great project tagline
+  image: 
+    src: /static/img/hero.png
+    alt: "voidraft"
+  actions:
+    - theme: brand
+      text: Markdown Examples
+      link: /markdown-examples
+    - theme: alt
+      text: API Examples
+      link: /api-examples
+
+features:
+  - title: Feature A
+    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
+  - title: Feature B
+    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
+  - title: Feature C
+    details: Lorem ipsum dolor sit amet, consectetur adipiscing elit
+---
+
@@ -0,0 +1,85 @@
+# Markdown Extension Examples
+
+This page demonstrates some of the built-in markdown extensions provided by VitePress.
+
+## Syntax Highlighting
+
+VitePress provides Syntax Highlighting powered by [Shiki](https://github.com/shikijs/shiki), with additional features like line-highlighting:
+
+**Input**
+
+````md
+```js{4}
+export default {
+  data () {
+    return {
+      msg: 'Highlighted!'
+    }
+  }
+}
+```
+````
+
+**Output**
+
+```js{4}
+export default {
+  data () {
+    return {
+      msg: 'Highlighted!'
+    }
+  }
+}
+```
+
+## Custom Containers
+
+**Input**
+
+```md
+::: info
+This is an info box.
+:::
+
+::: tip
+This is a tip.
+:::
+
+::: warning
+This is a warning.
+:::
+
+::: danger
+This is a dangerous warning.
+:::
+
+::: details
+This is a details block.
+:::
+```
+
+**Output**
+
+::: info
+This is an info box.
+:::
+
+::: tip
+This is a tip.
+:::
+
+::: warning
+This is a warning.
+:::
+
+::: danger
+This is a dangerous warning.
+:::
+
+::: details
+This is a details block.
+:::
+
+## More
+
+Check out the documentation for the [full list of markdown extensions](https://vitepress.dev/guide/markdown).
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" version="1.1" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200" viewBox="0 0 200 200"><image width="200" height="200" xlink:href="data:image/png;base64,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 truncated
+@media (prefers-color-scheme: dark) { :root { filter: none; } }
+</style></svg>
@@ -0,0 +1,21 @@
+{
+  "name": "voidraft",
+  "short_name": "voidraft",
+  "icons": [
+    {
+      "src": "/static/img/web-app-manifest-192x192.png",
+      "sizes": "192x192",
+      "type": "image/png",
+      "purpose": "maskable"
+    },
+    {
+      "src": "/static/img/web-app-manifest-512x512.png",
+      "sizes": "512x512",
+      "type": "image/png",
+      "purpose": "maskable"
+    }
+  ],
+  "theme_color": "#ffffff",
+  "background_color": "#ffffff",
+  "display": "standalone"
+}