add docs link

Author: mayank1513

packages/shared-ui/src/cards/cards.module.css

@@ -1,6 +1,8 @@
 .cards {
 	display: flex;
 	justify-content: space-evenly;
+	flex-wrap: wrap;
+	gap: 25px;
 	width: var(--max-width);
 }
 

packages/shared-ui/src/cards/docs-card.tsx

@@ -0,0 +1,16 @@
+import styles from "./cards.module.css";
+
+export function DocsCard() {
+	return (
+		<a
+			className={styles.card}
+			href="https://react18-tools.github.io/react18-themes/"
+			rel="noopener noreferrer"
+			target="_blank">
+			<h2>
+				Docs <span>-&gt;</span>
+			</h2>
+			<p>Explore the official docs.</p>
+		</a>
+	);
+}

packages/shared-ui/src/cards/index.tsx

@@ -3,11 +3,13 @@ import type { PageNavigatorCardProps } from "./page-navigator-card";
 import { PageNavigatorCard } from "./page-navigator-card";
 import styles from "./cards.module.css";
 import { StarMeCard } from "./star-me-card";
+import { DocsCard } from "./docs-card";
 
 export function Cards({ LinkElement }: PageNavigatorCardProps) {
 	return (
 		<div className={styles.cards}>
 			<PageNavigatorCard LinkElement={LinkElement} />
+			<DocsCard />
 			<ExamplesCard />
 			<StarMeCard />
 		</div>