diff --git a/.vitepress/config.mts b/.vitepress/config.mts index 4a974cb..a3a0163 100644 --- a/.vitepress/config.mts +++ b/.vitepress/config.mts @@ -58,7 +58,12 @@ export default defineConfig({ themeConfig: { search: { - provider: 'local' + provider: 'local', + // options: { + // appId: 'DHC900L06Z', + // apiKey: '31c0bbd55f94c659a48a53a671bb8971', + // indexName: 'fabric' + // } }, logo: "/icon.png", diff --git a/.vitepress/theme/style.css b/.vitepress/theme/style.css index cfd4101..cf0d75e 100644 --- a/.vitepress/theme/style.css +++ b/.vitepress/theme/style.css @@ -70,6 +70,44 @@ --vp-c-danger-soft: var(--vp-c-red-soft); } +::-webkit-scrollbar { + width: 10px; +} + +::-webkit-scrollbar-track { + background-color: var(--vp-c-bg-alt); +} + +.VPNavBar:not(.top):not(.has-sidebar) { + border-bottom: none !important; + animation: nav-box-shadow 200ms ease-out forwards; +} + +.VPNavBar.top:not(.has-sidebar) { + animation: nav-box-shadow-fade-out 200ms ease-out forwards; +} + +@keyframes nav-box-shadow { + 100% { + box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 8px 0px; + } +} + +@keyframes nav-box-shadow-fade-out { + 0% { + box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 8px 0px; + } + 100% { + box-shadow: none; + } +} + +::-webkit-scrollbar-thumb { + background-color: var(--vp-c-bg-soft); + border-radius: 10px; + box-shadow: 0 0 6px rgba(0, 0, 0, 0.3); +} + /** * Component: Button * -------------------------------------------------------------------------- */ @@ -152,16 +190,20 @@ p > img { box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 8px 0px; } -button, .VPButton, .custom-block, div[class*="language-"], .VPTeamMembersItem, .pager-link, -.VPFeature { +.VPFeature, +.VPLocalSearchBox > .shell { box-shadow: rgba(0, 0, 0, 0.2) 0px 2px 8px 0px; } +.VPLocalSearchBox > .backdrop { + backdrop-filter: blur(5px); +} + .pager-link { background-color: var(--vp-c-bg-alt); } @@ -169,3 +211,22 @@ div[class*="language-"], .VPFooter { border-top: none !important; } + +.VPLocalSearchBox > .backdrop { + opacity: 0; + animation: show 200ms 100ms cubic-bezier(0.38, 0.97, 0.56, 0.76) forwards; +} + +.VPLocalSearchBox > .shell { + animation: show 400ms 100ms cubic-bezier(0.38, 0.97, 0.56, 0.76) forwards; + opacity: 0; + transform: rotateX(-90deg); + transform-origin: top center; +} + +@keyframes show { + 100% { + opacity: 1; + transform: none; + } +}