refactor: docs (#10126)

apps/website/tailwind.config.js

@@ -0,0 +1,100 @@
+import typographyPlugin from '@tailwindcss/typography';
+
+/** @type {import('tailwindcss').Config} */
+export default {
+	content: ['./src/**/*.{js,ts,jsx,tsx}'],
+	darkMode: 'class',
+	theme: {
+		extend: {
+			colors: {
+				blurple: {
+					50: '#e0e3ff',
+					100: '#cdd2ff',
+					200: '#9ea7ff',
+					300: '#7782fa',
+					DEFAULT: '#5865F2',
+					500: '#3d48c3',
+					600: '#293294',
+					700: '#1a2165',
+					800: '#0e1137',
+					900: '#020208',
+				},
+			},
+			fontFamily: {
+				sans: 'var(--font-geist-sans)',
+				mono: 'var(--font-geist-mono)',
+			},
+			typography: {
+				DEFAULT: {
+					css: {
+						pre: {
+							padding: '12px 0px',
+							'line-height': '1.5',
+							'border-radius': '6px',
+							'border-width': '1px',
+							'border-color': 'rgb(212, 212, 212)',
+						},
+						'.dark pre': {
+							'border-color': 'rgb(64, 64, 64)',
+						},
+						code: {
+							'font-size': '1em',
+							'font-weight': 'unset',
+						},
+						'code span:last-of-type:empty': {
+							display: 'none',
+						},
+						a: {
+							color: '#5865F2',
+							'text-decoration': 'none',
+						},
+						'a:hover': {
+							color: '#3d48c3',
+						},
+						'.dark a:hover': {
+							color: '#7782fa',
+						},
+						'a > img': {
+							display: 'inline-block',
+							margin: '0',
+						},
+						'a > img[height="44"]': {
+							height: '44px',
+						},
+						'div[align="center"] > p > a + a': {
+							'margin-left': '0.5em',
+						},
+						h1: {
+							display: 'flex',
+							'place-items': 'center',
+							'scroll-margin-top': '6.5rem',
+						},
+						h2: {
+							display: 'flex',
+							'place-items': 'center',
+							'margin-top': '1.25em',
+							'scroll-margin-top': '6.5rem',
+						},
+						h3: {
+							display: 'flex',
+							'place-items': 'center',
+							'margin-top': '1.25em',
+							'scroll-margin-top': '6.5rem',
+						},
+						h4: {
+							display: 'flex',
+							'place-items': 'center',
+							'margin-top': '1.25em',
+							'scroll-margin-top': '6.5rem',
+						},
+						// eslint-disable-next-line id-length
+						p: {
+							margin: '.5em 0',
+						},
+					},
+				},
+			},
+		},
+	},
+	plugins: [typographyPlugin],
+};