Add app directory

2025-07-16 01:01:38 +00:00 · 2023-03-20 16:00:43 +08:00
parent 01c6ab55c2
commit f0f9e620b5
23 changed files with 836 additions and 1987 deletions
--- a/app/layout.tsx
+++ b/app/layout.tsx
@ -0,0 +1,29 @@
+import 'styles/globals.css';
+import RUAThemeProvider from './theme-provider';
+
+export const metadata = {
+  title: 'RUA',
+};
+
+export default function RootLayout({
+  children,
+}: {
+  children: React.ReactNode;
+}) {
+  return (
+    <html lang="en">
+      <head>
+        <link rel="preconnect" href="https://fonts.googleapis.com" />
+        <link rel="preconnect" href="https://fonts.gstatic.com" />
+        <link
+          rel="preconnect"
+          href="https://ZUYZBUJBQW-dsn.algolia.net"
+          crossOrigin=""
+        />
+      </head>
+      <body>
+        <RUAThemeProvider>{children}</RUAThemeProvider>
+      </body>
+    </html>
+  );
+}
--- a/app/page.tsx
+++ b/app/page.tsx
@ -0,0 +1,32 @@
+import clsx from 'clsx';
+import { gltfLoader, manager } from 'lib/gltf-loader';
+import { getMousePosition } from 'lib/utils';
+import dynamic from 'next/dynamic';
+import Head from 'next/head';
+import Image from 'next/image';
+import { Suspense, useCallback } from 'react';
+import { InitFn, THREE, useThree } from 'rua-three';
+import styles from 'styles/index/index.module.css';
+import { GLTF } from 'three/examples/jsm/loaders/GLTFLoader';
+
+export default function Page() {
+  return (
+    <main className="h-[calc(100vh-142px)] flex justify-center items-center text-xl">
+      <div className="z-0 flex flex-col w-full h-full max-w-4xl px-4 py-32 text-2xl">
+        <h1 className="flex pb-4 text-5xl">
+          <span className={clsx('font-Aleo font-semibold', styles.gradient)}>
+            Hi there
+          </span>
+          <span className="ml-3">
+            <Image
+              src="/images/img/hands.svg"
+              alt="hands"
+              width={36}
+              height={36}
+            />
+          </span>
+        </h1>
+      </div>
+    </main>
+  );
+}
--- a/app/theme-provider.tsx
+++ b/app/theme-provider.tsx
@ -0,0 +1,22 @@
+'use client';
+
+import { ThemeProvider } from 'next-themes';
+import { ReactNode } from 'react';
+
+export default function RUAThemeProvider({
+  children,
+}: {
+  children: ReactNode;
+}) {
+  return (
+    <ThemeProvider
+      attribute="class"
+      storageKey="rua-theme"
+      themes={['light', 'dark']}
+      enableSystem
+      defaultTheme="system"
+    >
+      {children}
+    </ThemeProvider>
+  );
+}