Simplify Home Page

This commit is contained in:
alice 2024-10-29 11:45:52 +01:00
parent 7da475524b
commit 1554325efb
4 changed files with 146 additions and 227 deletions

View 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;
}

View file

@ -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,

View file

@ -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";
}