hakowork/vide
3
0
Fork 0
mirror of https://github.com/centau/vide.git synced 2026-08-20 14:41:37 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

improve home page

Browse source
This commit is contained in:
alice 2024-10-28 20:08:31 +01:00
parent 27a2cdcaeb
commit 08d10184fb
6 changed files with 110 additions and 25 deletions
Download patch file Download diff file Expand all files Collapse all files

8
docs/.vitepress/config.ts
View file

@ -1,6 +1,6 @@
//import { defineConfig } from "vitepress"
import { withMermaid } from "vitepress-plugin-mermaid";
import banner from "vite-plugin-banner"
import { tabsMarkdownPlugin } from 'vitepress-plugin-tabs'
// https://vitepress.dev/reference/site-config
export default withMermaid({
@ -9,6 +9,12 @@ export default withMermaid({
description: "A reactive UI library for Luau.",
base: "/vide/",
head: [["link", { rel: "icon", href: "/vide/logo.svg" }]],
markdown: {
config(md) {
md.use(tabsMarkdownPlugin)
}
},
themeConfig: {
logo: "/logo.svg",

4
docs/.vitepress/theme/index.js
View file

@ -1,9 +1,13 @@
// .vitepress/theme/index.js
import DefaultTheme from 'vitepress/theme'
import layout from './layout.vue'
import { enhanceAppWithTabs } from 'vitepress-plugin-tabs/client'
import './vars.css'
export default {
extends: DefaultTheme,
enhanceApp({ app }) {
enhanceAppWithTabs(app)
},
Layout: layout
}

59
docs/.vitepress/theme/vars.css
View file

@ -1,6 +1,6 @@
.banner {
background-color: var(--vp-button-brand-bg) !important;
color: rgba(255, 255, 255, 100%);
background-color: var(--vp-button-brand-bg);
color: var(--vp-button-brand-text);
width: 100%;
height: 1.5rem;
text-align: center;
@ -16,42 +16,65 @@
margin-top: 1.5rem;
}
.plugin-tabs--tab-list {
background-color: var(--vp-c-bg-alt);
}
.VPNavBar.home:not(.top) {
backdrop-filter: blur(0.5rem);
background-color: rgba(255, 255, 255, 0%) !important;
}
.VPNavBar.home > .divider {
opacity: 0;
}
#VPContent.is-home {
background-color: rgba(255, 255, 255, 0%);
background-image: radial-gradient(
var(--vp-c-brand-2), var(--vp-c-bg)
);
}
:root {
--vp-c-brand-1: #3086ff;
--vp-c-brand-1: #3086ff;
--vp-c-brand-2: #75aeff;
--vp-button-brand-bg: #3661A2;
--vp-button-brand-hover-bg: #24447F;
--vp-button-brand-press-bg: #4896F3;
--vp-button-brand-bg: #3661A2;
--vp-button-brand-hover-bg: #24447F;
--vp-button-brand-press-bg: #4896F3;
--vp-home-hero-name-color: transparent;
--vp-home-hero-name-background: -webkit-linear-gradient(120deg, #3661A2, #4896F3);
--vp-home-hero-logo-background: -webkit-linear-gradient(120deg, #3661A2, #4896F3);
--vp-home-hero-name-color: transparent;
--vp-home-hero-name-background: -webkit-linear-gradient(120deg, #3661A2, #4896F3);
--vp-home-hero-logo-background: -webkit-linear-gradient(120deg, #3661A2, #4896F3);
--vp-home-hero-image-background-image: linear-gradient(
--vp-home-hero-image-background-image: linear-gradient(
135deg,
#1D314F 50%,
#2A57A2 50%
);
--vp-home-hero-image-filter: blur(96px);
--vp-c-bg: #f2f5f8;
--vp-c-bg-alt: #dfe8f5;
--vp-c-bg-elv: #dde7f4;
--vp-c-bg-soft: #e8f1fe;
--vp-c-bg: #f2f5f8;
--vp-c-bg-alt: #dfe8f5;
--vp-c-bg-elv: #dde7f4;
--vp-c-bg-soft: #e8f1fe;
--vp-c-border: #c0c3c6;
--vp-c-divider: #dfe2e6;
--vp-c-gutter: #dfe2e6;
--vp-c-border: #c0c3c6;
--vp-c-divider: #dfe2e6;
--vp-c-gutter: #dfe2e6;
--vp-plugin-tabs-tab-bg: var(--vp-c-bg);
}
.dark {
--vp-c-brand-2: #234782;
--vp-c-bg: #0d131b;
--vp-c-bg-alt: #111720;
--vp-c-bg-elv: #182231;
--vp-c-bg-soft: #182231;
--vp-c-border: #111720;
--vp-c-divider: #181d27;
--vp-c-divider: #1d273c;
--vp-c-gutter: #181d27;
--vp-home-hero-image-background-image: linear-gradient(