undocs 0.4.3 → 0.4.5

package/app/app.config.ts

@@ -31,6 +31,7 @@ export default defineAppConfig({
         '.nuxtignore': 'vscode-icons:file-type-nuxt',
         'nuxt.config.ts': 'vscode-icons:file-type-nuxt',
         'nuxt.schema.ts': 'vscode-icons:file-type-nuxt',
+        'nitro.config.ts': 'i-undocs-nitro',
         'tailwind.config.js': 'vscode-icons:file-type-tailwind',
         'tailwind.config.ts': 'vscode-icons:file-type-tailwind',
         ts: 'vscode-icons:file-type-typescript',

package/app/assets/icons/crossws.svg

@@ -0,0 +1,4 @@
+<svg width="264" height="264" viewBox="0 0 264 264" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M246 198V66L132 0L94 22L208 88V176L189 154L170 198V110L56 44L18 66L132 132V220V264L246 198Z" fill="#8EC5FF"/>
+  <path d="M56 88L18 66V198L132 264V220L56 176V132L132 176V132L94 110L56 88Z" fill="#51A2FF"/>
+</svg>

package/app/assets/icons/elysia.svg

@@ -0,0 +1,11 @@
+<svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path fill-rule="evenodd" clip-rule="evenodd" d="M424.404 470.816C478.089 423.889 512 354.905 512 278C512 136.615 397.385 22 256 22C114.615 22 0 136.615 0 278C0 352.658 31.9583 419.851 82.9409 466.646L83.1767 465L419.144 355L424.404 470.816Z" fill="#333333"/>
+  <path d="M189.915 52.7412L144.5 46L151.303 43.9069C155.402 42.6455 159.248 40.6719 162.662 38.0765L163.73 37.2654C167.845 34.1375 171.12 30.0364 173.259 25.3304C174.414 22.7883 175.224 20.1027 175.665 17.3454L176.173 14.1698C176.72 10.7473 176.692 7.25741 176.09 3.84416C175.834 2.39429 177.279 1.23239 178.64 1.79296L180.498 2.55815C182.829 3.51798 185.084 4.65434 187.242 5.95732L194.965 10.6205C205.229 16.8174 214.226 24.9023 221.48 34.4477L226.616 41.2051C228.529 43.7228 230.783 45.9625 233.313 47.8599C236.088 49.9411 239.164 51.5874 242.435 52.7418L246 54L227.274 54.749C214.785 55.2486 202.278 54.5764 189.915 52.7412Z" fill="#CCCCCC"/>
+  <path d="M178.321 93.006L191.79 68.3844C191.922 68.143 191.93 67.8528 191.812 67.6042L187.22 57.9361C184.337 51.8673 178.219 48 171.5 48L170.23 47.9562C161.437 47.653 152.704 46.3829 144.188 44.169L142.504 43.731C135.521 41.9153 128.746 39.3732 122.293 36.1463L119.446 34.723C115.159 32.5797 111.099 30.012 107.325 27.0584L103.55 24.1043C102.428 23.2265 100.803 23.4506 99.9606 24.5992C97.3651 28.1384 95.7379 32.2935 95.2395 36.6541L94.5535 42.6571C94.1854 45.8774 94.1446 49.1267 94.4316 52.3552L96.1031 71.1595C97.3467 85.1501 102.175 98.584 110.123 110.165L111.825 112.645C114.267 116.203 117.113 119.466 120.306 122.369C120.756 122.778 121.329 123.03 121.936 123.084C145.029 125.156 167.194 113.348 178.321 93.006Z" fill="#CCCCCC"/>
+  <path d="M127.378 123.538L143.376 116.613C150.438 113.557 152.588 104.577 147.676 98.6533C143.683 93.8378 136.58 93.0803 131.661 96.9453L127.867 99.9256C126.958 100.64 126.127 101.448 125.387 102.336L116.263 113.284C114.982 114.822 115.084 117.084 116.5 118.5L119.318 121.721C119.77 122.237 120.296 122.685 120.878 123.049C122.833 124.271 125.263 124.453 127.378 123.538Z" fill="#EDEDED"/>
+  <path d="M147.988 44.8437L147.5 45L148.962 45.4651C155.294 47.4798 161.861 48.66 168.498 48.9761C168.83 48.9919 169.163 48.9534 169.483 48.8619L172.5 48L174 47.5L164.419 45.4172C163.158 45.1431 161.982 44.5687 160.991 43.7426C160.218 43.0981 160.223 41.9084 161.002 41.2708L162.423 40.1084C164.12 38.7197 165.493 36.976 166.444 35C160.934 39.3642 154.682 42.6988 147.988 44.8437Z" fill="#B2B2B2"/>
+  <path d="M202.776 219.428L72.2905 452.693C71.643 453.851 70.0687 454.069 69.1308 453.131L66.5 450.5L55.5 438L48.4888 428.927C41.8407 420.323 35.9052 411.192 30.7414 401.624L29.7434 399.775C24.2581 389.611 19.6635 378.991 16.0112 368.034L12.5 357.5C7.22519 338.379 6.01447 318.365 8.94583 298.747L9.06961 297.919C10.354 289.323 12.4034 280.86 15.1935 272.629L21 255.5L25.3334 246.385C32.0537 232.249 41.3193 219.472 52.6669 208.691L58.1719 203.462C69.5529 192.65 83.3937 184.769 98.5 180.5C94.967 181.498 91.3608 182.216 87.7149 182.647L80.5 183.5L75 184L69 185L63 185.561L59 186L56.1186 186.18C55.1927 186.238 54.7576 185.057 55.4998 184.5L55.5002 184.5L59.5273 182.57C72.5066 176.351 83.1766 166.172 90 153.5L94.4475 146.562C99.7511 138.288 106.807 131.28 115.116 126.032L116.833 124.948C119.935 122.989 123.246 121.384 126.705 120.163L142.446 114.607C145.348 113.583 147.69 111.39 148.903 108.561L149.143 108C149.705 106.687 149.932 105.255 149.803 103.833C149.608 101.689 148.616 99.6966 147.023 98.2485L144.256 95.7328C144.086 95.5779 143.93 95.4073 143.792 95.2232L126 71.5L111.803 51.9315C108.994 48.0592 107.359 43.4599 107.094 38.6832C107.051 37.9263 107.836 37.4015 108.52 37.7295L123.881 45.1028C137.174 51.4834 152.33 52.825 166.537 48.8786C169.84 47.9612 173.214 47.3242 176.624 46.9745L183.675 46.2513C201.406 44.4328 219.32 45.9054 236.516 50.5953L238 51L254.798 57.0472C275.869 64.6329 292.567 81.0571 300.5 102L304.022 115.734C305.004 119.567 306.392 123.285 308.162 126.824C312.321 135.142 318.495 142.289 326.121 147.613L335.084 153.87C339.023 156.62 343.157 159.078 347.453 161.227L367.289 171.145C368.178 171.589 368.444 172.732 367.843 173.523C362.372 180.721 355.148 186.395 346.859 190.005L335.371 195.008C330.797 197 326.081 198.65 321.262 199.945L312.822 202.212C300.992 205.39 288.796 207 276.546 207H256.333C252.148 207 248.001 206.213 244.108 204.679C228.581 198.562 210.923 204.863 202.776 219.428Z" fill="white"/>
+  <path d="M271.185 135.316L279.987 135.418C281.182 135.432 281.452 133.748 280.312 133.388C278.441 132.797 276.623 132.048 274.879 131.15L268.008 127.61C263.35 125.211 258.969 122.308 254.944 118.953L253.592 117.827C250.54 115.283 247.77 112.418 245.33 109.282L243.768 107.273C243.234 106.586 242.134 107.005 242.192 107.873C243.212 123.186 255.839 135.138 271.185 135.316Z" fill="#666666"/>
+  <path d="M82.2231 456.395L231.313 323.4C245.367 310.863 257.58 296.403 267.59 280.45L268.5 279C273.404 269.192 275.497 258.217 274.547 247.293L273.24 232.258C272.436 223.009 268.618 214.28 262.373 207.41C262.131 207.144 261.81 206.961 261.457 206.889L237.5 202C220.117 196.752 201.688 195.995 183.933 199.8L183 200L169.06 203.259C128.405 212.763 92.5742 236.685 68.2116 270.592L67.597 271.447C60.8846 280.789 55.1822 290.817 50.5856 301.362L49.765 303.245C38.1544 329.881 34.2409 359.238 38.4684 387.985L39.8511 397.387C41.2751 407.07 44.1931 416.474 48.5011 425.262C52.4798 433.379 57.6014 440.883 63.7095 447.547L71.3177 455.847C74.1911 458.981 79.0498 459.225 82.2231 456.395Z" fill="#CCCCCC"/>
+  <path d="M212.749 278.858L212.267 279.133C199.686 286.322 192.918 299.892 193.58 314.367C193.768 318.484 197.893 322.255 201.858 321.132L209.163 319.062C218.607 316.386 227.353 311.681 234.789 305.274L256 287L262.292 282.343C298.871 255.269 344.833 244.113 389.754 251.405C391.14 251.63 391.184 253.607 389.81 253.894L384.5 255L382.093 255.842C377.15 257.572 372.856 260.776 369.79 265.022C369.214 265.819 369.982 266.89 370.922 266.601L372.663 266.065C382.467 263.049 392.751 261.904 402.978 262.691L407 263C428.843 263.95 449.114 274.626 462.254 292.1L467.179 298.65C481.776 318.063 487.953 342.53 484.319 366.545L482.421 379.087C479.837 396.163 473.618 412.486 464.184 426.952L463.5 428L453 442L441.5 455L430.965 465.114C421.346 474.348 410.827 482.597 399.567 489.738L396 492L389.175 495.25C387.417 496.087 385.95 493.678 387.5 492.5L397 483.5L398.953 481.449C404.232 475.906 408.027 469.12 409.986 461.721L410.889 458.309C411.295 456.776 411.5 455.174 411.5 453.588C411.5 444.909 405.354 437.298 396.836 435.631C391.554 434.597 386.085 435.962 381.907 439.356L372.5 447L355.894 460.587C344.995 469.504 333.185 477.245 320.66 483.682L303.5 492.5L274.5 503.5L268.412 505.16C257.822 508.049 247.012 510.06 236.092 511.174L228 512H202L167.5 508.25L148.832 504.21C138.985 502.079 129.456 498.682 120.482 494.103C113.181 490.378 106.293 485.894 99.931 480.725L85.5 469C68.005 455.64 57.0449 435.448 55.3749 413.498L54.5 402L55.5295 385.822C57.134 360.608 66.7911 336.576 83.0792 317.263C89.6652 309.454 97.2376 302.534 105.606 296.675L108.677 294.526C121.458 285.579 135.72 278.961 150.805 274.976L160.947 272.297C174.135 268.813 187.952 268.445 201.307 271.22L211.887 273.418C214.542 273.97 215.103 277.513 212.749 278.858Z" fill="#5E5E5E"/>
+  </svg>

package/app/assets/icons/h3.svg

@@ -0,0 +1,5 @@
+<svg width="264" height="264" viewBox="0 0 264 264" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M132 0L18 66L56 88L132 44L170 66L94 110L132 132L246 66L132 0Z" fill="#FFD230"/>
+  <path d="M246 198V66L132 132V176L208 132V176L132 220V264L246 198Z" fill="#FFB900"/>
+  <path d="M56 88L18 66V198L56 220V176L94 198V242L132 264V132L94 110V154L56 132V88Z" fill="#FFD230"/>
+  </svg>

package/app/assets/icons/hono.svg

@@ -0,0 +1,10 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 76 98">
+  <path fill="url(#a)" d="m11 25 7 9s9-18 22-34c17 20 36 48 36 64 0 20-19 34-37 34C17 98 0 81 0 61c0-6 3-24 11-36Z"/>
+  <path fill="#F95" d="M39 21c47 51 14 66 0 66-11 0-51-11 0-66Z"/>
+  <defs>
+    <linearGradient id="a" x2="0%" y2="100%">
+      <stop stop-color="#F84"/>
+      <stop offset="100%" stop-color="#F30"/>
+    </linearGradient>
+  </defs>
+</svg>

package/app/assets/icons/nitro.svg

@@ -0,0 +1,42 @@
+<!-- nitro logo -->
+<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <g clip-path="url(#clip0_115_108)">
+    <path fill-rule="evenodd" clip-rule="evenodd"
+      d="M35.2166 7.02016C28.0478 -1.38317 15.4241 -2.38397 7.02077 4.78481C-1.38256 11.9536 -2.38336 24.5773 4.78542 32.9806C11.9542 41.3839 24.5779 42.3847 32.9812 35.216C41.3846 28.0472 42.3854 15.4235 35.2166 7.02016ZM25.2525 17.5175C26.0233 17.5175 26.5155 18.3527 26.1287 19.0194L26.0175 19.2111L18.4696 31.6294C18.3293 31.8602 18.0788 32.001 17.8088 32.001H17.0883C16.5946 32.001 16.2336 31.5349 16.3573 31.0569L18.4054 23.1384C18.5691 22.5053 18.0912 21.888 17.4373 21.888H14.2914C13.6375 21.888 13.1596 21.2708 13.3232 20.6377L16.4137 8.68289C16.5261 8.28056 16.8904 7.99734 17.3081 8.00208C17.3587 8.00266 17.4046 8.0035 17.4427 8.0047L20.6109 8.00465C21.217 8.00436 21.684 8.53896 21.6023 9.13949L21.5828 9.28246L20.3746 16.349C20.2702 16.9598 20.7406 17.5175 21.3603 17.5175H25.2525Z"
+      fill="url(#paint0_diamond_115_108)" />
+    <mask id="mask0_115_108" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0"
+      width="40" height="41">
+      <circle cx="20" cy="20.001" r="20" fill="url(#paint1_diamond_115_108)" />
+    </mask>
+    <g mask="url(#mask0_115_108)">
+      <g filter="url(#filter0_f_115_108)">
+        <path
+          d="M1.11145 13.4267C0.0703174 16.4179 -0.245523 19.6136 0.189923 22.7507C0.62537 25.8879 1.79965 28.8768 3.61611 31.4713C5.43256 34.0659 7.83925 36.192 10.6381 37.6746C13.4369 39.1572 16.5478 39.9538 19.7147 39.999C22.8816 40.0442 26.0139 39.3366 28.8539 37.9345C31.6939 36.5324 34.1602 34.4758 36.05 31.9341C37.9397 29.3924 39.1988 26.4383 39.7236 23.3148C40.2483 20.1914 40.0238 16.9879 39.0684 13.9682L33.2532 15.808C33.9172 17.9068 34.0732 20.1333 33.7085 22.3042C33.3438 24.4751 32.4687 26.5283 31.1552 28.2949C29.8418 30.0615 28.1276 31.4908 26.1537 32.4653C24.1799 33.4399 22.0028 33.9316 19.8017 33.9002C17.6006 33.8688 15.4384 33.3151 13.4932 32.2847C11.5479 31.2543 9.87518 29.7766 8.61269 27.9733C7.35019 26.1699 6.53403 24.0926 6.23138 21.9122C5.92873 19.7317 6.14825 17.5106 6.87187 15.4316L1.11145 13.4267Z"
+          fill="white" />
+      </g>
+    </g>
+  </g>
+  <defs>
+    <filter id="filter0_f_115_108" x="-10" y="3.42667" width="60" height="46.5744"
+      filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
+      <feFlood flood-opacity="0" result="BackgroundImageFix" />
+      <feBlend mode="normal" in="SourceGraphic" in2="BackgroundImageFix" result="shape" />
+      <feGaussianBlur stdDeviation="5" result="effect1_foregroundBlur_115_108" />
+    </filter>
+    <radialGradient id="paint0_diamond_115_108" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse"
+      gradientTransform="translate(4.00069 20.0004) scale(39.0007 397.71)">
+      <stop stop-color="#31B2F3" />
+      <stop offset="0.473958" stop-color="#F27CEC" />
+      <stop offset="1" stop-color="#FD6641" />
+    </radialGradient>
+    <radialGradient id="paint1_diamond_115_108" cx="0" cy="0" r="1" gradientUnits="userSpaceOnUse"
+      gradientTransform="translate(4 20.0011) scale(39 397.703)">
+      <stop stop-color="#F27CEC" />
+      <stop offset="0.484375" stop-color="#31B2F3" />
+      <stop offset="1" stop-color="#7D7573" />
+    </radialGradient>
+    <clipPath id="clip0_115_108">
+      <rect width="146" height="40.001" fill="white" />
+    </clipPath>
+  </defs>
+</svg>

package/app/assets/icons/rou3.svg

@@ -0,0 +1,5 @@
+<svg width="264" height="264" viewBox="0 0 264 264" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M246 198V66L132 132V176L208 133V176L132 220V264L246 198Z" fill="#BBF451"/>
+  <path d="M208 88L246 66L132 0V44L170 66L208 88Z" fill="#9AE600"/>
+  <path d="M56 88L18 66V198L56 220V176V154V132L94 154L132 176V132L56 88Z" fill="#9AE600"/>
+</svg>

package/app/assets/icons/srvx.svg

@@ -0,0 +1,6 @@
+<svg width="264" height="264" viewBox="0 0 264 264" fill="none" xmlns="http://www.w3.org/2000/svg">
+  <path d="M18 198V154L132 220V264L18 198Z" fill="#FF8904"/>
+  <path d="M18 110V66L132 132V176L18 110Z" fill="#FF8904"/>
+  <path d="M246 66L132 132V176L208 132V176L132 220V264L246 198V66Z" fill="#FFB86A"/>
+  <path d="M132 0L18 66L56 88L132 44L170 66L208 44L132 0Z" fill="#FFB86A"/>
+</svg>

package/app/assets/main.css

@@ -1,6 +1,8 @@
 @import 'tailwindcss';
 @import '@nuxt/ui';
 
+@source '../**/*.vue';
+
 @theme static {
   --font-sans: 'Inter', sans-serif;
 }

package/app/components/AppHeader.vue

@@ -55,7 +55,11 @@ const mobileLinks = computed(() => {
         <UContentSearchButton />
       </UTooltip>
       <UColorModeButton />
-      <SocialButtons />
+      <SocialButtons github-only />
+    </template>
+
+    <template #toggle="{ open, toggle }">
+      <IconMenuToggle :open="open" class="lg:hidden" @click="toggle" />
     </template>
 
     <template #body>

package/app/components/IconMenuToggle.vue

@@ -0,0 +1,78 @@
+<script setup lang="ts">
+// Source: https://github.com/nuxt-content/docus/blob/main/layer/app/components/IconMenuToggle.vue
+import { motion } from 'motion-v'
+import type { VariantType } from 'motion-v'
+
+const props = defineProps<{
+  open: boolean
+}>()
+
+const variants: { [k: string]: VariantType | ((custom: unknown) => VariantType) } = {
+  normal: {
+    rotate: 0,
+    y: 0,
+    opacity: 1,
+  },
+  close: (custom: unknown) => {
+    const c = custom as number
+    return {
+      rotate: c === 1 ? 45 : c === 3 ? -45 : 0,
+      y: c === 1 ? 6 : c === 3 ? -6 : 0,
+      opacity: c === 2 ? 0 : 1,
+      transition: {
+        type: 'spring',
+        stiffness: 260,
+        damping: 20,
+      },
+    }
+  },
+}
+
+const state = computed(() => (props.open ? 'close' : 'normal'))
+</script>
+
+<template>
+  <UButton size="sm" variant="ghost" color="neutral" class="-me-1.5" square>
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      class="size-5"
+      viewBox="0 0 24 24"
+      fill="none"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    >
+      <motion.line
+        x1="4"
+        y1="6"
+        x2="20"
+        y2="6"
+        :variants="variants"
+        :animate="state"
+        :custom="1"
+        class="outline-none"
+      />
+      <motion.line
+        x1="4"
+        y1="12"
+        x2="20"
+        y2="12"
+        :variants="variants"
+        :animate="state"
+        :custom="2"
+        class="outline-none"
+      />
+      <motion.line
+        x1="4"
+        y1="18"
+        x2="20"
+        y2="18"
+        :variants="variants"
+        :animate="state"
+        :custom="3"
+        class="outline-none"
+      />
+    </svg>
+  </UButton>
+</template>

package/app/components/SocialButtons.vue

@@ -1,9 +1,20 @@
 <script setup lang="ts">
 const appConfig = useAppConfig()
 
+const props = defineProps({
+  githubOnly: {
+    type: Boolean,
+    default: false,
+  },
+})
+
 const socialLinks = computed(() => {
   return (
-    Object.entries({ github: appConfig.docs.github, ...appConfig.docs.socials })
+    Object.entries(
+      props.githubOnly
+        ? { github: appConfig.docs.github }
+        : { github: appConfig.docs.github, ...appConfig.docs.socials },
+    )
       .reverse() // x<>github
       // .filter(([key]) => props.socials?.includes(key) || !props.socials)
       .map(([key, value]) => {

package/app/pages/index.vue

@@ -104,34 +104,28 @@ const { data: contributors } = await useAsyncData(() => useContributors())
 <template>
   <div>
     <!-- Hero -->
-    <UPageHero
-      v-if="hero"
-      :orientation="hero.orientation"
-      class="relative"
-      :ui="{
-        container: '!pb-20 py-24 sm:py-32 lg:py-40',
-        title: 'text-5xl sm:text-7xl',
-        wrapper: 'lg:min-h-[540px]',
-      }"
-    >
+    <UPageHero v-if="hero" :orientation="hero.orientation" class="relative" :links="hero.links">
       <template #top>
         <LandingBackground />
       </template>
 
       <template #headline>
-        <NuxtLink v-if="latest" :to="latest.path">
-          <UBadge
-            variant="subtle"
-            size="lg"
-            class="px-3 relative rounded-full font-semibold dark:hover:bg-primary-400/15 dark:hover:ring-primary-700"
-          >
-            {{ latest.title }}
-          </UBadge>
-        </NuxtLink>
+        <UButton
+          v-if="latest"
+          :to="latest.path"
+          variant="subtle"
+          size="sm"
+          trailing-icon="i-lucide-arrow-right"
+          class="rounded-full"
+        >
+          {{ latest.title }}
+        </UButton>
       </template>
 
       <template #title>
-        {{ landing.heroTitle }}<br /><span class="text-primary text-4xl">{{ landing.heroSubtitle }}</span>
+        {{ landing.heroTitle }}<br /><span v-if="landing.heroSubtitle" class="text-primary text-4xl">{{
+          landing.heroSubtitle
+        }}</span>
       </template>
 
       <template #description>
@@ -139,11 +133,7 @@ const { data: contributors } = await useAsyncData(() => useContributors())
       </template>
 
       <template #links>
-        <div class="flex flex-col gap-4">
-          <div class="flex items-center flex-wrap gap-2" :class="{ 'justify-center': !hero.code }">
-            <UButton v-for="link in hero.links" :key="link.label" v-bind="link" class="!px-6 !py-3"> </UButton>
-          </div>
-        </div>
+        <UButton v-for="link in hero.links" :key="link.label" v-bind="link" />
       </template>
 
       <ProseCodeGroup v-if="hero.code" class="mx-auto" style="max-width: 100%">
@@ -162,13 +152,9 @@ const { data: contributors } = await useAsyncData(() => useContributors())
 
     <UPageSection
       v-if="landing.features?.length > 0"
-      :title="landing?.featuresTitle"
-      :description="''"
       :ui="{
-        title: 'text-left',
-        description: 'text-left',
-        root: '',
-        features: 'xl:grid-cols-4 lg:gap-10',
+        container: 'pt-4 sm:pt-8 lg:pt-12',
+        body: 'mt-0',
       }"
     >
       <template #features>
@@ -191,18 +177,18 @@ const { data: contributors } = await useAsyncData(() => useContributors())
       </template>
     </UPageSection>
 
-    <UPageSection v-if="sponsors?.sponsors.length" title="Sponsors">
+    <UPageSection v-if="sponsors?.sponsors.length" title="Sponsors" class="bg-muted/30 border-y border-default">
       <div id="sponsors" class="flex flex-col items-center gap-8">
         <div
           v-for="(tier, i) of sponsors.sponsors.slice(0, 2)"
           :key="i"
-          class="flex flex-wrap justify-center gap-4 max-w-4xl mb-4"
+          class="flex flex-wrap justify-center gap-8 max-w-4xl"
         >
-          <div v-for="s in tier" :key="s.name" class="flex items-center gap-2 max-w-[300px]">
+          <div v-for="s in tier" :key="s.name" class="flex items-center gap-6 max-w-[300px]">
             <a
               :href="s.website"
               target="_blank"
-              class="flex items-center gap-2"
+              class="flex items-center gap-2 opacity-80 hover:opacity-100"
               :class="`font-size-${i === 0 ? '3xl' : i === 1 ? 'xl' : 'lg'}`"
             >
               <img
@@ -215,24 +201,29 @@ const { data: contributors } = await useAsyncData(() => useContributors())
                   height: i === 0 ? '80px' : '48px',
                 }"
               />
-              <span v-if="i < 2" class="text-lg font-semibold">{{ s.name }}</span>
+              <span v-if="i < 2" class="font-semibold" :class="`text-${i === 0 ? '2xl' : 'xl'}`">{{ s.name }}</span>
             </a>
           </div>
         </div>
-        <div class="flex flex-wrap justify-center gap-4">
-          <UTooltip v-for="s in sponsors.sponsors[2]" :key="s.name" :text="s.name" placement="top">
-            <UAvatar :alt="s.name" :src="s.image" size="2xl" :to="s.website" target="_blank" />
+        <div class="flex flex-wrap justify-center gap-2">
+          <UTooltip v-for="s in sponsors.sponsors[2]" :key="s.name" :text="s.name" :delay-duration="0">
+            <a :href="s.website" target="_blank" class="opacity-80 hover:opacity-100">
+              <UAvatar :alt="s.name" :src="s.image" size="2xl" />
+            </a>
           </UTooltip>
         </div>
-        <div class="flex flex-wrap justify-center gap-4">
-          <UTooltip v-for="s in sponsors.sponsors[3]" :key="s.name" :text="s.name">
-            <UAvatar :alt="s.name" :src="s.image" :to="s.website" target="_blank" />
+        <div class="flex flex-wrap justify-center gap-1">
+          <UTooltip v-for="s in sponsors.sponsors[3]" :key="s.name" :text="s.name" :delay-duration="0">
+            <a :href="s.website" target="_blank" class="opacity-80 hover:opacity-100">
+              <UAvatar :alt="s.name" :src="s.image" />
+            </a>
           </UTooltip>
         </div>
       </div>
       <div class="text-center">
         <UButton
           v-if="sponsors.username"
+          icon="i-lucide-heart-handshake"
           :to="`https://github.com/sponsors/${sponsors.username}`"
           target="_blank"
           color="neutral"
@@ -243,15 +234,21 @@ const { data: contributors } = await useAsyncData(() => useContributors())
     </UPageSection>
 
     <UPageSection v-if="contributors?.length" id="contributors" title="Contributors">
-      <UAvatarGroup class="flex flex-wrap justify-center gap-4">
-        <UTooltip v-for="c in contributors" :key="c.username" :text="c.name">
-          <a :href="c.profile" target="_blank">
+      <div class="flex flex-wrap justify-center gap-2">
+        <UTooltip v-for="c in contributors" :key="c.username" :text="c.name" :delay-duration="0">
+          <a :href="c.profile" target="_blank" class="opacity-80 hover:opacity-100">
             <UAvatar :alt="c.name" :src="c.avatar" size="3xl" />
           </a>
         </UTooltip>
-      </UAvatarGroup>
+      </div>
       <div class="text-center">
-        <UButton v-if="landing._github" :to="`https://github.com/${landing._github}`" target="_blank" color="neutral">
+        <UButton
+          v-if="landing._github"
+          :to="`https://github.com/${landing._github}`"
+          target="_blank"
+          color="neutral"
+          icon="i-lucide-git-pull-request"
+        >
           Contribute on GitHub
         </UButton>
       </div>

package/cli/setup.mjs

@@ -1,5 +1,6 @@
 import { fileURLToPath } from 'node:url'
 import { resolve } from 'node:path'
+import { existsSync } from 'node:fs'
 import { execSync } from 'node:child_process'
 import { loadConfig, watchConfig } from 'c12'
 
@@ -123,6 +124,22 @@ export async function setupDocs(docsDir, opts = {}) {
     routeRules: {
       ...Object.fromEntries(Object.entries(docsconfig.redirects || {}).map(([from, to]) => [from, { redirect: to }])),
     },
+    icon: {
+      customCollections: [
+        {
+          prefix: 'undocs',
+          dir: resolve(appDir, 'assets/icons'),
+        },
+        ...(existsSync(resolve(docsDir, '.docs/icons'))
+          ? [
+              {
+                prefix: 'custom',
+                dir: resolve(docsDir, '.docs/icons'),
+              },
+            ]
+          : []),
+      ],
+    },
   }
 
   return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "undocs",
-  "version": "0.4.3",
+  "version": "0.4.5",
   "repository": "unjs/undocs",
   "license": "MIT",
   "type": "module",
@@ -46,6 +46,7 @@
     "is-buffer": "^2.0.5",
     "md4w": "^0.2.7",
     "mermaid": "^11.12.0",
+    "motion-v": "^1.7.1",
     "nitropack": "^2.12.6",
     "nuxi": "^3.28.0",
     "nuxt": "^4.1.2",