refactor: docs (#10126)

apps/website/src/styles/Button.tsx

@@ -1,17 +0,0 @@
-import { cva } from 'class-variance-authority';
-
-export const buttonVariants = cva(
-	'h-11 flex flex-row transform-gpu cursor-pointer select-none appearance-none place-items-center rounded px-6 text-base font-semibold leading-none text-white no-underline outline-none active:translate-y-px focus:ring focus:ring-width-2 focus:ring-white gap-2',
-	{
-		variants: {
-			variant: {
-				primary: 'bg-blurple text-white border-0',
-				secondary:
-					'bg-white text-gray-800 border-gray-400 border border-light-900 text-black transition duration-200 active:translate-y-px dark:border-dark-100 hover:border-black active:bg-light-300 dark:bg-dark-400 hover:bg-light-200 dark:text-white focus:ring focus:ring-width-2 focus:ring-blurple dark:active:bg-dark-200 dark:hover:bg-dark-300 dark:hover:border-white',
-			},
-		},
-		defaultVariants: {
-			variant: 'primary',
-		},
-	},
-);

apps/website/src/styles/cmdk.css

@@ -1,3 +0,0 @@
-[data-backdrop] {
-	background-color: rgb(0 0 0 / 15%);
-}

apps/website/src/styles/main.css

@@ -1,37 +1,76 @@
-@import '@unocss/reset/tailwind-compat.css';
-@unocss all;
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+* {
+	min-width: 0;
+}
 
 body {
-	font-family: var(--font-inter);
-	min-height: 100vh;
+	font-family: var(--font-geist-sans);
+	min-height: 100dvh;
 }
 
-[data-theme='dark'] {
-	display: none;
+html.dark .os-scrollbar-handle {
+	--os-handle-bg: rgba(255, 255, 255, 0.5);
 }
 
-.dark [data-theme='dark'] {
-	display: block;
+html.dark .os-scrollbar-handle:hover {
+	--os-handle-bg-hover: rgba(255, 255, 255, 0.7);
 }
 
-.dark [data-theme='light'] {
-	display: none;
+.os-scrollbar-handle {
+	--os-handle-bg: rgba(0, 0, 0, 0.5);
+}
+
+.os-scrollbar-handle:hover {
+	--os-handle-bg-hover: rgba(0, 0, 0, 0.7);
+}
+
+html.dark .shiki,
+html.dark .shiki span {
+	color: var(--shiki-dark) !important;
+	/* background-color: var(--shiki-dark-bg) !important; */
+	background-color: transparent !important;
+	font-style: var(--shiki-dark-font-style) !important;
+	font-weight: var(--shiki-dark-font-weight) !important;
+	text-decoration: var(--shiki-dark-text-decoration) !important;
 }
 
 pre {
-	font-size: 13px !important;
-	white-space: pre;
-	word-spacing: normal;
-	word-break: normal;
-	line-height: 1.5;
-	tab-size: 4;
-	hyphens: none;
-	padding: 1em;
-	margin: 0.5em 0;
-	overflow: auto;
-	border-radius: 4px;
+	background-color: transparent !important;
 }
 
 code {
-	font-family: var(--font-mono);
+	font-family: var(--font-geist-mono);
+}
+
+code > .line {
+	padding: 0 1rem;
+}
+
+[cmdk-overlay] {
+	position: fixed;
+	inset: 0;
+	height: 100dvh;
+	width: 100vw;
+	background-color: rgb(0 0 0 / 80%);
+}
+
+[cmdk-dialog] {
+	position: fixed;
+	left: 50%;
+	top: 20%;
+	z-index: 50;
+	transform: translate(-50%, 0);
+	width: 100%;
+	max-width: 640px;
+	padding: 1rem;
+}
+
+[cmdk-list-sizer] {
+	display: flex;
+	flex-direction: column;
+	gap: 0.5rem;
+	width: 100%;
 }