mirror of
https://github.com/centau/vide.git
synced 2026-08-20 14:41:37 +00:00
Simplify Home Page
This commit is contained in:
parent
7da475524b
commit
1554325efb
4 changed files with 146 additions and 227 deletions
18
docs/.vitepress/theme/home.css
Normal file
18
docs/.vitepress/theme/home.css
Normal file
|
|
@ -0,0 +1,18 @@
|
|||
.home > * > .plugin-tabs--tab-list {
|
||||
background-color: var(--vp-c-bg-alt);
|
||||
}
|
||||
|
||||
.home > * > .VPNavBar:not(.top) {
|
||||
backdrop-filter: blur(0.5rem);
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.home > * > .VPNavBar > .divider {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.home > .VPContent {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
|
@ -3,6 +3,7 @@ import DefaultTheme from 'vitepress/theme'
|
|||
import layout from './layout.vue'
|
||||
import { enhanceAppWithTabs } from 'vitepress-plugin-tabs/client'
|
||||
import './vars.css'
|
||||
import './home.css'
|
||||
|
||||
export default {
|
||||
extends: DefaultTheme,
|
||||
|
|
|
|||
|
|
@ -1,155 +1,176 @@
|
|||
/* Homepage Stuff */
|
||||
/* Banner Stuff */
|
||||
|
||||
.banner {
|
||||
background-color: var(--vp-button-brand-bg);
|
||||
color: var(--vp-button-brand-text);
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
z-index: 50;
|
||||
background-color: var(--vp-button-brand-bg);
|
||||
color: var(--vp-button-brand-text);
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
position: fixed;
|
||||
bottom: 0px;
|
||||
z-index: 50;
|
||||
}
|
||||
|
||||
.advertising {
|
||||
margin: auto;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 768px) {
|
||||
.advertising {width: calc(100% - 8rem);}
|
||||
}
|
||||
.advertising {
|
||||
width: calc(100% - 8rem);
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 960px) {
|
||||
.banner {position: fixed; margin-top: var(--vp-nav-height); bottom: auto}
|
||||
#VPSidebarNav {margin-top: 1.5rem;}
|
||||
.VPLocalNav {top: calc(var(--vp-nav-height) + 1.5rem) !important;}
|
||||
}
|
||||
|
||||
.plugin-tabs--tab-list {
|
||||
background-color: var(--vp-c-bg-alt);
|
||||
}
|
||||
|
||||
.VPNavBar.home:not(.top) {
|
||||
backdrop-filter: blur(0.5rem);
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.VPNavBar.home > .divider {
|
||||
opacity: 0;
|
||||
.banner {
|
||||
position: fixed;
|
||||
margin-top: var(--vp-nav-height);
|
||||
bottom: auto;
|
||||
}
|
||||
#VPSidebarNav {
|
||||
margin-top: 1.5rem;
|
||||
}
|
||||
.VPLocalNav {
|
||||
top: calc(var(--vp-nav-height) + 1.5rem) !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* Colors */
|
||||
|
||||
:root {
|
||||
--vp-c-brand-1: #3086ff;
|
||||
--vp-c-brand-2: #75aeff;
|
||||
--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-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-plugin-tabs-tab-bg: var(--vp-c-bg);
|
||||
--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-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: #1d273c;
|
||||
--vp-c-gutter: #181d27;
|
||||
--vp-c-border: #111720;
|
||||
--vp-c-divider: #1d273c;
|
||||
--vp-c-gutter: #181d27;
|
||||
}
|
||||
|
||||
/* Fonts */
|
||||
|
||||
@font-face {
|
||||
font-family: 'JetBrains Mono';
|
||||
src: url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Bold-Italic.woff2') format('woff2'),
|
||||
url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Bold-Italic.woff') format('woff');
|
||||
font-weight: 700;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-family: "JetBrains Mono";
|
||||
src: url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Bold-Italic.woff2")
|
||||
format("woff2"),
|
||||
url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Bold-Italic.woff")
|
||||
format("woff");
|
||||
font-weight: 700;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'JetBrains Mono';
|
||||
src: url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Bold.woff2') format('woff2'),
|
||||
url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Bold.woff') format('woff');
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-family: "JetBrains Mono";
|
||||
src: url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Bold.woff2")
|
||||
format("woff2"),
|
||||
url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Bold.woff")
|
||||
format("woff");
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'JetBrains Mono';
|
||||
src: url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-ExtraBold-Italic.woff2') format('woff2'),
|
||||
url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-ExtraBold-Italic.woff') format('woff');
|
||||
font-weight: 800;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-family: "JetBrains Mono";
|
||||
src: url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-ExtraBold-Italic.woff2")
|
||||
format("woff2"),
|
||||
url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-ExtraBold-Italic.woff")
|
||||
format("woff");
|
||||
font-weight: 800;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'JetBrains Mono';
|
||||
src: url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-ExtraBold.woff2') format('woff2'),
|
||||
url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-ExtraBold.woff') format('woff');
|
||||
font-weight: 800;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-family: "JetBrains Mono";
|
||||
src: url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-ExtraBold.woff2")
|
||||
format("woff2"),
|
||||
url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-ExtraBold.woff")
|
||||
format("woff");
|
||||
font-weight: 800;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'JetBrains Mono';
|
||||
src: url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Italic.woff2') format('woff2'),
|
||||
url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Italic.woff') format('woff');
|
||||
font-weight: 400;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-family: "JetBrains Mono";
|
||||
src: url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Italic.woff2")
|
||||
format("woff2"),
|
||||
url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Italic.woff")
|
||||
format("woff");
|
||||
font-weight: 400;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'JetBrains Mono';
|
||||
src: url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Medium-Italic.woff2') format('woff2'),
|
||||
url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Medium-Italic.woff') format('woff');
|
||||
font-weight: 500;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
font-family: "JetBrains Mono";
|
||||
src: url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Medium-Italic.woff2")
|
||||
format("woff2"),
|
||||
url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Medium-Italic.woff")
|
||||
format("woff");
|
||||
font-weight: 500;
|
||||
font-style: italic;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'JetBrains Mono';
|
||||
src: url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Medium.woff2') format('woff2'),
|
||||
url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Medium.woff') format('woff');
|
||||
font-weight: 500;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-family: "JetBrains Mono";
|
||||
src: url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Medium.woff2")
|
||||
format("woff2"),
|
||||
url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Medium.woff")
|
||||
format("woff");
|
||||
font-weight: 500;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: 'JetBrains Mono';
|
||||
src: url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Regular.woff2') format('woff2'),
|
||||
url('https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Regular.woff') format('woff');
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
font-family: "JetBrains Mono";
|
||||
src: url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff2/JetBrainsMono-Regular.woff2")
|
||||
format("woff2"),
|
||||
url("https://cdn.jsdelivr.net/gh/JetBrains/JetBrainsMono/web/woff/JetBrainsMono-Regular.woff")
|
||||
format("woff");
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
|
||||
:root {
|
||||
--vp-font-family-mono: 'JetBrains Mono'
|
||||
--vp-font-family-mono: "JetBrains Mono";
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue