diff --git a/compass/app/layout.tsx b/compass/app/layout.tsx new file mode 100644 index 0000000..2509089 --- /dev/null +++ b/compass/app/layout.tsx @@ -0,0 +1,20 @@ +import '../styles/globals.css'; +import { Metadata } from 'next' + +export const metadata: Metadata = { + title: 'Login', +} + +export default function RootLayout({ + // Layouts must accept a children prop. + // This will be populated with nested layouts or pages + children, +}: { + children: React.ReactNode +}) { + return ( + + {children} + + ) +} \ No newline at end of file diff --git a/compass/app/page.tsx b/compass/app/page.tsx new file mode 100644 index 0000000..48493ae --- /dev/null +++ b/compass/app/page.tsx @@ -0,0 +1,41 @@ +// pages/index.tsx + +import Button from '@/components/Button'; +import Input from '@/components/Input' +import InlineLink from '@/components/InlineLink'; +import Paper from '@/components/auth/Paper'; +import { Metadata } from 'next' + +export const metadata: Metadata = { + title: 'Login', +} + +export default function Page() { + return ( + <> + +
+
+ +
+
+ +
+
+ + Forgot password? + + + +
+
+

+ © 2024 Compass Center +

+ + + ); +}; + diff --git a/compass/components/Button.tsx b/compass/components/Button.tsx index 4552e14..72c47f9 100644 --- a/compass/components/Button.tsx +++ b/compass/components/Button.tsx @@ -8,12 +8,13 @@ type ButtonProps = { const Button: FunctionComponent = ({ children, onClick }) => { return ( diff --git a/compass/components/Input.tsx b/compass/components/Input.tsx index eace6b4..04d1db0 100644 --- a/compass/components/Input.tsx +++ b/compass/components/Input.tsx @@ -2,25 +2,28 @@ import React, { FunctionComponent, InputHTMLAttributes, ReactNode } from 'react' type InputProps = InputHTMLAttributes & { icon?: ReactNode; + title?: ReactNode; + title?:ReactNode; + placeholder?:ReactNode }; -const Input: FunctionComponent = ({ icon, ...rest }) => { +const Input: FunctionComponent = ({ icon, type, title, placeholder, ...rest }) => { return ( -
- {icon && {icon}} - -
+
+ +
); }; diff --git a/compass/components/auth/Page.tsx b/compass/components/auth/Page.tsx deleted file mode 100644 index 0fddda9..0000000 --- a/compass/components/auth/Page.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React, { ReactNode } from 'react'; - -interface PageInterface { - children: ReactNode; -} - -const Page: React.FC = ({ children }) => { - return ( -
- {children} -
- ); -}; - -export default Page; \ No newline at end of file diff --git a/compass/components/auth/Paper.tsx b/compass/components/auth/Paper.tsx new file mode 100644 index 0000000..95b9ba0 --- /dev/null +++ b/compass/components/auth/Paper.tsx @@ -0,0 +1,15 @@ +import React, { ReactNode } from 'react'; + +interface PageInterface { + children: ReactNode; +} + +const Paper: React.FC = ({ children }) => { + return ( +
+ {children} +
+ ); +}; + +export default Paper; \ No newline at end of file diff --git a/compass/pages/_app.tsx b/compass/pages/_app.tsx deleted file mode 100644 index 4642da1..0000000 --- a/compass/pages/_app.tsx +++ /dev/null @@ -1,8 +0,0 @@ -import '../styles/globals.css'; -import type { AppProps } from 'next/app'; - -function MyApp({ Component, pageProps }: AppProps) { - return ; -} - -export default MyApp; \ No newline at end of file diff --git a/compass/pages/index.tsx b/compass/pages/index.tsx deleted file mode 100644 index 3eed8e4..0000000 --- a/compass/pages/index.tsx +++ /dev/null @@ -1,48 +0,0 @@ -// pages/index.tsx - -import Button from '@/components/Button'; -import type { NextPage } from 'next'; -import Head from 'next/head'; -import Input from '@/components/Input' -import InlineLink from '@/components/InlineLink'; -import Page from '@/components/auth/Page'; - -const Home: NextPage = () => { - return ( - <> - - - - -
-
- - -
-
- - -
-
- - Forgot password? - - - -
-
-

- © 2024 Compass Center -

- - - ); -}; - -export default Home;