:root { --vp-c-bg: #fefbff; --vp-c-bg-alt: #f2f0f4; --vp-c-bg-elv: #f2f0f4; --vp-c-bg-soft: #f2f0f4; } .dark { --vp-c-bg: #121316; --vp-c-bg-alt: #0d0e11; --vp-c-bg-elv: #1b1b1f; --vp-c-bg-soft: #1b1b1f; } :root { --vp-c-border: #c2c2c4; --vp-c-divider: #c4c6d0; --vp-c-gutter: #e2e2e3; } .dark { --vp-c-border: #77777a; --vp-c-divider: #222429; --vp-c-gutter: #000000; } :root { --vp-c-text-1: #1b1b1f; --vp-c-text-2: #2f3033; --vp-c-text-3: #46464a; } .dark { --vp-c-text-1: #e3e2e6; --vp-c-text-2: #ababaf; --vp-c-text-3: #919094; } :root { /* Colors: Brand */ --vp-c-brand-1: theme('colors.swarm.500'); --vp-c-brand-2: theme('colors.swarm.600'); --vp-c-brand-3: theme('colors.swarm.800'); --vp-c-brand-soft: theme('colors.swarm.400'); /* Colors: Button */ --vp-button-brand-bg: var(--vp-c-brand-1); --vp-button-brand-border: var(--vp-c-brand-soft); --vp-button-brand-text: rgba(42, 40, 47); --vp-button-brand-hover-border: var(--vp-c-brand-soft); --vp-button-brand-hover-text: rgba(42, 40, 47); --vp-button-brand-hover-bg: var(--vp-c-brand-soft); --vp-button-brand-active-border: var(--vp-c-brand-soft); --vp-button-brand-active-text: rgba(42, 40, 47); --vp-button-brand-active-bg: var(--vp-button-brand-bg); --vp-button-alt-bg: #484848; --vp-button-alt-text: #f0eeee; --vp-button-alt-hover-bg: #484848; --vp-button-alt-hover-text: #f0eeee; /* Colors: Custom Block */ /** Info */ --vp-custom-block-info-bg: theme('colors.swarm.100'); --vp-custom-block-info-border: theme('colors.swarm.800'); --vp-custom-block-info-text: theme('colors.swarm.800'); --vp-custom-block-info-text-deep: theme('colors.swarm.900'); /** Tip */ --vp-custom-block-tip-bg: theme('colors.meadow.100'); --vp-custom-block-tip-border: theme('colors.meadow.800'); --vp-custom-block-tip-text: theme('colors.meadow.800'); --vp-custom-block-tip-text-deep: theme('colors.meadow.900'); /** Warning */ --vp-custom-block-warning-bg: theme('colors.merlin.100'); --vp-custom-block-warning-border: theme('colors.merlin.800'); --vp-custom-block-warning-text: theme('colors.merlin.800'); --vp-custom-block-warning-text-deep: theme('colors.merlin.900'); /** Danger */ --vp-custom-block-danger-bg: theme('colors.carnation.100'); --vp-custom-block-danger-border: theme('colors.carnation.800'); --vp-custom-block-danger-text: theme('colors.carnation.800'); --vp-custom-block-danger-text-deep: theme('colors.carnation.900'); } .dark { /* Colors: Brand */ --vp-c-brand-1: theme('colors.swarm.400'); --vp-c-brand-2: theme('colors.swarm.500'); --vp-c-brand-3: theme('colors.swarm.700'); --vp-c-brand-soft: theme('colors.swarm.300'); /* Colors: Custom Block */ /** Info */ --vp-custom-block-info-bg: theme('colors.swarm.950'); --vp-custom-block-info-border: theme('colors.swarm.800'); --vp-custom-block-info-text: theme('colors.swarm.200'); --vp-custom-block-info-text-deep: theme('colors.swarm.200'); /** Tip */ --vp-custom-block-tip-bg: theme('colors.meadow.950'); --vp-custom-block-tip-border: theme('colors.meadow.800'); --vp-custom-block-tip-text: theme('colors.meadow.200'); --vp-custom-block-tip-text-deep: theme('colors.meadow.200'); /** Warning */ --vp-custom-block-warning-bg: theme('colors.merlin.950'); --vp-custom-block-warning-border: theme('colors.merlin.800'); --vp-custom-block-warning-text: theme('colors.merlin.200'); --vp-custom-block-warning-text-deep: theme('colors.merlin.200'); /** Danger */ --vp-custom-block-danger-bg: theme('colors.carnation.950'); --vp-custom-block-danger-border: theme('colors.carnation.800'); --vp-custom-block-danger-text: theme('colors.carnation.200'); --vp-custom-block-danger-text-deep: theme('colors.carnation.200'); } .vp-doc a { color: var(--vp-c-brand-1); text-decoration: underline; text-underline-offset: 4px; text-decoration-style: solid; text-decoration-color: transparent; -webkit-text-decoration-color: transparent; transition: text-decoration-color 0.25s; &:hover { color: var(--vp-c-brand-1); text-decoration-color: var(--vp-c-brand-1); -webkit-text-decoration-color: var(--vp-c-brand-1); } } .vp-doc .custom-block a { text-decoration: underline; text-underline-offset: 4px; text-decoration-style: solid; } ::selection { background-color: var(--vp-c-brand-400, #5586a6); .dark & { background-color: var(--vp-c-brand-800, #0f2c47); } } .VPFooter a { text-decoration-line: underline; text-decoration-style: dashed; text-underline-offset: 5px; transition: 0.3s; &:hover { color: var(--vp-c-text-1); text-decoration-line: underline; text-decoration-style: dashed; text-underline-offset: 5px; } } /* Custom scrollbar */ .VPSidebar::-webkit-scrollbar { block-size: 4px; border-end-end-radius: 14px; border-start-end-radius: 14px; inline-size: 4px; } /** * Component: Home */ :root { --vp-home-hero-name-color: transparent; --vp-home-hero-name-background: -webkit-linear-gradient( 120deg, #c4b5fd 30%, #7bc5e4 ); --vp-home-hero-image-background-image: linear-gradient( -45deg, #c4b5fd 50%, #47caff 50% ); --vp-home-hero-image-filter: blur(44px); } @media (min-width: 640px) { :root { --vp-home-hero-image-filter: blur(56px); } } @media (min-width: 960px) { :root { --vp-home-hero-image-filter: blur(68px); } } #VPContent strong > a { font-weight: bold; } .info.custom-block a { color: var(--vp-custom-block-info-text); font-weight: 500; text-decoration: underline; text-underline-offset: 2px; transition: opacity 0.25s; } .info.custom-block a:hover { opacity: 0.7; color: var(--vp-custom-block-info-text-deep); } .note.custom-block a { color: var(--vp-custom-block-info-text); font-weight: 500; text-decoration: underline; text-underline-offset: 2px; transition: opacity 0.25s; } .note.custom-block a:hover { opacity: 0.7; color: var(--vp-custom-block-note-text-deep); } .tip.custom-block a { color: var(--vp-custom-block-tip-text); font-weight: 500; text-decoration: underline; text-underline-offset: 2px; transition: opacity 0.25s; } .tip.custom-block a:hover { opacity: 0.7; color: var(--vp-custom-block-tip-text-deep); } .warning.custom-block a { color: var(--vp-custom-block-warning-text); font-weight: 500; text-decoration: underline; text-underline-offset: 2px; transition: opacity 0.25s; } .warning.custom-block a:hover { opacity: 0.7; color: var(--vp-custom-block-warning-text-deep); } .danger.custom-block a { color: var(--vp-custom-block-danger-text); font-weight: 500; text-decoration: underline; text-underline-offset: 2px; transition: opacity 0.25s; } .danger.custom-block a:hover { opacity: 0.7; color: var(--vp-custom-block-danger-text-deep); } .info.custom-block { --icon: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLWluZm8iPjxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjEwIi8+PHBhdGggZD0iTTEyIDE2di00Ii8+PHBhdGggZD0iTTEyIDhoLjAxIi8+PC9zdmc+'); } .note.custom-block { --icon: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLWluZm8iPjxjaXJjbGUgY3g9IjEyIiBjeT0iMTIiIHI9IjEwIi8+PHBhdGggZD0iTTEyIDE2di00Ii8+PHBhdGggZD0iTTEyIDhoLjAxIi8+PC9zdmc+'); } .tip.custom-block { --icon: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLWxpZ2h0YnVsYiI+PHBhdGggZD0iTTE1IDE0Yy4yLTEgLjctMS43IDEuNS0yLjUgMS0uOSAxLjUtMi4yIDEuNS0zLjVBNiA2IDAgMCAwIDYgOGMwIDEgLjIgMi4yIDEuNSAzLjUuNy43IDEuMyAxLjUgMS41IDIuNSIvPjxwYXRoIGQ9Ik05IDE4aDYiLz48cGF0aCBkPSJNMTAgMjJoNCIvPjwvc3ZnPg=='); } .warning.custom-block { --icon: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLWFsZXJ0LXRyaWFuZ2xlIj48cGF0aCBkPSJtMjEuNzMgMTgtOC0xNGEyIDIgMCAwIDAtMy40OCAwbC04IDE0QTIgMiAwIDAgMCA0IDIxaDE2YTIgMiAwIDAgMCAxLjczLTNaIi8+PHBhdGggZD0iTTEyIDl2NCIvPjxwYXRoIGQ9Ik0xMiAxN2guMDEiLz48L3N2Zz4='); } .danger.custom-block { --icon: url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJsdWNpZGUgbHVjaWRlLXNrdWxsIj48Y2lyY2xlIGN4PSI5IiBjeT0iMTIiIHI9IjEiLz48Y2lyY2xlIGN4PSIxNSIgY3k9IjEyIiByPSIxIi8+PHBhdGggZD0iTTggMjB2Mmg4di0yIi8+PHBhdGggZD0ibTEyLjUgMTctLjUtMS0uNSAxaDF6Ii8+PHBhdGggZD0iTTE2IDIwYTIgMiAwIDAgMCAxLjU2LTMuMjUgOCA4IDAgMSAwLTExLjEyIDBBMiAyIDAgMCAwIDggMjAiLz48L3N2Zz4='); } .custom-block-title { display: inline-flex; align-items: center; gap: 8px; } .custom-block-title::before { content: ''; width: 16px; height: 16px; -webkit-mask: var(--icon) no-repeat; mask: var(--icon) no-repeat; -webkit-mask-size: 100% 100%; mask-size: 100% 100%; background-color: currentColor; color: inherit; }