diff --git a/docs/.vitepress/config.ts b/docs/.vitepress/config.ts index f208a96b..acafa81c 100644 --- a/docs/.vitepress/config.ts +++ b/docs/.vitepress/config.ts @@ -4,7 +4,7 @@ import { defineConfig } from 'vitepress' export default defineConfig({ title: 'Vue Mess Detector', description: 'A static code analysis tool for detecting code smells and best practice violations in **Vue** and **Nuxt** projects.', - head: [['link', { rel: 'icon', href: '/favicon.ico' }]], + head: [['link', { rel: 'icon', href: '/favicon.ico' }], ['link', { rel: 'stylesheet', href: '/styles.css' }]], themeConfig: { // https://vitepress.dev/reference/default-theme-config search: { diff --git a/docs/index.md b/docs/index.md index 29c31ab9..a16f6e97 100644 --- a/docs/index.md +++ b/docs/index.md @@ -29,5 +29,7 @@ features: details: 20+ rules supported --- + + diff --git a/docs/styles.css b/docs/styles.css new file mode 100644 index 00000000..396bd1e6 --- /dev/null +++ b/docs/styles.css @@ -0,0 +1,70 @@ + #morphBlur { + display: inline-block; + background-color: #8a25b1; + height: 12em; + aspect-ratio: 1; + position: fixed; + top: 3em; + left: 10%; + z-index: -1; + animation: move 12s ease-in-out infinite alternate; + filter: blur(6em); + } + + @keyframes move { + 50% { + top: 12em; + left: 60%; + } + + 100% { + top: 20em; + left: 25%; + } + } + + #morphBlur::before, + #morphBlur::after { + content: ''; + display: block; + position: absolute; + height: 100%; + width: 100%; + background-color: inherit; + } + + #morphBlur::before { + top: -12em; + right: 9em; + animation: moveBefore 5s ease-in-out forwards infinite alternate; + } + + @keyframes moveBefore { + 35% { + top: 12em; + right: 12em; + } + + 100% { + top: 3em; + right: 3em; + } + } + + #morphBlur::after { + bottom: -4em; + left: 19em; + animation: moveAfter 8s ease-in-out forwards infinite alternate; + } + + @keyframes moveAfter { + 30% { + bottom: 12em; + left: 0em; + } + + 100% { + bottom: 0em; + left: 22em; + } + } \ No newline at end of file