docs: new i18n and ecosystem contents

This commit is contained in:
YunYouJun 2023-10-06 02:02:39 +08:00
parent 075ff3fddb
commit 6599c6e04d
37 changed files with 498 additions and 362 deletions

View File

@ -57,7 +57,7 @@ For a example, you can see [demo/yun](./demo/yun/) folder.
- 🌍 [CSS i18n in One Page](https://valaxy.site/guide/i18n)
- 🔍 [Use icons from any icon sets with classes](https://github.com/antfu/unocss/tree/main/packages/preset-icons) - [Icônes](https://icones.netlify.app/)
- 👔 Extended Theme with [Layout system](https://github.com/JohnCampionJr/vite-plugin-vue-layouts)
- ⚙️ Unit Testing with [Vitest](https://github.com/vitest-dev/vitest) (Todo)
- ⚙️ Unit Testing with [Vitest](https://github.com/vitest-dev/vitest)
- ☁️ Deploy zero-config
- [Netlify](https://www.netlify.com/) with `netlify.toml`
- [GitHub Pages](https://pages.github.com/) with `.github/workflows/gh-pages.yml` [GitHub Actions](https://github.com/features/actions)

View File

@ -57,7 +57,7 @@ pnpm create valaxy
- 🌍 [在同一页面通过 CSS 的 i18n](https://valaxy.site/guide/i18n)
- 🔍 [通过 class 从图标集中使用图标](https://github.com/antfu/unocss/tree/main/packages/preset-icons) - [Icônes](https://icones.netlify.app/)
- 👔 扩展主题 with [Layout system](https://github.com/JohnCampionJr/vite-plugin-vue-layouts)
- ⚙️ 单元测试 with [Vitest](https://github.com/vitest-dev/vitest) (Todo)
- ⚙️ 单元测试 with [Vitest](https://github.com/vitest-dev/vitest)
- ☁️ 零配置部署
- [Netlify](https://www.netlify.com/) with `netlify.toml`
- [GitHub Pages](https://pages.github.com/) with `.github/workflows/gh-pages.yml` [GitHub Actions](https://github.com/features/actions)

View File

@ -1,125 +0,0 @@
import { defineConfig } from 'vitepress'
import UnoCSS from 'unocss/vite'
import Components from 'unplugin-vue-components/vite'
import {
presetAttributify,
presetIcons,
presetTypography,
presetUno,
transformerDirectives,
transformerVariantGroup,
} from 'unocss'
// https://vitepress.dev/reference/site-config
export default defineConfig({
// remove it after migrate finish
ignoreDeadLinks: true,
title: 'Valaxy',
description: 'Docs for Valaxy',
themeConfig: {
// https://vitepress.dev/reference/default-theme-config
nav: [
{
text: 'Docs',
items: [
{
text: 'Getting Started',
link: '/guide/getting-started',
},
{
text: 'Migration from Other',
link: '/migration/',
},
],
},
{
text: 'Themes',
items: [
{
text: 'Use Theme',
link: '/themes/use',
},
{
text: 'Write A Theme',
link: '/themes/write',
},
{
text: 'Themes Gallery',
link: '/themes/gallery',
},
],
},
{
text: 'Addons',
items: [
{
text: 'Why need addons?',
link: '/addons',
},
{
text: 'Use A Addon',
link: '/addons/use',
},
{
text: 'Write A Addon',
link: '/addons/write',
},
],
},
],
sidebar: [
{
text: 'Examples',
items: [
{ text: 'Markdown Examples', link: '/markdown-examples' },
{ text: 'Runtime API Examples', link: '/api-examples' },
],
},
],
socialLinks: [
{ icon: 'github', link: 'https://github.com/vuejs/vitepress' },
],
search: {
provider: 'algolia',
options: {
appId: '8J64VVRP8K',
apiKey: 'a18e2f4cc5665f6602c5631fd868adfd',
indexName: 'vitepress',
},
},
},
vite: {
plugins: [
UnoCSS({
presets: [
presetUno(),
presetAttributify(),
presetIcons({
scale: 1.2,
warn: true,
}),
presetTypography(),
],
transformers: [
transformerDirectives(),
transformerVariantGroup(),
],
}),
// https://github.com/antfu/unplugin-vue-components
Components({
allowOverrides: true,
dirs: ['.vitepress/theme/components'],
dts: '.vitepress/theme/components.d.ts',
// for docs md
include: [/\.vue/, /\.md/],
}),
],
},
})

View File

@ -1,20 +0,0 @@
<template>
<div m="auto y-8" text="center" font="black">
<h3 text="3xl">
🧪
</h3>
<div class="mt-5 flex">
<div class="mx-auto">
<p>or try it now</p>
<div class="language-bash m-2 p-2" bg="$vp-c-bg-soft">
<pre my="0"><code><span class="opacity-50">$ </span><span class="token function">pnpm create</span> <span class="token text-$vp-c-brand-lighter">valaxy</span></code></pre>
</div>
</div>
</div>
<div mt="8" text="3xl">
WORK IN PROGRESS
</div>
</div>
</template>

View File

@ -1,18 +0,0 @@
// https://vitepress.dev/guide/custom-theme
import { h } from 'vue'
import Theme from 'vitepress/theme'
import './style.css'
import 'uno.css'
export default {
extends: Theme,
Layout: () => {
return h(Theme.Layout, null, {
// https://vitepress.dev/guide/extending-default-theme#layout-slots
})
},
// enhanceApp({ app, router, siteData }) {
// ...
// },
}

View File

@ -1,92 +0,0 @@
/**
* Customize default theme styling by overriding CSS variables:
* https://github.com/vuejs/vitepress/blob/main/src/client/theme-default/styles/vars.css
*/
/**
* Colors
* -------------------------------------------------------------------------- */
:root {
--vp-c-brand: #6c22ec;
--vp-c-brand-light: #5849eb;
--vp-c-brand-lighter: #5553eb;
--vp-c-brand-lightest: #5553ebcc;
--vp-c-brand-dark: #535bf2;
--vp-c-brand-darker: #454ce1;
--vp-c-brand-dimm: rgba(100, 108, 255, 0.08);
}
/**
* Component: Button
* -------------------------------------------------------------------------- */
:root {
--vp-button-brand-border: var(--vp-c-brand-light);
--vp-button-brand-text: var(--vp-c-white);
--vp-button-brand-bg: var(--vp-c-brand);
--vp-button-brand-hover-border: var(--vp-c-brand-light);
--vp-button-brand-hover-text: var(--vp-c-white);
--vp-button-brand-hover-bg: var(--vp-c-brand-light);
--vp-button-brand-active-border: var(--vp-c-brand-light);
--vp-button-brand-active-text: var(--vp-c-white);
--vp-button-brand-active-bg: var(--vp-button-brand-bg);
}
/**
* Component: Home
* -------------------------------------------------------------------------- */
:root {
--vp-home-hero-name-color: transparent;
--vp-home-hero-name-background: -webkit-linear-gradient(
120deg,
rgb(108, 34, 236) 30%,
rgb(59, 130, 246)
);
--vp-home-hero-image-background-image: linear-gradient(
-45deg,
rgba(108, 34, 236, 0.4) 50%,
rgba(59, 130, 246, 0.4) 50%
);
--vp-home-hero-image-filter: blur(40px);
}
@media (min-width: 640px) {
:root {
--vp-home-hero-image-filter: blur(56px);
}
}
@media (min-width: 960px) {
:root {
--vp-home-hero-image-filter: blur(72px);
}
}
/**
* Component: Custom Block
* -------------------------------------------------------------------------- */
:root {
--vp-custom-block-tip-border: var(--vp-c-brand);
--vp-custom-block-tip-text: var(--vp-c-brand-darker);
--vp-custom-block-tip-bg: var(--vp-c-brand-dimm);
}
.dark {
--vp-custom-block-tip-border: var(--vp-c-brand);
--vp-custom-block-tip-text: var(--vp-c-brand-lightest);
--vp-custom-block-tip-bg: var(--vp-c-brand-dimm);
}
/**
* Component: Algolia
* -------------------------------------------------------------------------- */
.DocSearch {
--docsearch-primary-color: var(--vp-c-brand) !important;
}

16
docs/assets/sites.ts Normal file
View File

@ -0,0 +1,16 @@
export const sites = [
{
name: '默认示例',
url: 'https://valaxy.site',
avatar: 'https://valaxy.site/valaxy-logo.png',
desc: '主题默认示例',
theme: 'press',
},
{
name: '云游君的小站',
url: 'https://www.yunyoujun.cn',
avatar: 'https://www.yunyoujun.cn/images/avatar.jpg',
desc: '希望能成为一个有趣的人',
theme: 'yun',
},
]

View File

@ -8,7 +8,7 @@ export interface ValaxyAddon {
repo: string
desc: string
siteImage: string
siteExampleURL?: string
siteExampleUrl?: string
tags?: string[]
}

View File

@ -0,0 +1,51 @@
<script lang="ts" setup>
export interface ExampleSite {
/**
* 站点名称
*/
name: string
/**
* 站点链接
*/
url: string
/**
* 头像/LOGO
*/
avatar: string
/**
* 简要描述
*/
desc: string
/**
* 主题
*/
theme: string
}
withDefaults(
defineProps<{
site: ExampleSite
}>(),
{
site: () => ({
name: '云游君的小站',
url: 'https://www.yunyoujun.cn',
avatar: 'https://www.yunyoujun.cn/images/avatar.jpg',
desc: '希望能成为一个有趣的人',
theme: 'yun',
}),
},
)
</script>
<template>
<a
class="rounded flex! flex-col! justify-center! items-center! shadow p-4 hover:shadow-md transition! decoration-none!"
:href="site.url" target="_blank"
>
<img class="shadow flex rounded rounded-full w-15 h-15" :src="site.avatar">
<sub m="t-3" class="block w-20 truncate whitespace-nowrap" text="xs center" :title="site.desc">
{{ site.name }}
</sub>
</a>
</template>

View File

@ -0,0 +1,11 @@
<script lang="ts" setup>
import { sites } from '../assets/sites'
</script>
<template>
<div grid="~ cols-7" gap="2">
<div v-for="item in sites" :key="item.url" inline-grid class="px-1 py-2">
<ExampleSite :site="item" />
</div>
</div>
</template>

View File

@ -9,7 +9,7 @@ const props = withDefaults(defineProps<{
repo: string
desc: string
siteImage: string
siteExampleURL?: string
siteExampleUrl?: string
tags?: string[]
}[]
}>(), {})
@ -46,14 +46,14 @@ const filteredThemes = computed(() => {
hover="bg-$va-c-bg shadow-md"
>
<div class="img-wrapper" cursor-pointer>
<img :src="theme.siteImage" :alt="theme.name">
<a target="_blank" :href="theme.siteExampleURL || theme.repo" :alt="theme.name" class="mask">
<img w="full" h="58" class="object-cover" :src="theme.siteImage" :alt="theme.name">
<a target="_blank" :href="theme.siteExampleUrl || theme.repo" :alt="theme.name" class="mask">
<div class="i-ri-eye-line text-40px text-white " />
</a>
</div>
<div px-4 pb-4>
<a :href="theme.repo" target="_blank" class="decoration-none!">
<h3 mt-5 flex justify-center items-center>
<h3 class="mt-4!" flex justify-center items-center>
<div text-xl mr-2 :class="theme.icon" />
<span>{{ theme.name }}</span>
</h3>
@ -62,6 +62,10 @@ const filteredThemes = computed(() => {
<a mr-2 class="text-red-600!" :href="`https://npmjs.com/package/${theme.name}`" target="_blank" alt="NPM Package">
<div i-ri-npmjs-line />
</a>
<a mr-2 class="text-blue-600!" :href="theme.siteExampleUrl" target="_blank" alt="NPM Package">
<div i-ri-slideshow-2-line />
</a>
</p>
<p class="my-1!">
{{ theme.desc }}

View File

@ -1,44 +0,0 @@
---
# https://vitepress.dev/reference/default-theme-home-page
layout: home
title: Valaxy
titleTemplate: 'Next Generation Static Blog Framework'
hero:
name: Valaxy
text: Next Generation Static Blog Framework
tagline: Quick startup with comfortable custom experience.
image:
src: /valaxy-logo.png
alt: Valaxy Logo
actions:
- theme: brand
text: Get Started
# link: /guide
link: /pages/guide/getting-started.md
- theme: alt
text: Why Valaxy?
link: /guide/why
- theme: alt
text: View on GitHub
link: https://github.com/YunYouJun/valaxy
# todo, rewrite with valaxy
features:
- title: "Vite: The DX that can't be beat"
icon: 🚀
details: Feel the speed of Vite. Instant server start and lightning fast HMR that stays fast regardless of the app size.
- title: Designed to be simplicity first
icon: 📖
details: With Markdown-centered content, it's built to help you focus on writing and deployed with minimum configuration.
- title: Power of Vue meets Markdown
icon: 💡
details: Enhance your content with all the features of Vue in Markdown, while being able to customize your site with Vue.
- title: Fully static yet still dynamic
icon: ⚡
details: Go wild with true SSG + SPA architecture. Static on page load, but engage users with 100% interactivity from there.
---
<HomeHero />
<ValaxySponsors />

View File

@ -18,6 +18,17 @@ nav:
write-an-addon: Write An Addon
addons-gallery: Addons Gallery
ecosystem: Ecosystem
vscode: VSCode Extension
client: Client
news: Newsletters
community: Community
dev: Join Dev
examples:
site: Example Sites
category:
getting-started: Getting Started
guide: Guide
@ -25,6 +36,7 @@ category:
migration: Migration
third: Third
custom: Custom
examples: Examples
theme: Theme
addon: Addon
dev: Dev
@ -39,3 +51,41 @@ hero:
actions:
get-started: Get Started
view-github: View Github
features:
markdown:
title: Markdown - Focus on Your Content
details: Supports complete Markdown syntax and various extensions, undoubtedly including SSG.
vite:
title: Vite - Lightning-Fast DX
details: Enjoy the ecosystem and hot-reloading development experience brought by Vite, even when writing content or configurations.
vue:
title: Vue - Customizable View
details: Use Vue in Markdown or customize any component and layout in the theme.
unocss:
title: UnoCSS - Freedom in Writing Styles
details: Freely write any styles in articles, components, and anywhere else while maintaining minimal size.
vueuse:
title: VueUse - Composable API Utilities
details: Built-in VueUse satisfies your various needs on demand, and we also have our own Blog Composition API.
actions:
title: Actions - Automated Deployment
details: Built-in deployment configurations for GitHub Actions, Netlify, Vercel, and more. Deploy your site with just one click.
i18n:
title: Internationalization - Seamless Support
details: Achieve global multilingual support for single pages and local elements using Vue i18n + CSS i18n. No need new pages or sites.
typescript:
title: TypeScript - Type Safety
details: All configurations and APIs come with comprehensive type safety and intelligent suggestions, as it should be.
vscode:
title: VSCode - Smooth Development Experience
details: We are improving the VSCode plugin to provide a better experience when using VSCode for development and writing articles.
theme:
title: Themes - Extension or Customization
details: Override any component and layout in the theme with identically named Vue components or write your own theme.
addon:
title: Addons - Infinite Possibilities
details: Fully compatible with Vite/Vue plugins. You can further encapsulate and simplify configurations or extend functionality (including components) through addons.
electron:
title: Electron - Desktop Applications
details: In the future, we will also release a client application for non-developers, making development, deployment, and publishing more convenient. Stay tuned...

View File

@ -18,6 +18,17 @@ nav:
write-an-addon: 编写插件
addons-gallery: 插件橱窗
ecosystem: 生态
vscode: VSCode 插件
client: 客户端应用
news: 新闻
community: 社区
dev: 参与开发
examples:
site: 示例站点
category:
getting-started: 起步
guide: 指南
@ -25,6 +36,7 @@ category:
migration: 迁移
third: 第三方
custom: 自定义
examples: 示例
theme: 主题
addon: 插件
dev: 开发
@ -39,3 +51,41 @@ hero:
actions:
get-started: 快速上手
view-github: 查看 Github
features:
markdown:
title: Markdown - 专注你的内容
details: 支持完整的 Markdown 语法与各类扩展格式,毫无疑问还有 SSG
vite:
title: Vite - 极速的开发体验
details: 享受 Vite 带来的生态与热更新开发体验,即便在编写内容与修改配置之时
vue:
title: Vue - 自定义任意组件与布局
details: 在 Markdown 中使用 Vue或是自定义覆盖主题中的任意组件与布局
unocss:
title: UnoCSS - 自由的编写样式
details: 在文章、组件以及任意地方自由地编写任意样式,同时保持最小的体积
vueuse:
title: VueUse - 合成式 API 工具集
details: 内置的 VueUse 按需满足你的各类需求,除此之外,还有我们自身的 Blog Composition API
actions:
title: Actions - 自动化部署
details: 内置 GitHub Actions、Netlify、Vercel 等自动部署配置,一键部署你的站点
i18n:
title: 国际化 - 无缝的多语言支持
details: Vue i18n + CSS i18n 实现单页面与局部元素的全局多语言支持,国际化无需新页面/新站点
typescript:
title: TypeScript - 类型安全
details: 所有配置与 API 伴随着完备的类型安全与智能提示,这是当然的
vscode:
title: VSCode - 流畅的开发体验
details: 我们正在完善 VSCode 插件,以便你在使用 VSCode 开发、编写文章过程中获得更好的体验
theme:
title: 主题 - 扩展亦或自定义
details: 通过同名 Vue 组件覆盖主题中的任意组件与布局,或是编写自己的主题
addon:
title: 插件 - 无限的可能性
details: 完全兼容 Vite/Vue 插件外,你还可通过 Addon 进一步封装简化配置或扩展功能(包括组件)
electron:
title: Electron - 客户端应用
details: 在未来我们还将推出面向非开发者的客户端,让你从开发、部署到发布更加便捷,敬请期待……

View File

@ -16,6 +16,7 @@
"dependencies": {
"valaxy": "link:../packages/valaxy",
"valaxy-addon-algolia": "link:../packages/valaxy-addon-algolia",
"valaxy-addon-components": "workspace:*",
"valaxy-theme-press": "link:../packages/valaxy-theme-press"
},
"devDependencies": {

View File

@ -11,11 +11,9 @@ end: false
## Todo
- [ ] create-valaxy-theme: Script to generate theme template.
- [ ] create-valaxy-addon: Script to generate addon template.
- [ ] create-valaxy
- select theme to init (default: valaxy-theme-yun)
- [ ] Debug component.
- [x] local search
- [ ] algolia search for valaxy-theme-press
## Dev

View File

@ -0,0 +1,18 @@
---
title: Client
title_zh: 客户端
categories:
- ecosystem
---
- [valaxy-admin](https://github.com/valaxyjs/valaxy-admin)
## 安装
::: warning
开发中,暂未发布
:::
## 功能
我们计划以客户端面板(基于 Electron的形式提供从安装到部署的一体化界面流程以便供非开发者用户使用。

View File

@ -0,0 +1,30 @@
---
title: Community
title_zh: 社区
categories:
- ecosystem
---
## 社群
- [QQ 群 1050458482](https://qm.qq.com/cgi-bin/qm/qr?k=kZJzggTTCf4SpvEQ8lXWoi5ZjhAx0ILZ&jump_from=webapi)
- [Discord](https://discord.gg/sGe4U4p4CK)
## GitHub Org
- [Valaxyjs](https://github.com/valaxyjs)
- [Valaxy](https://github.com/YunYouJun/valaxy)
- [社区讨论](https://github.com/YunYouJun/valaxy/discussions)
- [问题反馈](https://github.com/YunYouJun/valaxy/issues)
### 相关副产物
- [css-i18n](https://github.com/valaxyjs/css-i18n): CSS 国际化方案
## 主题
- 见 [主题橱窗](/themes/gallery)
## 插件
- 见 [插件橱窗](/addons/gallery)

View File

@ -0,0 +1,14 @@
---
title: News
title_zh: 新闻
categories:
- ecosystem
---
## v0.15.x
- [Release Notes](https://github.com/YunYouJun/valaxy/releases/tag/v0.15.0)
### Break Changes
Valaxy 完全升级至 ESM 模块化,不再支持 CommonJS。

View File

@ -0,0 +1,21 @@
---
title: VSCode Extension
title_zh: VSCode 扩展
categories:
- ecosystem
---
- GitHub: [valaxy-vscode](https://github.com/YunYouJun/valaxy-vscode)
- VSCode Marketplace: [Valaxy](https://marketplace.visualstudio.com/items?itemName=yunyoujun.valaxy)
## 安装
在 VSCode 插件商店中搜索 `Valaxy` 安装即可。
> [Valaxy](https://marketplace.visualstudio.com/items?itemName=yunyoujun.valaxy)
## 功能
它提供了文章列表预览/切换/删除等功能,以便让你尽可能地可以在 VSCode 中完成所有操作。
正在完善中……

View File

@ -1,7 +0,0 @@
---
title: 示例
---
提供各种各样的示例。
Todo。

View File

@ -4,13 +4,14 @@ date: 2020-03-23 02:02:15
updated: 2020-03-23 02:02:15
toc: true
categories:
- Docs
- Example
- examples
---
## [KaTeX](https://katex.org/)
## [$\KaTeX$](https://katex.org/)
- <https://katex.org/docs/autorender.html>
- [KaTeX Supported Functions](https://katex.org/docs/supported.html)
- [KaTeX Support Table](https://katex.org/docs/support_table.html)
### 行内公式

View File

@ -0,0 +1,12 @@
---
title: 示例站点
title_zh: 示例站点
categories:
- ecosystem
---
::: tip
欢迎 [提交 PR](https://github.com/YunYouJun/valaxy/blob/main/docs/assets/sites.ts) 补充你的站点!
:::
<ExampleSites />

View File

@ -18,24 +18,54 @@ Valaxy has several simple components built in.
You can use them directly when writing articles or themes.
:::
::: tip <div flex items="center" pb-1><div inline-flex i-logos:vue /> <span ml-1 inline-flex>基于 Vue 组件</span></div>
:::
## 基础组件 {lang="zh-CN"}
## Basic Components {lang="en"}
::: zh-CN
> 面向主题开发者,你通常不需要直接使用
::: info
面向主题开发者(普通用户通常不需要直接使用)
:::
- `ValaxyMain`: 页面基础布局
- `ValaxyMd`: Markdown 渲染内容
::: zh-CN
### 布局与渲染
- [`ValaxyMain.vue`](https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyMain.vue): 页面基础布局
- [`ValaxyMd.vue`](https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyMd.vue): Markdown 渲染内容
:::
::: en
> For theme developers, you usually don't need to use them directly.
> For theme developers, common users usually don't need to use them directly.
- `ValaxyMain`: Basic page layout
- `ValaxyMd`: Rendered Markdown content
### Layout and Rendering
- [`ValaxyMain.vue`](https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyMain.vue): Basic page layout
- [`ValaxyMd.vue`](https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyMd.vue): Rendered Markdown content
:::
### 其他
- [`AppLink.vue`](https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyCopyright.vue): 根据链接
自动判断是否为站内链接,站内链接使用 `<router-link/>`,站外链接使用 `<a target="_blank"></a>`
- [`ValaxyCopyright.vue`](https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyCopyright.vue): 文章中的
版权信息
- [`ValaxyDecrypt.vue`](https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyDecrypt.vue): 文本解密组件
- [`ValaxyGalleryDecrypt.vue`](https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyGalleryDecrypt.vue): 图片解密组件
- [`ValaxyLogo.vue`](https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyLogo.vue): 带渐变色彩的 Valaxy Logo
- [`ValaxySvgLogo.vue`](<https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxySvgLogo.vue>): Valaxy SVG Logo
- [`ValaxyPagination.vue`](<https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyPagination.vue>): 分页组件
- [`ValaxyOverlay.vue`](<https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyOverlay.vue>): 灰色遮罩组件
- [`ValaxyHamburger.vue`](<https://github.com/YunYouJun/valaxy/blob/main/packages/valaxy/client/components/ValaxyHamburger.vue>): 汉堡按钮
```md
<ValaxyLogo />
```
<ValaxyLogo />
## 辅助组件 {lang="zh-CN"}
## Helper Components {lang="en"}
@ -43,11 +73,34 @@ You can use them directly when writing articles or themes.
::: zh-CN
> 面向用户,可直接使用
TODO
:::
::: en
> For users, can be used directly.
TODO
:::
内置组件暂无,目前通过 [valaxy-addon-components](https://github.com/YunYouJun/valaxy/tree/main/packages/valaxy-addon-components) 扩展公共组件。
```bash
pnpm add valaxy-addon-components
```
如:
- `CodePen`: CodePen 代码片段
- `VCLiveTime`: 站点建立时间
```md
My Blog Content
<CodePen class="h-300px" name="Margin Collapse" id="WqXGpo" user="YunYouJun" tab="html,result" />
```
My Blog Content
<CodePen class="h-300px" name="Margin Collapse" id="WqXGpo" user="YunYouJun" tab="html,result" />
## 自定义
更多用法请参见 [自定义组件](/guide/custom/components)。

View File

@ -134,8 +134,6 @@ When you use `pnpm create valaxy` to create a template project, it contains the
#### Others {lang="en"}
TODO
<BrandIcon icon="i-simple-icons-render" link="https://render.com/" />
::: zh-CN

View File

@ -13,12 +13,12 @@ top: 100
<div lang="zh-CN">
Valaxy V + Galaxy旨在成为下一代静态博客框架,提供更好的热更新与用户加载体验、更强大更便捷的自定义开发可能性。
<span text-purple-600 font="bold">Valaxy</span> <span bg="$va-c-bg-soft" font="bold" px-2 py-1 rounded text-sm>= V + <span op="30">G</span>alaxy</span> 旨在成为下一代静态博客框架,提供更好的热更新与用户加载体验、更强大更便捷的自定义开发可能性。
你可以在 [为什么选 Valaxy](/guide/why) 中了解更多关于项目的设计初衷。
::: tip
Valaxy 基于 [Vite](https://vitejs.dev/) 提供热更新与打包等功能,基于 [Vue](https://vuejs.org/) 实现视图(如主题、自定义组件)等客户端功能。
`Valaxy` 基于 [Vite](https://vitejs.dev/) 提供热更新与打包等功能,基于 [Vue](https://vuejs.org/) 实现视图(如主题、自定义组件)等客户端功能。
因此 Valaxy 兼容并可自由使用 Vite 与 Vue 生态的所有插件。
:::
@ -27,12 +27,12 @@ Valaxy 基于 [Vite](https://vitejs.dev/) 提供热更新与打包等功能,
<div lang="en">
Valaxy (V + Galaxy) aims for the next generation static blog framework, providing better hot reloading and user loading experience, with easier and powerful customization support.
<span text-purple-600 font="bold">Valaxy</span> <span bg="$va-c-bg-soft" font="bold" px-2 py-1 rounded text-sm>= V + <span op="30">G</span>alaxy</span> aims for the next generation static blog framework, providing better hot reloading and user loading experience, with easier and powerful customization support.
You can learn more about the original intensions for this project in [Why Valaxy](/guide/why).
::: tip
Valaxy is based on [Vite](https://vitejs.dev/) to provide hot reloading and packaging, and based on [Vue](https://vuejs.org/) to realize client functionalities such as views (themes, custom components).
`Valaxy` is based on [Vite](https://vitejs.dev/) to provide hot reloading and packaging, and based on [Vue](https://vuejs.org/) to realize client functionalities such as views (themes, custom components).
Therefore, Valaxy supports all extensions/plugins for Vite and Vue.
:::

View File

@ -389,6 +389,12 @@ details
## KaTeX
::: tip
More information about $\KaTeX$ examples can be found [here](/examples/katex).
:::
**Input**
```md

View File

@ -1,5 +1,6 @@
---
layout: home
title: Valaxy
titleTemplate: '%s - Next Generation Static Blog Framework'
@ -7,6 +8,9 @@ hero:
name: VALAXY
text: Next Generation Static Blog Framework
tagline: Simple, powerful, and performant. Meet the modern BLOG framework you've always wanted.
image:
src: /valaxy-logo.png
alt: Valaxy Logo
actions:
- theme: brand
text: hero.actions.get-started
@ -17,14 +21,42 @@ hero:
# todo, rewrite with valaxy
features:
- title: "Vite: The DX that can't be beat"
details: Feel the speed of Vite. Instant server start and lightning fast HMR that stays fast regardless of the app size.
- title: Designed to be simplicity first
details: With Markdown-centered content, it's built to help you focus on writing and deployed with minimum configuration.
- title: Power of Vue meets Markdown
details: Enhance your content with all the features of Vue in Markdown, while being able to customize your site with Vue.
- title: Fully static yet still dynamic
details: Go wild with true SSG + SPA architecture. Static on page load, but engage users with 100% interactivity from there.
- icon: i-logos:markdown
title: features.markdown.title
details: features.markdown.details
- icon: i-logos:vitejs
title: features.vite.title
details: features.vite.details
- icon: i-vscode-icons:file-type-vueconfig
title: features.vue.title
details: features.vue.details
- icon: i-logos:unocss
title: features.unocss.title
details: features.unocss.details
- icon: i-logos:vueuse
title: features.vueuse.title
details: features.vueuse.details
- icon: i-logos:github-actions
title: features.actions.title
details: features.actions.details
- icon: i-vscode-icons:file-type-locale
title: features.i18n.title
details: features.i18n.details
- icon: i-logos:typescript-icon
title: features.typescript.title
details: features.typescript.details
- icon: i-logos:visual-studio-code
title: features.vscode.title
details: features.vscode.details
- icon: i-vscode-icons:folder-type-theme
title: features.theme.title
details: features.theme.details
- icon: i-vscode-icons:folder-type-plugin
title: features.addon.title
details: features.addon.details
- icon: i-logos:electron
title: features.electron.title
details: features.electron.details
---
<div m="auto y-8" text="center" font="black">
@ -38,8 +70,4 @@ features:
</div>
<p align="center">
<a href="https://sponsors.yunyoujun.cn">
<img src="https://sponsors.yunyoujun.cn/sponsors.svg">
</a>
</p>
<ValaxySponsors />

View File

@ -11,7 +11,7 @@ themes:
repo: https://github.com/YunYouJun/valaxy/tree/main/packages/valaxy-theme-yun
desc: Default Theme for Valaxy
siteImage: https://s2.loli.net/2023/05/05/QoK4ZimqN3fgRdD.png
siteExampleURL: https://www.yunyoujun.cn
siteExampleUrl: https://www.yunyoujun.cn
tags:
- yun
- light
@ -20,9 +20,28 @@ themes:
repo: https://github.com/YunYouJun/valaxy/tree/main/packages/valaxy-theme-press
desc: Docs Theme for Valaxy
siteImage: https://s2.loli.net/2023/05/05/1DyEudpohIl47cP.png
siteExampleUrl: 'https://valaxy.site/'
tags:
- docs
- press
- name: valaxy-theme-starter
icon: i-ri-book-line
repo: https://github.com/valaxyjs/valaxy-theme-starter
desc: Starter Theme for Valaxy
siteImage: https://s2.loli.net/2023/10/06/viHCdNlQn2KZzEq.png
siteExampleUrl: 'https://starter.valaxy.site/'
tags:
- starter
- template
- name: valaxy-theme-gitlink
icon: i-ri-book-line
repo: https://github.com/YunYouJun/valaxy/tree/main/packages/valaxy-theme-press
desc: GitLink Theme for Valaxy
siteImage: https://s2.loli.net/2023/10/06/xJf8nHBQNFybpag.png
siteExampleUrl: 'https://gitlink.valaxy.site/'
tags:
- home
- gitlink
---
::: zh-CN
::: tip

View File

@ -2,6 +2,7 @@ import process from 'node:process'
import { defineValaxyConfig } from 'valaxy'
import type { PressTheme } from 'valaxy-theme-press'
import { addonAlgolia } from 'valaxy-addon-algolia'
import { addonComponents } from 'valaxy-addon-components'
const COMMIT_ID = process.env.CF_PAGES_COMMIT_SHA || process.env.COMMIT_REF
const commitRef = COMMIT_ID?.slice(0, 8) || 'dev'
@ -30,12 +31,13 @@ export default defineValaxyConfig<PressTheme.Config>({
apiKey: '9b9438ca112ab7c044c985c2daa1190b',
indexName: 'valaxysite',
}),
addonComponents(),
],
theme: 'press',
themeConfig: {
logo: '/favicon.svg',
sidebar: ['getting-started', 'guide', 'config', 'migration', 'built-ins', 'third', 'custom', 'theme', 'addon', 'dev'],
sidebar: ['getting-started', 'guide', 'config', 'migration', 'built-ins', 'third', 'custom', 'examples', 'theme', 'addon', 'dev'],
socialLinks: [
{ icon: 'i-ri-github-line', link: 'https://github.com/YunYouJun/valaxy' },
],
@ -91,6 +93,35 @@ export default defineValaxyConfig<PressTheme.Config>({
},
],
},
{
text: 'nav.ecosystem',
items: [
{
text: 'nav.vscode',
link: '/ecosystem/vscode',
},
{
text: 'nav.client',
link: '/ecosystem/client',
},
{
text: 'nav.news',
link: '/ecosystem/news',
},
{
text: 'nav.community',
link: '/ecosystem/community',
},
{
text: 'nav.dev',
link: '/dev',
},
{
text: 'nav.examples.site',
link: '/examples/site',
},
],
},
],
footer: {

View File

@ -48,6 +48,8 @@
},
"devDependencies": {
"@antfu/eslint-config": "^1.0.0-beta.19",
"@iconify-json/logos": "^1.1.37",
"@iconify-json/vscode-icons": "^1.1.28",
"@microsoft/api-extractor": "^7.38.0",
"@types/debug": "^4.1.9",
"@types/markdown-it-attrs": "^4.1.1",

View File

@ -5,5 +5,4 @@ You can override styles here.
- New file `index.scss` to write global css.
- New file `css-vars.scss` to set css vars.
<!-- todo: new docs -->
More info see <https://valaxy.site/guide/extend>.
More info see <https://valaxy.site/guide/custom/styles>.

View File

@ -1,21 +1,29 @@
<script setup lang="ts">
import { useI18n } from 'vue-i18n'
import type { Feature } from '../types'
defineProps<{
feature: Feature
}>()
const { t } = useI18n()
</script>
<template>
<article class="press-feature">
<div v-if="feature.icon" class="icon">
{{ feature.icon }}
<template v-if="feature.icon.startsWith('i-')">
<div :class="feature.icon" />
</template>
<template v-else>
{{ feature.icon }}
</template>
</div>
<h2 class="title">
{{ feature.title }}
{{ t(feature.title) }}
</h2>
<p class="details">
{{ feature.details }}
{{ t(feature.details) }}
</p>
</article>
</template>
@ -35,10 +43,11 @@ defineProps<{
align-items: center;
margin-bottom: 20px;
border-radius: 6px;
background-color: var(--va-c-gray-light-4);
background-color: var(--vp-c-default-soft);
width: 48px;
height: 48px;
font-size: 24px;
transition: background-color 0.25s;
}
.dark .icon {

View File

@ -4,5 +4,5 @@
* @param frontmatter
*/
export function getLocaleTitle(locale: string, frontmatter: any) {
return frontmatter[`title${locale === 'en' ? '' : `_${locale}`}`]
return frontmatter[`title${locale === 'en' ? '' : `_${locale}`}`] || frontmatter.title
}

View File

@ -31,8 +31,7 @@ export const defaultSiteConfig: SiteConfig = {
description: 'A blog generated by Valaxy.',
subtitle: 'Next Generation Static Blog Framework.',
author: {
// todo valaxy logo
avatar: 'https://www.yunyoujun.cn/images/avatar.jpg',
avatar: 'https://valaxy.site/valaxy-logo.png',
email: 'i@valaxy.site',
link: 'https://valaxy.site',
name: 'VALAXY Developer',

View File

@ -11,6 +11,12 @@ importers:
'@antfu/eslint-config':
specifier: ^1.0.0-beta.19
version: 1.0.0-beta.19(eslint@8.50.0)(typescript@5.2.2)(vitest@0.34.6)
'@iconify-json/logos':
specifier: ^1.1.37
version: 1.1.37
'@iconify-json/vscode-icons':
specifier: ^1.1.28
version: 1.1.28
'@microsoft/api-extractor':
specifier: ^7.38.0
version: 7.38.0(@types/node@20.8.2)
@ -153,6 +159,9 @@ importers:
valaxy-addon-algolia:
specifier: link:../packages/valaxy-addon-algolia
version: link:../packages/valaxy-addon-algolia
valaxy-addon-components:
specifier: workspace:*
version: link:../packages/valaxy-addon-components
valaxy-theme-press:
specifier: link:../packages/valaxy-theme-press
version: link:../packages/valaxy-theme-press
@ -2397,6 +2406,12 @@ packages:
'@iconify/types': 2.0.0
dev: false
/@iconify-json/logos@1.1.37:
resolution: {integrity: sha512-H2S8frTEznk6paX2kMzeUGn4KSiykghvO0b8UvEDd1fFFzt0WxCXpP1tBv67XaWK99e6JgA34hhv4lRGAm1hJg==}
dependencies:
'@iconify/types': 2.0.0
dev: true
/@iconify-json/ri@1.1.12:
resolution: {integrity: sha512-s5VsyMWYuUuTB5bATJRoDQKGqo6W0dsxvOBrJI/P2H9QI7IAaAWl8zHxseSjoUGG6AwZwWwDMW9YPULPt+vA6w==}
dependencies:
@ -2408,6 +2423,12 @@ packages:
dependencies:
'@iconify/types': 2.0.0
/@iconify-json/vscode-icons@1.1.28:
resolution: {integrity: sha512-B2slvmqiwzBI4vrkJAuHn3wSDHJ2XNjapUVaeuPr5qXM3FY/HoCKE/gFIbTNHFRi5oLNC8c1huRLo1yITn15GQ==}
dependencies:
'@iconify/types': 2.0.0
dev: true
/@iconify/types@2.0.0:
resolution: {integrity: sha512-+wluvCrRhXrhyOmRDJ3q8mux9JkKy5SJ/v8ol2tu4FVjyYvtEzkc/3pK15ET6RKg4b4w4BmTk1+gsCUhf21Ykg==}
@ -5363,7 +5384,7 @@ packages:
/eslint-import-resolver-node@0.3.9:
resolution: {integrity: sha512-WFj2isz22JahUv+B788TlO3N6zL3nNJGU8CcZbPZvVEkBPaJdCV4vy5wyghty5ROFbCRnm132v8BScu5/1BQ8g==}
dependencies:
debug: 3.2.7(supports-color@8.1.1)
debug: 3.2.7(supports-color@5.5.0)
is-core-module: 2.13.0
resolve: 1.22.4
transitivePeerDependencies:
@ -5392,7 +5413,7 @@ packages:
optional: true
dependencies:
'@typescript-eslint/parser': 6.7.4(eslint@8.50.0)(typescript@5.2.2)
debug: 3.2.7(supports-color@8.1.1)
debug: 3.2.7(supports-color@5.5.0)
eslint: 8.50.0
eslint-import-resolver-node: 0.3.9
transitivePeerDependencies:
@ -5446,7 +5467,7 @@ packages:
peerDependencies:
eslint: ^7.2.0 || ^8
dependencies:
debug: 3.2.7(supports-color@8.1.1)
debug: 3.2.7(supports-color@5.5.0)
doctrine: 2.1.0
eslint: 8.50.0
eslint-import-resolver-node: 0.3.9