feat(theme-press): add press footer & commit ref

This commit is contained in:
YunYouJun 2022-10-04 17:36:55 +08:00
parent 5376bdd84f
commit 95381b583b
18 changed files with 201 additions and 105 deletions

View File

@ -1 +1,4 @@
# Demo
- [demo/yun](./yun/): valaxy-theme-yun demo
- [docs](../docs/): valaxy-theme-press demo

View File

@ -47,7 +47,13 @@ Valaxy 基于 [Vite](https://vitejs.dev/) 提供热更新与打包等功能,
<div lang="zh-CN">
::: danger
::: danger 兼容
由于 Vite 要求 [Node.js](https://nodejs.org/en/) 的版本为 14.18+, 16+Valaxy 同样需要你将 Node.js 升级至 14.18 版本之后。
:::
::: tip
如果您是 Windows 用户,我强烈建议您使用类 Unix 的 Shell如 [Git Bash](https://git-scm.com/downloads) 或 [WSL](https://docs.microsoft.com/en-us/windows/wsl/install)),而非 CMD / PowerShell.
@ -59,7 +65,13 @@ Valaxy 基于 [Vite](https://vitejs.dev/) 提供热更新与打包等功能,
<div lang="en">
::: danger
::: danger Compatibility Note
Vite requires [Node.js](https://nodejs.org/en/) version 14.18+, 16+. Valaxy also requires you to upgrade Node.js after version 14.18+.
:::
::: tip
If you are a Windows user, I strongly recommend using a Unix-like shell (such as [Git Bash](https://git-scm.com/downloads) or [WSL](https://docs.microsoft.com/en-us/windows/wsl/install) rather than CMD / PowerShell.

View File

@ -27,4 +27,19 @@ features:
details: Go wild with true SSG + SPA architecture. Static on page load, but engage users with 100% interactivity from there.
---
<div m="auto y-8" text="center 4xl" font="black">🧪 <br /><br />WORK IN PROGRESS</div>
<div m="auto y-8" text="center" font="black">
<h3 text="3xl">🧪</h3>
```bash
pnpm create valaxy
```
<span text="4xl">WORK IN PROGRESS</span>
</div>
<p align="center">
<a href="https://sponsors.yunyoujun.cn">
<img src="https://sponsors.yunyoujun.cn/sponsors.svg">
</a>
</p>

View File

@ -1,5 +1,7 @@
import { defineConfig } from 'valaxy'
const commitRef = process.env.COMMIT_REF?.slice(0, 8) || 'dev'
const safelist = [
'i-ri-home-line',
]
@ -38,6 +40,12 @@ export default defineConfig({
],
},
],
footer: {
message: `Released under the MIT License. (${commitRef})`,
copyright:
'Copyright © 2022-present <a href="https://github.com/YunYouJun" target="_blank">YunYouJun</a> & <a href="https://github.com/YunYouJun/valaxy/graphs/contributors" target="_blank">Valaxy Contributors</a>',
},
},
vite: {

View File

@ -13,5 +13,8 @@
"dependencies": {
"valaxy": "0.11.1",
"valaxy-theme-yun": "0.11.1"
},
"devDependencies": {
"typescript": "^4.8.4"
}
}

View File

@ -10,6 +10,7 @@ const safelist = [
* User Config
*/
export default defineConfig<ThemeConfig>({
url: 'https://valaxy.site/',
lang: 'zh-CN',
title: 'Valaxy Theme Yun',
author: {

View File

@ -1,7 +1,5 @@
<script lang="ts" setup>
import { computed } from 'vue'
import { useRouter } from 'vue-router'
import { EXTERNAL_URL_RE } from 'valaxy'
const props = defineProps<{
theme: 'brand' | 'alt'
@ -9,9 +7,6 @@ const props = defineProps<{
text: string
}>()
const isUrl = computed(() => EXTERNAL_URL_RE.test(props.link))
const router = useRouter()
const classes = computed(() => {
const arr = []
if (props.theme === 'brand')
@ -24,15 +19,13 @@ const classes = computed(() => {
</script>
<template>
<component
:is="isUrl ? 'a' : 'button'"
<AppLink
:to="link"
m="2"
:class="classes"
class="sese-btn btn" bg="gradient-to-r"
:href="isUrl ? link : undefined"
:target="isUrl ? '_blank' : undefined"
@click="!isUrl && router.push(link)"
class="sese-btn btn rounded-full hover:shadow-lg" bg="gradient-to-r"
p="x-6"
>
{{ text }}
</component>
</AppLink>
</template>

View File

@ -56,6 +56,6 @@ defineProps<{
line-height: 24px;
font-size: 14px;
font-weight: 500;
color: var(--va-c-text-light);
color: var(--va-c-text-lighter);
}
</style>

View File

@ -0,0 +1,53 @@
<script setup lang="ts">
import { useSidebar } from 'valaxy'
import { useThemeConfig } from '../composables'
const themeConfig = useThemeConfig()
const { hasSidebar } = useSidebar()
</script>
<template>
<footer v-if="themeConfig.footer" class="press-footer" :class="{ 'has-sidebar': hasSidebar }">
<div class="container">
<p v-if="themeConfig.footer.message" class="message" v-html="themeConfig.footer.message" />
<p v-if="themeConfig.footer.copyright" class="copyright" v-html="themeConfig.footer.copyright" />
</div>
</footer>
</template>
<style lang="scss" scoped>
.press-footer {
position: relative;
z-index: var(--pr-z-index-footer);
border-top: 1px solid var(--pr-c-divider-light);
padding: 32px 24px;
background-color: var(--va-c-bg);
&.has-sidebar {
display: none;
}
}
@media (min-width: 768px) {
.VPFooter {
padding: 32px;
}
}
.container {
margin: 0 auto;
max-width: var(--pr-layout-max-width);
text-align: center;
}
.message,
.copyright {
line-height: 24px;
font-size: 14px;
font-weight: 500;
color: var(--va-c-text-lighter);
}
.message { order: 2; }
.copyright { order: 1; }
</style>

View File

@ -1,5 +1,5 @@
<template>
<div class="press-home">
<div class="press-home" p="x-6">
<slot name="home-hero-before" />
<PressHomeHero />
<slot name="home-hero-after" />
@ -11,11 +11,5 @@
<slot>
<router-view />
</slot>
<p align="center">
<a href="https://sponsors.yunyoujun.cn">
<img src="https://sponsors.yunyoujun.cn/sponsors.svg">
</a>
</p>
</div>
</template>

View File

@ -51,6 +51,8 @@ const layout = useLayout()
</component>
</router-view>
</slot>
<PressFooter />
</div>
</template>

View File

@ -13,6 +13,7 @@
}
a {
display: inline-block;
text-decoration: none;
border-bottom: 1px solid transparent;
transition: all 0.4s;

View File

@ -1,9 +1,35 @@
export * from '../composables'
export * from './home.d'
export namespace DocsTheme {
export namespace PressTheme {
export type Config = ThemeConfig
export type Sidebar = any
export interface Footer {
message?: string;
copyright?: string;
}
export interface Config {
/**
* toc title
* @default 'On this page'
*/
outlineTitle: string
colors: {
/**
* primary color
* @default '#0078E7'
*/
primary: string
}
nav: Array<NavItem>
sidebar: string[]
footer: Footer
}
}
export interface NavItemLink {
@ -19,26 +45,10 @@ export interface NavItemGroup {
export type NavItem = NavItemLink | NavItemGroup
/**
* Theme Config
*/
export interface ThemeConfig {
/**
* toc title
* @default 'On this page'
*/
outlineTitle: string
colors: {
/**
* primary color
* @default '#0078E7'
*/
primary: string
}
nav: Array<NavItem>
sidebar: string[]
}
export type ThemeConfig = PressTheme.Config
export type ThemeUserConfig = Partial<ThemeConfig>

View File

@ -20,7 +20,7 @@
"@docsearch/css": "^3.2.1",
"@docsearch/js": "^3.2.1",
"@iconify-json/ant-design": "^1.1.3",
"@iconify-json/simple-icons": "^1.1.28",
"@iconify-json/simple-icons": "^1.1.29",
"valaxy-addon-waline": "workspace:*"
},
"devDependencies": {

View File

@ -85,7 +85,9 @@ html.dark {
align-items: center;
> .icon {
width: 16px;
display: inline-flex;
width: 1rem;
height: 1rem;
margin-right: 4px;
}
}

View File

@ -13,16 +13,17 @@
::-webkit-scrollbar-thumb {
border-radius: 2px;
background-color: rgba(122, 122, 122, 0.3);
// transition not work
&:window-inactive {
background-color: rgba(122, 122, 122, 0.3);
}
&:hover {
background-color: rgba(get-css-var("c", "primary", "rgb"), 0.7);
background-color: rgba(122, 122, 122, 0.7);
}
&:active {
background-color: rgba(get-css-var("c", "primary", "rgb"), 0.9);
background-color: rgba(122, 122, 122, 0.9);
}
}

View File

@ -65,7 +65,7 @@
"@intlify/vite-plugin-vue-i18n": "^6.0.3",
"@vitejs/plugin-vue": "^3.1.2",
"@vueuse/core": "^9.3.0",
"@vueuse/head": "^0.8.0",
"@vueuse/head": "^0.8.2",
"consola": "^2.15.3",
"critters": "^0.0.16",
"cross-spawn": "^7.0.3",
@ -100,7 +100,7 @@
"vite": "^3.1.4",
"vite-plugin-pages": "^0.26.0",
"vite-plugin-vue-layouts": "^0.7.0",
"vite-ssg": "0.19.2",
"vite-ssg": "0.21.0",
"vite-ssg-sitemap": "0.4.3",
"vue": "^3.2.40",
"vue-i18n": "^9.2.2",
@ -124,5 +124,13 @@
"debug": "^4.3.4",
"diacritics": "^1.3.0",
"https-localhost": "^4.7.1"
},
"pnpm": {
"peerDependencyRules": {
"ignoreMissing": [
"@types/markdown-it",
"@algolia/client-search"
]
}
}
}

View File

@ -109,7 +109,7 @@ importers:
'@types/yargs': ^17.0.13
'@vitejs/plugin-vue': ^3.1.2
'@vueuse/core': ^9.3.0
'@vueuse/head': ^0.8.0
'@vueuse/head': ^0.8.2
consola: ^2.15.3
critters: ^0.0.16
cross-spawn: ^7.0.3
@ -147,7 +147,7 @@ importers:
vite: ^3.1.4
vite-plugin-pages: ^0.26.0
vite-plugin-vue-layouts: ^0.7.0
vite-ssg: 0.19.2
vite-ssg: 0.21.0
vite-ssg-sitemap: 0.4.3
vue: ^3.2.40
vue-i18n: ^9.2.2
@ -161,7 +161,7 @@ importers:
'@intlify/vite-plugin-vue-i18n': 6.0.3_vite@3.1.4+vue-i18n@9.2.2
'@vitejs/plugin-vue': 3.1.2_vite@3.1.4+vue@3.2.40
'@vueuse/core': 9.3.0_vue@3.2.40
'@vueuse/head': 0.8.0_vue@3.2.40
'@vueuse/head': 0.8.2_vue@3.2.40
consola: 2.15.3
critters: 0.0.16
cross-spawn: 7.0.3
@ -196,7 +196,7 @@ importers:
vite: 3.1.4_sass@1.55.0
vite-plugin-pages: 0.26.0_vite@3.1.4
vite-plugin-vue-layouts: 0.7.0_rqa7paltdakk2bevhdd6jag4cm
vite-ssg: 0.19.2_anhuwci7wtosqobeegun7dnn2e
vite-ssg: 0.21.0_34uaayt2wjf27y6xkuuymepnda
vite-ssg-sitemap: 0.4.3
vue: 3.2.40
vue-i18n: 9.2.2_vue@3.2.40
@ -252,14 +252,14 @@ importers:
'@docsearch/css': ^3.2.1
'@docsearch/js': ^3.2.1
'@iconify-json/ant-design': ^1.1.3
'@iconify-json/simple-icons': ^1.1.28
'@iconify-json/simple-icons': ^1.1.29
valaxy: workspace:*
valaxy-addon-waline: workspace:*
dependencies:
'@docsearch/css': 3.2.1
'@docsearch/js': 3.2.1
'@iconify-json/ant-design': 1.1.3
'@iconify-json/simple-icons': 1.1.28
'@iconify-json/simple-icons': 1.1.29
valaxy-addon-waline: link:../valaxy-addon-waline
devDependencies:
valaxy: link:../valaxy
@ -693,8 +693,8 @@ packages:
'@iconify/types': 1.1.0
dev: false
/@iconify-json/simple-icons/1.1.28:
resolution: {integrity: sha512-8uMPiCEV/T17YIh/ADWJWwmJsoFljxYoa8Hu/hQKthtiOCtWnyKSqONcILzbaAmeAoldm1aom64WVknbnpxg3A==}
/@iconify-json/simple-icons/1.1.29:
resolution: {integrity: sha512-uP4fKlNoh9IuVTf1e1bl0TWZs+IDE19zCpKLNy+bKmJL5F9zOPwiIMqSsg4KRPXSdoZ2x7lTtt9BrO/O/3Phyg==}
dependencies:
'@iconify/types': 2.0.0
dev: false
@ -1628,13 +1628,13 @@ packages:
- vue
dev: false
/@vueuse/head/0.8.0_vue@3.2.40:
resolution: {integrity: sha512-e/1Zh3GAa1dkunHfxHkda/TBxxDgj2isQyND7wYazBhClyfrschXbNfPn1UbyrZRFFaXZjpt6RFukSgph3gG0A==}
/@vueuse/head/0.8.2_vue@3.2.40:
resolution: {integrity: sha512-xq62ddpq2jjeh5+pVZuyJ24FKwUwl2NOMJ9ChVDkEYicc4maxcMCoq7mXcFAri+Hb98wokJ00xMTztei2NF06Q==}
peerDependencies:
vue: '>=2.7 || >=3'
dependencies:
'@vueuse/shared': 9.3.0_vue@3.2.40
'@zhead/schema-vue': 0.7.4_vue@3.2.40
'@zhead/schema-vue': 0.8.2_vue@3.2.40
vue: 3.2.40
transitivePeerDependencies:
- '@vue/composition-api'
@ -1665,20 +1665,27 @@ packages:
- '@vue/composition-api'
dev: false
/@zhead/schema-vue/0.7.4_vue@3.2.40:
resolution: {integrity: sha512-Q7wPUly3ZWbPYQ5SEJBUuD6Mw3wiUfPMPquGfqsR2KF6sxQKRF8oaHnRLuu2uxpjuXjkzpBlZBPu1JgQX+Lf6Q==}
/@zhead/schema-raw/0.8.2:
resolution: {integrity: sha512-9X23yFbsuGKYYIzsBJVE3R0+6sT2iio1NPIwv7fSyINAyJ1T82gsmVSZ6IugoqdLBQBXsS0VpTaTNgqKk4yK/A==}
dependencies:
'@zhead/schema': 0.8.2
dev: false
/@zhead/schema-vue/0.8.2_vue@3.2.40:
resolution: {integrity: sha512-/MMcMs46iZVfQldWxaZZ7/2wT2EFAUMZqneoGkF2kfRP16F2q6qBuFDs3fdgkZH63UDUTTTfDUcOs56tXc8XFw==}
peerDependencies:
vue: '>=2.7 || >=3'
dependencies:
'@vueuse/shared': 9.3.0_vue@3.2.40
'@zhead/schema': 0.7.4
'@zhead/schema': 0.8.2
'@zhead/schema-raw': 0.8.2
vue: 3.2.40
transitivePeerDependencies:
- '@vue/composition-api'
dev: false
/@zhead/schema/0.7.4:
resolution: {integrity: sha512-18gfgmZL8gM64JdcT11d1rYLnCaY2mOtbDDSAXtCySanPGpkA1r+w01LCssEI/OfLdoZPS/kYCIW09d1PmUFfQ==}
/@zhead/schema/0.8.2:
resolution: {integrity: sha512-WDTmlI1tjQ/UlGKwL91kst/H5rCmVAOKRTXEkiSbvMzSWz1cGO24OljZ/2ai7DmWr/h/yF0jrmw/74zJe+yKqg==}
dev: false
/abab/2.0.6:
@ -1697,11 +1704,11 @@ packages:
negotiator: 0.6.3
dev: true
/acorn-globals/6.0.0:
resolution: {integrity: sha512-ZQl7LOWaF5ePqqcX4hLuv/bLXYQNfNWw2c0/yX/TsPRKamzHcTGQnlCjHT3TsmkOUVEPS3crCxiPfdzE/Trlhg==}
/acorn-globals/7.0.1:
resolution: {integrity: sha512-umOSDSDrfHbTNPuNpC2NSnnA3LUrqpevPb4T9jRx4MagXNS0rs+gwiTcAvqCRmsD6utzsrzNt+ebm00SNWiC3Q==}
dependencies:
acorn: 7.4.1
acorn-walk: 7.2.0
acorn: 8.8.0
acorn-walk: 8.2.0
dev: false
/acorn-jsx/5.3.2_acorn@7.4.1:
@ -1720,8 +1727,8 @@ packages:
acorn: 8.8.0
dev: true
/acorn-walk/7.2.0:
resolution: {integrity: sha512-OPdCF6GsMIP+Az+aWfAAOEt2/+iVDKE7oy6lJ098aoe59oAmK76qV6Gw60SbZ8jHuG2wH058GF4pLFbYamYrVA==}
/acorn-walk/8.2.0:
resolution: {integrity: sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA==}
engines: {node: '>=0.4.0'}
dev: false
@ -1942,10 +1949,6 @@ packages:
dependencies:
fill-range: 7.0.1
/browser-process-hrtime/1.0.0:
resolution: {integrity: sha512-9o5UecI3GhkpM6DrXr69PblIuWxPKk9Y0jHBRhdocZ2y7YECBFCsHm79Pr3OyR2AvjhDkabFJaDJMYRazHgsow==}
dev: false
/buffer-crc32/0.2.13:
resolution: {integrity: sha512-VO9Ht/+p3SN7SKWqcrgEzjGbRSJYTx+Q1pTQC0wrWqHx0vpJraQ6GtHx8tvcg1rlK1byhU5gccxgOgj7B0TDkQ==}
dev: false
@ -4464,9 +4467,9 @@ packages:
argparse: 2.0.1
dev: true
/jsdom/19.0.0:
resolution: {integrity: sha512-RYAyjCbxy/vri/CfnjUWJQQtZ3LKlLnDqj+9XLNnJPgEGeirZs3hllKR20re8LUZ6o1b1X4Jat+Qd26zmP41+A==}
engines: {node: '>=12'}
/jsdom/20.0.1:
resolution: {integrity: sha512-pksjj7Rqoa+wdpkKcLzQRHhJCEE42qQhl/xLMUKHgoSejaKOdaXEAnqs6uDNwMl/fciHTzKeR8Wm8cw7N+g98A==}
engines: {node: '>=14'}
peerDependencies:
canvas: ^2.5.0
peerDependenciesMeta:
@ -4475,7 +4478,7 @@ packages:
dependencies:
abab: 2.0.6
acorn: 8.8.0
acorn-globals: 6.0.0
acorn-globals: 7.0.1
cssom: 0.5.0
cssstyle: 2.3.0
data-urls: 3.0.2
@ -4488,16 +4491,15 @@ packages:
https-proxy-agent: 5.0.1
is-potential-custom-element-name: 1.0.1
nwsapi: 2.2.2
parse5: 6.0.1
saxes: 5.0.1
parse5: 7.1.1
saxes: 6.0.0
symbol-tree: 3.2.4
tough-cookie: 4.1.2
w3c-hr-time: 1.0.2
w3c-xmlserializer: 3.0.0
webidl-conversions: 7.0.0
whatwg-encoding: 2.0.0
whatwg-mimetype: 3.0.0
whatwg-url: 10.0.0
whatwg-url: 11.0.0
ws: 8.9.0
xml-name-validator: 4.0.0
transitivePeerDependencies:
@ -5732,9 +5734,9 @@ packages:
resolution: {integrity: sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==}
dev: false
/saxes/5.0.1:
resolution: {integrity: sha512-5LBh1Tls8c9xgGjw3QrMwETmTMVk0oFgvrFSvWx62llR2hcEInrKNZ2GZCCuuy2lvWrdl5jhbpeqc5hRYKFOcw==}
engines: {node: '>=10'}
/saxes/6.0.0:
resolution: {integrity: sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==}
engines: {node: '>=v12.22.7'}
dependencies:
xmlchars: 2.2.0
dev: false
@ -6619,26 +6621,28 @@ packages:
resolution: {integrity: sha512-9ZIRBRCgM1Q4RtXXEBHIu8gotbx9LCnHZOZXtdSzR0DnjN9H5IYGY3yGoxI6VX8dScXiluxOODFlNlr7ydyI9A==}
dev: false
/vite-ssg/0.19.2_anhuwci7wtosqobeegun7dnn2e:
resolution: {integrity: sha512-r9UJJ4OTMyu9f4nNe12PMVhVkeXYp1rUKbIl6zIOz5QDYEDgFcq8hZGUMMIAcyHhB4pH5ImmjZd1hJ2fO6hOmg==}
/vite-ssg/0.21.0_34uaayt2wjf27y6xkuuymepnda:
resolution: {integrity: sha512-hN8QIdZ8S8PlHFIWz5QMZD3Ile0wxTZJTzlZ1tt/IlediqX+ar9H5jSOMBAQxiWpVnfFX43peW3t3/1bwJiaRA==}
engines: {node: '>=14.0.0'}
hasBin: true
peerDependencies:
'@vueuse/head': ^0.5.0 || ^0.6.0 || ^0.7.0
critters: ^0.0.16
vite: ^2.0.0
vite: ^2.0.0 || ^3.0.0-0
vue: ^3.2.10
vue-router: ^4.0.1
peerDependenciesMeta:
critters:
optional: true
vue-router:
optional: true
dependencies:
'@vueuse/head': 0.8.0_vue@3.2.40
'@vueuse/head': 0.8.2_vue@3.2.40
critters: 0.0.16
fs-extra: 10.1.0
html-minifier: 4.0.0
html5parser: 2.0.2
jsdom: 19.0.0
jsdom: 20.0.1
kolorist: 1.6.0
prettier: 2.7.1
vite: 3.1.4_sass@1.55.0
@ -6832,12 +6836,6 @@ packages:
'@vue/shared': 3.2.40
dev: false
/w3c-hr-time/1.0.2:
resolution: {integrity: sha512-z8P5DvDNjKDoFIHK7q8r8lackT6l+jo/Ye3HOle7l9nICP9lf1Ci25fy9vHd0JOWewkIFzXIEig3TdKT7JQ5fQ==}
dependencies:
browser-process-hrtime: 1.0.0
dev: false
/w3c-xmlserializer/3.0.0:
resolution: {integrity: sha512-3WFqGEgSXIyGhOmAFtlicJNMjEps8b1MG31NCA0/vOF9+nKMUW1ckhi9cnNHmf88Rzw5V+dwIwsm2C7X8k9aQg==}
engines: {node: '>=12'}
@ -6890,14 +6888,6 @@ packages:
engines: {node: '>=12'}
dev: false
/whatwg-url/10.0.0:
resolution: {integrity: sha512-CLxxCmdUby142H5FZzn4D8ikO1cmypvXVQktsgosNy4a4BHrDHeciBBGZhb0bNoR5/MltoCatso+vFjjGx8t0w==}
engines: {node: '>=12'}
dependencies:
tr46: 3.0.0
webidl-conversions: 7.0.0
dev: false
/whatwg-url/11.0.0:
resolution: {integrity: sha512-RKT8HExMpoYx4igMiVMY83lN6UeITKJlBQ+vR/8ZJ8OCdSiN3RwCq+9gH0+Xzj0+5IrM6i4j/6LuvzbZIQgEcQ==}
engines: {node: '>=12'}