feat: add coming soon page

apps/docs/src/app/_components/aside/_aside.scss

@@ -23,6 +23,7 @@
   scrollbar-color: var(--O8) transparent;
   scrollbar-width: thin;
   transition: transform 0.2s;
+  border-inline-end: 1px solid var(--B4);
 
   &[data-mobile-open='true'] {
     transform: none;

apps/docs/src/app/_components/home/hero.tsx

@@ -141,7 +141,7 @@ export function Hero() {
             Get Started
           </Button>
 
-          <Button color="b" variant="outline" icon={<Dollar />}>
+          <Button as={Link} href="/coming-soon" color="b" variant="outline" icon={<Dollar />}>
             Donation
           </Button>
         </Flex>

apps/docs/src/app/coming-soon/page.tsx

@@ -0,0 +1,21 @@
+import React from 'react'
+import Link from 'next/link'
+import { Button, Flex, Heading, ProgressBar, Text } from '@pillar-ui/core'
+
+export default function ComingSoon() {
+  return (
+    <Flex style={{ maxWidth: '680px' }} justify="center" direction="col" items="center" gap="6" className="hero">
+      <Heading size="9" weight="7">
+        Coming Soon: Support Us!
+      </Heading>
+      <Text low size="6">
+        We&lsquo;re working hard to improve this site and bring you more features. You can support us by donating. Stay
+        tuned for the donation feature, and thank you for being a part of our journey!
+      </Text>
+      <ProgressBar label="Progress" value={90} />
+      <Button as={Link} href="/">
+        Return to Home
+      </Button>
+    </Flex>
+  )
+}