\n );\n}\n\nexport default Greeting;\n```\n\n## Using the Greeting Component in App.js\n\nNow let's use the `Greeting` component we just made in our main `App.js` file. Replace the code in `App.js` with the following:\n\n```jsx\nimport React from 'react';\nimport Greeting from './Greeting';\n\nfunction App() {\n return (\n
\n \n
\n );\n}\n\nexport default App;\n```\n\nNow, if you run `npm start` in your project directory, you should see the greeting \"Hello, React!\" on your browser. This is your first React component in action!\n\n## Conclusion\n\nThis is just the beginning of your journey with React! There are many more concepts to explore such as props, state, lifecycles, hooks, and more. Keep experimenting, building, and learning! React documentation and the community are great resources to help you along your path.\n\nHappy coding!";
+
+export const tutorialData = [
+ {
+ id: 1,
+ language: "react",
+ tutorial: [
+ {
+ id: 1,
+ content:
+ "Welcome to the React documentation! This page will give you an introduction to the 80% of React concepts that you will use on a daily basis.\r\n" +
+ "\r\n" +
+ "- How to create and nest components\r\n" +
+ "- How to add markup and styles\r\n" +
+ "- How to display data\r\n" +
+ "- How to render conditions and lists\r\n" +
+ "- How to respond to events and update the screen\r\n" +
+ "- How to share data between components\r\n",
+ code: `
+ function Welcome() {
+ return (
+
+ );
+ }
+ `,
+ },
+ {
+ id: 2,
+ content:
+ "## Creating and nesting components\r\n" +
+ "\r\n" +
+ "React apps are made out of _components_. A component is a piece of the UI (user interface) that has its own logic and appearance. A component can be as small as a button, or as large as an entire page.\r\n" +
+ "\r\n" +
+ "React components are JavaScript functions that return markup:\r\n" +
+ "\r\n" +
+ "```js\r\n" +
+ "function MyButton() {\r\n" +
+ " return ;\r\n" +
+ "}\r\n" +
+ "```\r\n" +
+ "\r\n" +
+ "Now that you've declared `MyButton`, you can nest it into another component:\r\n" +
+ "\r\n" +
+ "```js {5}\r\n" +
+ "export default function MyApp() {\r\n" +
+ " return (\r\n" +
+ "
\r\n" +
+ "
Welcome to my app
\r\n" +
+ " \r\n" +
+ "
\r\n" +
+ " );\r\n" +
+ "}\r\n" +
+ "```\r\n" +
+ "\r\n" +
+ "Notice that `` starts with a capital letter. That's how you know it's a React component. React component names must always start with a capital letter, while HTML tags must be lowercase.\r\n" +
+ "\r\n" +
+ "**_Have a look at the result(in the right side code editor)_**\r\n" +
+ "\r\n" +
+ "The `export default` keywords specify the main component in the file. If you're not familiar with some piece of JavaScript syntax, [MDN](https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export) and [javascript.info](https://javascript.info/import-export) have great references.\r\n",
+ code: `
+ import * as React from 'react'; //don't change this line
+
+ function MyApp() {
+ return (
+
+
Welcome to my app
+
+
+ );
+ }
+
+ function MyButton() {
+ return (
+
+ );
+ }
+ `,
+ },
+ {
+ id: 3,
+ content:
+ "## Writing markup with JSX\r\n" +
+ "\r\n" +
+ "The markup syntax you've seen above is called *JSX*. It is optional, but most React projects use JSX for its convenience. All of the [tools we recommend for local development](/learn/installation) support JSX out of the box.\r\n" +
+ "\r\n" +
+ "JSX is stricter than HTML. You have to close tags like ` `. Your component also can't return multiple JSX tags. You have to wrap them into a shared parent, like a `
\r\n" +
+ " \r\n" +
+ " );\r\n" +
+ "}\r\n" +
+ "```\r\n" +
+ "\r\n" +
+ "If you have a lot of HTML to port to JSX, you can use an [online converter.](https://transform.tools/html-to-jsx)",
+ code: `
+ function AboutPage() {
+ return (
+ <>
+
About
+
Hello there. How do you do?
+
+ );
+ }
+ `,
+ },
+ ],
+ },
+ {
+ id: 2,
+ language: "javascript",
+ tutorial: [
+ {
+ id: 1,
+ content: "# Welcome to `javascript` tutorial",
+ code: `\nfunction greet(name) {\n\tconsole.log("Hello, " + name + "!");\n}\n\ngreet("Mehedi");\n`,
+ },
+ ],
+ },
+ {
+ id: 3,
+ language: "typescript",
+ tutorial: [
+ {
+ id: 1,
+ content: "# Welcome to `typescript` tutorial",
+ code: `\ntype Params = {\n\tname: string;\n}\n\nfunction greet(data: Params) {\n\tconsole.log("Hello, " + data.name + "!");\n}\n\ngreet({ name: "Mehedi" });\n`,
+ },
+ ],
+ },
+ {
+ id: 4,
+ language: "python",
+ tutorial: [
+ {
+ id: 1,
+ content: "# Welcome to `python` tutorial",
+ code: `\ndef greet(name):\n\tprint("Hello, " + name + "!")\n\ngreet("Mehedi")\n`,
+ },
+ ],
+ },
+ {
+ id: 5,
+ language: "java",
+ tutorial: [
+ {
+ id: 1,
+ content: "# Welcome to `java` tutorial",
+ code: `\npublic class HelloWorld {\n\tpublic static void main(String[] args) {\n\t\tSystem.out.println("Hello World");\n\t}\n}\n`,
+ },
+ ],
+ },
+ {
+ id: 6,
+ language: "csharp",
+ tutorial: [
+ {
+ id: 1,
+ content: "# Welcome to `csharp` tutorial",
+ code: 'using System;\n\nnamespace HelloWorld\n{\n\tclass Hello { \n\t\tstatic void Main(string[] args) {\n\t\t\tConsole.WriteLine("Hello World in C#");\n\t\t}\n\t}\n}\n',
+ },
+ ],
+ },
+ {
+ id: 7,
+ language: "php",
+ tutorial: [
+ {
+ id: 1,
+ content: "# Welcome to `php` tutorial",
+ code: " {
+ setCurrentStepIndex((i) => Math.min(i + 1, steps.length - 1));
+ }, [steps.length]);
+
+ const back = useCallback(() => {
+ setCurrentStepIndex((i) => Math.max(i - 1, 0));
+ }, []);
+
+ const goTo = useCallback((index: number) => {
+ setCurrentStepIndex(index);
+ }, []);
+
+ return {
+ currentStepIndex,
+ step: steps[currentStepIndex],
+ steps,
+ isFirstStep: currentStepIndex === 0,
+ isLastStep: currentStepIndex === steps.length - 1,
+ goTo,
+ next,
+ back,
+ };
+}
diff --git a/src/lib/api.ts b/src/lib/api.ts
new file mode 100644
index 0000000..3e58cdf
--- /dev/null
+++ b/src/lib/api.ts
@@ -0,0 +1,20 @@
+import axios from "axios";
+import { LANGUAGE_VERSIONS } from "../constants/language-options";
+
+const API = axios.create({
+ baseURL: "https://emkc.org/api/v2/piston",
+});
+
+export const executeCode = async (language: string, sourceCode: string) => {
+ const response = await API.post("/execute", {
+ language: language,
+ // @ts-ignore
+ version: LANGUAGE_VERSIONS[language],
+ files: [
+ {
+ content: sourceCode,
+ },
+ ],
+ });
+ return response.data;
+};
diff --git a/src/lib/form-schema.ts b/src/lib/form-schema.ts
new file mode 100644
index 0000000..b5d4ca8
--- /dev/null
+++ b/src/lib/form-schema.ts
@@ -0,0 +1,39 @@
+import * as z from "zod";
+
+export const profileSchema = z.object({
+ firstname: z
+ .string()
+ .min(3, { message: "Product Name must be at least 3 characters" }),
+ lastname: z
+ .string()
+ .min(3, { message: "Product Name must be at least 3 characters" }),
+ email: z
+ .string()
+ .email({ message: "Product Name must be at least 3 characters" }),
+ contactno: z.coerce.number(),
+ country: z.string().min(1, { message: "Please select a category" }),
+ city: z.string().min(1, { message: "Please select a category" }),
+ // jobs array is for the dynamic fields
+ jobs: z.array(
+ z.object({
+ jobcountry: z.string().min(1, { message: "Please select a category" }),
+ jobcity: z.string().min(1, { message: "Please select a category" }),
+ jobtitle: z
+ .string()
+ .min(3, { message: "Product Name must be at least 3 characters" }),
+ employer: z
+ .string()
+ .min(3, { message: "Product Name must be at least 3 characters" }),
+ startdate: z
+ .string()
+ .refine((value) => /^\d{4}-\d{2}-\d{2}$/.test(value), {
+ message: "Start date should be in the format YYYY-MM-DD",
+ }),
+ enddate: z.string().refine((value) => /^\d{4}-\d{2}-\d{2}$/.test(value), {
+ message: "End date should be in the format YYYY-MM-DD",
+ }),
+ }),
+ ),
+});
+
+export type ProfileFormValues = z.infer;
diff --git a/src/lib/format-short-date.ts b/src/lib/format-short-date.ts
new file mode 100644
index 0000000..a27dbe0
--- /dev/null
+++ b/src/lib/format-short-date.ts
@@ -0,0 +1,7 @@
+import { format, isThisYear } from "date-fns"
+
+export const formatShortDate = (date: string) => {
+ const _date = new Date(date)
+
+ return isThisYear(_date) ? format(_date, "MMM d") : format(_date, "MMM d, y")
+}
\ No newline at end of file
diff --git a/src/lib/rehype-pretty-code.ts b/src/lib/rehype-pretty-code.ts
new file mode 100644
index 0000000..3bb7461
--- /dev/null
+++ b/src/lib/rehype-pretty-code.ts
@@ -0,0 +1,123 @@
+import { type Options } from "rehype-pretty-code"
+import { visit } from "unist-util-visit"
+
+// div.BLOCK > pre.PRE > code.CODE
+const BLOCK =
+ "overflow-hidden rounded-lg bg-rose-100/5 shadow-surface-elevation-low ring-1 ring-rose-100/[3%] ring-inset"
+const TITLE =
+ "mb-0.5 rounded-md bg-rose-100/10 px-3 py-1 font-mono text-xs text-rose-100/70 shadow-sm"
+const PRE = "overflow-x-auto py-2 text-[13px] leading-6 [color-scheme:dark]"
+const CODE =
+ "grid [&>span]:border-l-4 [&>span]:border-l-transparent [&>span]:pl-2 [&>span]:pr-3"
+const INLINE_BLOCK =
+ "whitespace-nowrap border border-rose-200/10 px-1.5 py-px text-[12px] rounded-full bg-white/5 whitespace-nowrap text-rose-300/90"
+const INLINE_CODE = ""
+const NUMBERED_LINES =
+ "[counter-reset:line] before:[&>span]:mr-3 before:[&>span]:inline-block before:[&>span]:w-4 before:[&>span]:text-right before:[&>span]:text-white/20 before:[&>span]:![content:counter(line)] before:[&>span]:[counter-increment:line]"
+const HIGHLIGHTED_LINE =
+ "!border-l-rose-300/70 bg-rose-200/10 before:!text-white/70"
+
+export function rehypePrettyCodeClasses() {
+ return (tree: any) => {
+ visit(
+ tree,
+ (node: any) =>
+ Boolean(
+ node.tagName === "code" &&
+ Object.keys(node.properties).length === 0 &&
+ node.children.some((n: any) => n.type === "text"),
+ ),
+ (node: any) => {
+ const textNode = node.children.find((n: any) => n.type === "text")
+ textNode.type = "element"
+ textNode.tagName = "code"
+ textNode.properties = { className: [INLINE_CODE] }
+ textNode.children = [{ type: "text", value: textNode.value }]
+ node.properties.className = [INLINE_BLOCK]
+ node.tagName = "span"
+ },
+ )
+
+ visit(
+ tree,
+ (node: any) =>
+ Boolean(
+ typeof node?.properties?.["data-rehype-pretty-code-fragment"] !==
+ "undefined",
+ ),
+ (node: any) => {
+ if (node.tagName === "span") {
+ node.properties.className = [
+ ...(node.properties.className || []),
+ INLINE_BLOCK,
+ ]
+ node.children[0].properties.className = [
+ ...(node.children[0].properties.className || []),
+ INLINE_CODE,
+ ]
+
+ return node
+ }
+
+ if (node.tagName === "div") {
+ node.properties.className = [
+ ...(node.properties.className || []),
+ BLOCK,
+ ]
+ node.children = node.children.map((node: any) => {
+ if (
+ node.tagName === "div" &&
+ typeof node.properties?.["data-rehype-pretty-code-title"] !==
+ "undefined"
+ ) {
+ node.properties.className = [
+ ...(node.properties.className || []),
+ TITLE,
+ ]
+ }
+ if (node.tagName === "pre") {
+ node.properties.className = [PRE]
+ if (node.children[0].tagName === "code") {
+ node.children[0].properties.className = [
+ ...(node.children[0].properties.className || []),
+ CODE,
+ ]
+ if (
+ typeof node.children[0].properties["data-line-numbers"] !==
+ "undefined"
+ ) {
+ node.children[0].properties.className.push(NUMBERED_LINES)
+ }
+ }
+ }
+
+ return node
+ })
+
+ return node
+ }
+ },
+ )
+ }
+}
+
+export const rehypePrettyCodeOptions: Partial = {
+ theme: "one-dark-pro",
+ tokensMap: {
+ // VScode command palette: Inspect Editor Tokens and Scopes
+ // https://github.com/Binaryify/OneDark-Pro/blob/47c66a2f2d3e5c85490e1aaad96f5fab3293b091/themes/OneDark-Pro.json
+ fn: "entity.name.function",
+ objKey: "meta.object-literal.key",
+ },
+ onVisitLine(node) {
+ // Prevent lines from collapsing in `display: grid` mode, and
+ // allow empty lines to be copy/pasted
+ if (node.children.length === 0) {
+ node.children = [{ type: "text", value: " " }]
+ }
+ node.properties.className = [""]
+ },
+ onVisitHighlightedLine(node) {
+ node.properties.className?.push(HIGHLIGHTED_LINE)
+ },
+}
\ No newline at end of file
diff --git a/src/lib/store-provider.tsx b/src/lib/store-provider.tsx
new file mode 100644
index 0000000..ff7971f
--- /dev/null
+++ b/src/lib/store-provider.tsx
@@ -0,0 +1,21 @@
+"use client";
+
+import { type PropsWithChildren, useRef } from "react";
+import type { StoreInterface, StoreType } from "./quiz-store";
+import { initializeStore, Provider } from "./quiz-store";
+
+export interface PreloadedStoreInterface
+ extends Pick {}
+
+export default function StoreProvider({
+ children,
+ ...props
+}: PropsWithChildren) {
+ const storeRef = useRef();
+
+ if (!storeRef.current) {
+ storeRef.current = initializeStore(props);
+ }
+
+ return {children};
+}
diff --git a/src/lib/useInterval.ts b/src/lib/useInterval.ts
new file mode 100644
index 0000000..ffce3d1
--- /dev/null
+++ b/src/lib/useInterval.ts
@@ -0,0 +1,23 @@
+"use client";
+import { useEffect, useRef } from "react";
+
+// https://overreacted.io/making-setinterval-declarative-with-react-hooks/
+export default function useInterval(
+ callback: () => void,
+ delay: number | undefined,
+) {
+ const savedCallback = useRef();
+
+ useEffect(() => {
+ savedCallback.current = callback;
+ }, [callback]);
+
+ useEffect(() => {
+ const handler = () => savedCallback.current?.();
+
+ if (delay !== null) {
+ const id = setInterval(handler, delay);
+ return () => clearInterval(id);
+ }
+ }, [delay]);
+}
\ No newline at end of file
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
new file mode 100644
index 0000000..365058c
--- /dev/null
+++ b/src/lib/utils.ts
@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+
+export function cn(...inputs: ClassValue[]) {
+ return twMerge(clsx(inputs));
+}
diff --git a/src/middleware.ts b/src/middleware.ts
new file mode 100644
index 0000000..8f15023
--- /dev/null
+++ b/src/middleware.ts
@@ -0,0 +1,20 @@
+import { type NextRequest } from "next/server";
+import { updateSession } from "@/utils/supabase/middleware";
+
+export async function middleware(request: NextRequest) {
+ return await updateSession(request);
+}
+
+export const config = {
+ matcher: [
+ /*
+ * Match all request paths except:
+ * - _next/static (static files)
+ * - _next/image (image optimization files)
+ * - favicon.ico (favicon file)
+ * - images - .svg, .png, .jpg, .jpeg, .gif, .webp
+ * Feel free to modify this pattern to include more paths.
+ */
+ "/((?!_next/static|_next/image|favicon.ico|.*\\.(?:svg|png|jpg|jpeg|gif|webp)$).*)",
+ ],
+};
\ No newline at end of file
diff --git a/src/styles/markdown-styles.module.css b/src/styles/markdown-styles.module.css
new file mode 100644
index 0000000..6e84809
--- /dev/null
+++ b/src/styles/markdown-styles.module.css
@@ -0,0 +1,55 @@
+.markdown h1 {
+ @apply my-3 text-xl font-medium sm:text-3xl;
+}
+
+.markdown h2 {
+ @apply my-3 text-xl font-medium sm:text-2xl;
+}
+
+.markdown h3 {
+ @apply text-xl font-medium my-3;
+}
+
+.markdown h4 {
+ @apply text-lg font-medium my-3;
+}
+
+.markdown h5 {
+ @apply text-lg font-medium my-3;
+}
+
+.markdown h6 {
+ @apply text-base font-medium my-3;
+}
+
+.markdown p {
+ @apply my-4
+}
+
+.markdown a {
+ @apply underline;
+}
+
+.markdown ul {
+ @apply space-y-3 [li>&]:mt-3 [&>li]:relative [&>li]:pl-7 before:[&>li]:absolute before:[&>li]:left-1 before:[&>li]:top-3 before:[&>li]:h-1.5 before:[&>li]:w-1.5 before:[&>li]:rounded-full before:[&>li]:bg-secondary my-4 ;
+}
+
+.markdown ol {
+ @apply list-decimal space-y-3 pl-10 mt-4;
+}
+
+.markdown strong {
+ @apply font-semibold;
+}
+
+.markdown blockquote {
+ @apply border-l-2 border-secondary text-xl italic xl:!col-start-2 xl:!col-end-3;
+}
+
+.markdown del {
+ @apply text-rose-100/70 line-through;
+}
+
+.markdown pre {
+ @apply p-4 rounded-md my-4;
+}
diff --git a/src/types/index.ts b/src/types/index.ts
new file mode 100644
index 0000000..6186fbd
--- /dev/null
+++ b/src/types/index.ts
@@ -0,0 +1,32 @@
+import { Icons } from "@/components/icons";
+
+export interface NavItem {
+ title: string;
+ href?: string;
+ disabled?: boolean;
+ external?: boolean;
+ icon?: keyof typeof Icons;
+ label?: string;
+ description?: string;
+}
+
+export interface NavItemWithChildren extends NavItem {
+ items: NavItemWithChildren[];
+}
+
+export interface NavItemWithOptionalChildren extends NavItem {
+ items?: NavItemWithChildren[];
+}
+
+export interface FooterItem {
+ title: string;
+ items: {
+ title: string;
+ href: string;
+ external?: boolean;
+ }[];
+}
+
+export type MainNavItem = NavItemWithOptionalChildren;
+
+export type SidebarNavItem = NavItemWithChildren;
diff --git a/src/utils/define-theme.ts b/src/utils/define-theme.ts
new file mode 100644
index 0000000..46c1c86
--- /dev/null
+++ b/src/utils/define-theme.ts
@@ -0,0 +1,20 @@
+import { loader } from "@monaco-editor/react";
+import { monacoThemes } from "../constants/monaco-themes";
+
+
+
+const defineTheme = (theme: string) => {
+ return new Promise((res) => {
+ Promise.all([
+ loader.init(),
+ // @ts-ignore
+ import(`monaco-themes/themes/${monacoThemes[theme]}.json`),
+ ]).then(([monaco, themeData]) => {
+ monaco.editor.defineTheme(theme, themeData);
+ // @ts-ignore
+ res();
+ });
+ });
+};
+
+export { defineTheme };
\ No newline at end of file
diff --git a/src/utils/supabase/client.ts b/src/utils/supabase/client.ts
new file mode 100644
index 0000000..b7b1b92
--- /dev/null
+++ b/src/utils/supabase/client.ts
@@ -0,0 +1,7 @@
+import { createBrowserClient } from "@supabase/ssr";
+
+export const createClient = () =>
+ createBrowserClient(
+ process.env.NEXT_PUBLIC_SUPABASE_URL!,
+ process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+ );
\ No newline at end of file
diff --git a/src/utils/supabase/middleware.ts b/src/utils/supabase/middleware.ts
new file mode 100644
index 0000000..2fceebe
--- /dev/null
+++ b/src/utils/supabase/middleware.ts
@@ -0,0 +1,78 @@
+import { createServerClient, type CookieOptions } from "@supabase/ssr";
+import { type NextRequest, NextResponse } from "next/server";
+
+export const updateSession = async (request: NextRequest) => {
+ // This `try/catch` block is only here for the interactive tutorial.
+ // Feel free to remove once you have Supabase connected.
+ try {
+ // Create an unmodified response
+ let response = NextResponse.next({
+ request: {
+ headers: request.headers,
+ },
+ });
+
+ const supabase = createServerClient(
+ process.env.NEXT_PUBLIC_SUPABASE_URL!,
+ process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+ {
+ cookies: {
+ get(name: string) {
+ return request.cookies.get(name)?.value;
+ },
+ set(name: string, value: string, options: CookieOptions) {
+ // If the cookie is updated, update the cookies for the request and response
+ request.cookies.set({
+ name,
+ value,
+ ...options,
+ });
+ response = NextResponse.next({
+ request: {
+ headers: request.headers,
+ },
+ });
+ response.cookies.set({
+ name,
+ value,
+ ...options,
+ });
+ },
+ remove(name: string, options: CookieOptions) {
+ // If the cookie is removed, update the cookies for the request and response
+ request.cookies.set({
+ name,
+ value: "",
+ ...options,
+ });
+ response = NextResponse.next({
+ request: {
+ headers: request.headers,
+ },
+ });
+ response.cookies.set({
+ name,
+ value: "",
+ ...options,
+ });
+ },
+ },
+ },
+ );
+
+ // This will refresh session if expired - required for Server Components
+ // https://supabase.com/docs/guides/auth/server-side/nextjs
+ await supabase.auth.getUser();
+
+ return response;
+ } catch (e) {
+ // If you are here, a Supabase client could not be created!
+ // This is likely because you have not set up environment variables.
+ // Check out http://localhost:3000 for Next Steps.
+ return NextResponse.next({
+ request: {
+ headers: request.headers,
+ },
+ });
+ }
+};
\ No newline at end of file
diff --git a/src/utils/supabase/server.ts b/src/utils/supabase/server.ts
new file mode 100644
index 0000000..c2b6f94
--- /dev/null
+++ b/src/utils/supabase/server.ts
@@ -0,0 +1,36 @@
+import { createServerClient, type CookieOptions } from "@supabase/ssr";
+import { cookies } from "next/headers";
+
+export const createClient = () => {
+ const cookieStore = cookies();
+
+ return createServerClient(
+ process.env.NEXT_PUBLIC_SUPABASE_URL!,
+ process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
+ {
+ cookies: {
+ get(name: string) {
+ return cookieStore.get(name)?.value;
+ },
+ set(name: string, value: string, options: CookieOptions) {
+ try {
+ cookieStore.set({ name, value, ...options });
+ } catch (error) {
+ // The `set` method was called from a Server Component.
+ // This can be ignored if you have middleware refreshing
+ // user sessions.
+ }
+ },
+ remove(name: string, options: CookieOptions) {
+ try {
+ cookieStore.set({ name, value: "", ...options });
+ } catch (error) {
+ // The `delete` method was called from a Server Component.
+ // This can be ignored if you have middleware refreshing
+ // user sessions.
+ }
+ },
+ },
+ },
+ );
+};
\ No newline at end of file
diff --git a/tailwind.config.js b/tailwind.config.js
new file mode 100644
index 0000000..8b86a88
--- /dev/null
+++ b/tailwind.config.js
@@ -0,0 +1,77 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+ darkMode: ["class"],
+ content: [
+ "./pages/**/*.{ts,tsx}",
+ "./components/**/*.{ts,tsx}",
+ "./constants/**/*.{ts,tsx}",
+ "./app/**/*.{ts,tsx}",
+ "./src/**/*.{ts,tsx}",
+ ],
+ theme: {
+ container: {
+ center: true,
+ padding: "2rem",
+ screens: {
+ "2xl": "1400px",
+ },
+ },
+ extend: {
+ colors: {
+ border: "hsl(var(--border))",
+ input: "hsl(var(--input))",
+ ring: "hsl(var(--ring))",
+ background: "hsl(var(--background))",
+ foreground: "hsl(var(--foreground))",
+ primary: {
+ DEFAULT: "hsl(var(--primary))",
+ foreground: "hsl(var(--primary-foreground))",
+ },
+ secondary: {
+ DEFAULT: "hsl(var(--secondary))",
+ foreground: "hsl(var(--secondary-foreground))",
+ },
+ destructive: {
+ DEFAULT: "hsl(var(--destructive))",
+ foreground: "hsl(var(--destructive-foreground))",
+ },
+ muted: {
+ DEFAULT: "hsl(var(--muted))",
+ foreground: "hsl(var(--muted-foreground))",
+ },
+ accent: {
+ DEFAULT: "hsl(var(--accent))",
+ foreground: "hsl(var(--accent-foreground))",
+ },
+ popover: {
+ DEFAULT: "hsl(var(--popover))",
+ foreground: "hsl(var(--popover-foreground))",
+ },
+ card: {
+ DEFAULT: "hsl(var(--card))",
+ foreground: "hsl(var(--card-foreground))",
+ },
+ },
+ borderRadius: {
+ lg: "var(--radius)",
+ md: "calc(var(--radius) - 2px)",
+ sm: "calc(var(--radius) - 4px)",
+ },
+ keyframes: {
+ "accordion-down": {
+ from: { height: 0 },
+ to: { height: "var(--radix-accordion-content-height)" },
+ },
+ "accordion-up": {
+ from: { height: "var(--radix-accordion-content-height)" },
+ to: { height: 0 },
+ },
+ },
+ animation: {
+ "accordion-down": "accordion-down 0.2s ease-out",
+ "accordion-up": "accordion-up 0.2s ease-out",
+ },
+ },
+ },
+ plugins: [require("tailwindcss-animate")],
+};
diff --git a/tsconfig.json b/tsconfig.json
new file mode 100644
index 0000000..8ebb468
--- /dev/null
+++ b/tsconfig.json
@@ -0,0 +1,27 @@
+{
+ "compilerOptions": {
+ "target": "es5",
+ "lib": ["dom", "dom.iterable", "esnext"],
+ "allowJs": true,
+ "skipLibCheck": true,
+ "strict": true,
+ "noEmit": true,
+ "esModuleInterop": true,
+ "module": "esnext",
+ "moduleResolution": "bundler",
+ "resolveJsonModule": true,
+ "isolatedModules": true,
+ "jsx": "preserve",
+ "incremental": true,
+ "plugins": [
+ {
+ "name": "next"
+ }
+ ],
+ "paths": {
+ "@/*": ["./src/*"],
+ }
+ },
+ "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
+ "exclude": ["node_modules"]
+}