Merge pull request #58 from penumbra-zone/feat/v2-routes

feat: #46: setup v2 routes and Tailwind
penumbra-zone · Sep 20, 2024 · ab9d013 · ab9d013
2 parents 9898273 + ee68517
commit ab9d013
Show file tree

Hide file tree

Showing 10 changed files with 165 additions and 43 deletions.
diff --git a/next-env.d.ts b/next-env.d.ts
@@ -1,5 +1,6 @@
 /// <reference types="next" />
 /// <reference types="next/image-types/global" />
+/// <reference types="next/navigation-types/compat/navigation" />
 
 // NOTE: This file should not be edited
-// see https://nextjs.org/docs/pages/building-your-application/configuring/typescript for more information.
+// see https://nextjs.org/docs/app/building-your-application/configuring/typescript for more information.
diff --git a/package.json b/package.json
@@ -77,11 +77,14 @@
     "@types/react": "^18.3.5",
     "@types/react-dom": "^18.3.0",
     "@types/react-outside-click-handler": "^1.3.3",
+    "autoprefixer": "^10.4.20",
     "babel-loader": "^9.1.3",
     "eslint": "8.57.0",
     "eslint-config-next": "14.2.3",
     "eslint-plugin-react": "^7.35.2",
     "globals": "^15.9.0",
+    "postcss": "^8.4.47",
+    "tailwindcss": "^3.4.12",
     "ts-loader": "^9.5.1",
     "typescript": "^5.5.4",
     "typescript-eslint": "^8.4.0"

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/postcss.config.mjs b/postcss.config.mjs
@@ -0,0 +1,6 @@
+export default {
+  plugins: {
+    tailwindcss: {},
+    autoprefixer: {},
+  },
+}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
@@ -0,0 +1,14 @@
+import { ReactNode } from 'react';
+import '@/v2.css';
+
+const RootLayout = ({ children }: { children: ReactNode }) => {
+  return (
+    <html lang="en">
+      <body>
+        {children}
+      </body>
+    </html>
+  )
+}
+
+export default RootLayout;
diff --git a/src/app/v2/layout.tsx b/src/app/v2/layout.tsx
@@ -0,0 +1,14 @@
+'use client';
+
+import { ReactNode } from 'react';
+import { PenumbraUIProvider } from '@penumbra-zone/ui/PenumbraUIProvider';
+
+const V2Layout = ({ children }: { children: ReactNode }) => {
+  return (
+    <PenumbraUIProvider>
+      {children}
+    </PenumbraUIProvider>
+  )
+};
+
+export default V2Layout;
diff --git a/src/app/v2/page.tsx b/src/app/v2/page.tsx
@@ -0,0 +1,17 @@
+'use client';
+
+import { Text } from '@penumbra-zone/ui/Text';
+
+const HomePage = () => {
+  return (
+    <section>
+      <h1 className="text-3xl font-bold text-white">
+        Hello world!
+      </h1>
+
+      <Text h2>Hi!</Text>
+    </section>
+  )
+}
+
+export default HomePage;
diff --git a/styles/v2.css b/styles/v2.css
@@ -0,0 +1,19 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
+html,
+body {
+  padding: 0;
+  margin: 0;
+  background: #000;
+}
+
+a {
+  color: inherit;
+  text-decoration: none;
+}
+
+* {
+  box-sizing: border-box;
+}
diff --git a/tailwind.config.mjs b/tailwind.config.mjs
@@ -0,0 +1,10 @@
+import { tailwindConfig as v2TailwindConfig } from '@penumbra-zone/ui/tailwind';
+
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: [
+    "./src/**/*.{js,ts,jsx,tsx,mdx,css}",
+  ],
+  theme: v2TailwindConfig.theme,
+  plugins: [],
+}
diff --git a/tsconfig.json b/tsconfig.json
@@ -24,7 +24,8 @@
     },
     "allowJs": true,
     "incremental": true,
-    "jsx": "preserve"
+    "jsx": "preserve",
+    "strictNullChecks": true
   },
   "extends": [
     "@tsconfig/strictest/tsconfig.json",
@@ -40,4 +41,4 @@
   "exclude": [
     "node_modules"
   ]
-}
+}