diff --git a/README.md b/README.md
index d65912d..8cc65fc 100644
--- a/README.md
+++ b/README.md
@@ -1 +1,35 @@
-# compass
\ No newline at end of file
+# 🧭 Compass Center's Internal Resource Management App
+
+## 🛠 Technologies
+- Next.js
+- TailwindCSS
+- TypeScript
+- PostgreSQL
+
+## 📁 File Setup
+```
+\compass
+ \components // Components organized in folders related to specific pages
+ \pages // Store all pages here
+ \api // API routes
+ \public // Local assets (minimize usage)
+ \utils // Constants, Routes, Classes, Dummy Data
+ \styles // CSS files
+```
+
+## 🚀 To Start
+Follow these steps to set up your local environment:
+```
+\\ Clone this repository
+git clone https://github.com/cssgunc/compass.git
+\\ Go into main folder
+cd compass
+\\ Install dependencies
+npm install
+\\ Run local environment
+npm run dev
+```
+
+## 💡 Dev Notes
+- For each task, create a branch in the format '[your name]-[ticket number]-[task description]'
+- Only commit your work to that branch and then make a git request to '/main'
\ No newline at end of file
diff --git a/compass/app/favicon.ico b/compass/app/favicon.ico
deleted file mode 100644
index 718d6fe..0000000
Binary files a/compass/app/favicon.ico and /dev/null differ
diff --git a/compass/app/globals.css b/compass/app/globals.css
deleted file mode 100644
index fd81e88..0000000
--- a/compass/app/globals.css
+++ /dev/null
@@ -1,27 +0,0 @@
-@tailwind base;
-@tailwind components;
-@tailwind utilities;
-
-:root {
- --foreground-rgb: 0, 0, 0;
- --background-start-rgb: 214, 219, 220;
- --background-end-rgb: 255, 255, 255;
-}
-
-@media (prefers-color-scheme: dark) {
- :root {
- --foreground-rgb: 255, 255, 255;
- --background-start-rgb: 0, 0, 0;
- --background-end-rgb: 0, 0, 0;
- }
-}
-
-body {
- color: rgb(var(--foreground-rgb));
- background: linear-gradient(
- to bottom,
- transparent,
- rgb(var(--background-end-rgb))
- )
- rgb(var(--background-start-rgb));
-}
diff --git a/compass/app/layout.tsx b/compass/app/layout.tsx
index 40e027f..2509089 100644
--- a/compass/app/layout.tsx
+++ b/compass/app/layout.tsx
@@ -1,22 +1,20 @@
-import type { Metadata } from 'next'
-import { Inter } from 'next/font/google'
-import './globals.css'
-
-const inter = Inter({ subsets: ['latin'] })
-
+import '../styles/globals.css';
+import { Metadata } from 'next'
+
export const metadata: Metadata = {
- title: 'Create Next App',
- description: 'Generated by create next app',
+ 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}
+ {children}
)
-}
+}
\ No newline at end of file
diff --git a/compass/app/page.tsx b/compass/app/page.tsx
index 7a8286b..48493ae 100644
--- a/compass/app/page.tsx
+++ b/compass/app/page.tsx
@@ -1,113 +1,41 @@
-import Image from 'next/image'
+// pages/index.tsx
-export default function Home() {
- return (
-
-
-
- Get started by editing
- app/page.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 (
+ <>
+
+
+
+ © 2024 Compass Center
+
+
+
+ );
+};
+
diff --git a/compass/components/Button.tsx b/compass/components/Button.tsx
new file mode 100644
index 0000000..72c47f9
--- /dev/null
+++ b/compass/components/Button.tsx
@@ -0,0 +1,23 @@
+import { FunctionComponent, ReactNode } from 'react';
+
+type ButtonProps = {
+ children: ReactNode;
+ onClick?: () => void; // make the onClick handler optional
+};
+
+const Button: FunctionComponent = ({ children, onClick }) => {
+ return (
+
+ );
+};
+export default Button;
diff --git a/compass/components/InlineLink.tsx b/compass/components/InlineLink.tsx
new file mode 100644
index 0000000..a913ff4
--- /dev/null
+++ b/compass/components/InlineLink.tsx
@@ -0,0 +1,16 @@
+import React, { ReactNode } from 'react';
+
+interface Link {
+ href?: string;
+ children: ReactNode;
+}
+
+const InlineLink: React.FC = ({href = '#', children}) => {
+ return (
+
+ {children}
+
+ )
+}
+
+export default InlineLink;
\ No newline at end of file
diff --git a/compass/components/Input.tsx b/compass/components/Input.tsx
new file mode 100644
index 0000000..04d1db0
--- /dev/null
+++ b/compass/components/Input.tsx
@@ -0,0 +1,30 @@
+import React, { FunctionComponent, InputHTMLAttributes, ReactNode } from 'react';
+
+type InputProps = InputHTMLAttributes & {
+ icon?: ReactNode;
+ title?: ReactNode;
+ title?:ReactNode;
+ placeholder?:ReactNode
+};
+
+const Input: FunctionComponent = ({ icon, type, title, placeholder, ...rest }) => {
+ return (
+
+
+
+ );
+};
+
+export default Input;
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/package-lock.json b/compass/package-lock.json
index cd8e0a2..aa9dab8 100644
--- a/compass/package-lock.json
+++ b/compass/package-lock.json
@@ -8,6 +8,7 @@
"name": "compass",
"version": "0.1.0",
"dependencies": {
+ "@heroicons/react": "^2.1.1",
"next": "13.5.6",
"react": "^18",
"react-dom": "^18"
@@ -113,6 +114,14 @@
"node": "^12.22.0 || ^14.17.0 || >=16.0.0"
}
},
+ "node_modules/@heroicons/react": {
+ "version": "2.1.1",
+ "resolved": "https://registry.npmjs.org/@heroicons/react/-/react-2.1.1.tgz",
+ "integrity": "sha512-JyyN9Lo66kirbCMuMMRPtJxtKJoIsXKS569ebHGGRKbl8s4CtUfLnyKJxteA+vIKySocO4s1SkTkGS4xtG/yEA==",
+ "peerDependencies": {
+ "react": ">= 16"
+ }
+ },
"node_modules/@humanwhocodes/config-array": {
"version": "0.11.13",
"resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.11.13.tgz",
diff --git a/compass/package.json b/compass/package.json
index 55d0404..a748bbe 100644
--- a/compass/package.json
+++ b/compass/package.json
@@ -9,19 +9,20 @@
"lint": "next lint"
},
"dependencies": {
+ "@heroicons/react": "^2.1.1",
+ "next": "13.5.6",
"react": "^18",
- "react-dom": "^18",
- "next": "13.5.6"
+ "react-dom": "^18"
},
"devDependencies": {
- "typescript": "^5",
"@types/node": "^20",
"@types/react": "^18",
"@types/react-dom": "^18",
"autoprefixer": "^10",
+ "eslint": "^8",
+ "eslint-config-next": "13.5.6",
"postcss": "^8",
"tailwindcss": "^3",
- "eslint": "^8",
- "eslint-config-next": "13.5.6"
+ "typescript": "^5"
}
}
diff --git a/compass/public/fonts/Inter-Black.ttf b/compass/public/fonts/Inter-Black.ttf
new file mode 100644
index 0000000..b27822b
Binary files /dev/null and b/compass/public/fonts/Inter-Black.ttf differ
diff --git a/compass/public/fonts/Inter-Bold.ttf b/compass/public/fonts/Inter-Bold.ttf
new file mode 100644
index 0000000..fe23eeb
Binary files /dev/null and b/compass/public/fonts/Inter-Bold.ttf differ
diff --git a/compass/public/fonts/Inter-ExtraBold.ttf b/compass/public/fonts/Inter-ExtraBold.ttf
new file mode 100644
index 0000000..874b1b0
Binary files /dev/null and b/compass/public/fonts/Inter-ExtraBold.ttf differ
diff --git a/compass/public/fonts/Inter-ExtraLight.ttf b/compass/public/fonts/Inter-ExtraLight.ttf
new file mode 100644
index 0000000..c993e82
Binary files /dev/null and b/compass/public/fonts/Inter-ExtraLight.ttf differ
diff --git a/compass/public/fonts/Inter-Light.ttf b/compass/public/fonts/Inter-Light.ttf
new file mode 100644
index 0000000..71188f5
Binary files /dev/null and b/compass/public/fonts/Inter-Light.ttf differ
diff --git a/compass/public/fonts/Inter-Medium.ttf b/compass/public/fonts/Inter-Medium.ttf
new file mode 100644
index 0000000..a01f377
Binary files /dev/null and b/compass/public/fonts/Inter-Medium.ttf differ
diff --git a/compass/public/fonts/Inter-Regular.ttf b/compass/public/fonts/Inter-Regular.ttf
new file mode 100644
index 0000000..5e4851f
Binary files /dev/null and b/compass/public/fonts/Inter-Regular.ttf differ
diff --git a/compass/public/fonts/Inter-SemiBold.ttf b/compass/public/fonts/Inter-SemiBold.ttf
new file mode 100644
index 0000000..ecc7041
Binary files /dev/null and b/compass/public/fonts/Inter-SemiBold.ttf differ
diff --git a/compass/public/fonts/Inter-Thin.ttf b/compass/public/fonts/Inter-Thin.ttf
new file mode 100644
index 0000000..fe77243
Binary files /dev/null and b/compass/public/fonts/Inter-Thin.ttf differ
diff --git a/compass/styles/globals.css b/compass/styles/globals.css
new file mode 100644
index 0000000..bec3b2c
--- /dev/null
+++ b/compass/styles/globals.css
@@ -0,0 +1,47 @@
+/* globals.css */
+@import 'tailwindcss/base';
+@import 'tailwindcss/components';
+@import 'tailwindcss/utilities';
+
+
+:root {
+ /* Colors */
+ --ring-color: 199, 21, 133;
+ /* This is the RGB value for a purple color */
+ --ring-opacity: 0.5;
+
+ /* Shadows */
+ --shadow-default: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
+ --shadow-focus: 0 0 0 3px rgba(66, 153, 225, 0.5);
+
+ /* Borders */
+ --border-radius: 0.375rem;
+ /* 6px */
+ --border-width: 1px;
+
+ /* Spacing */
+ --spacing-px: 1px;
+ --spacing-2: 0.5rem;
+ /* 8px */
+ --spacing-3: 0.75rem;
+ /* 12px */
+
+ /* Font */
+ --font-color: #4a5568;
+ /* A shade of gray */
+}
+
+
+@font-face {
+ font-family: 'Inter';
+ font-style: normal;
+ font-weight: 400;
+ src: url('/fonts/Inter-Regular.ttf') format('ttf'),
+ url('/fonts/Inter-Bold.ttf') format('ttf'),
+ url('/fonts/Inter-Black.ttf') format('ttf'),
+ url('/fonts/Inter-ExtraBold.ttf') format('ttf'),
+ url('/fonts/Inter-ExtraLight.ttf') format('ttf'),
+ url('/fonts/Inter-Medium.ttf') format('ttf'),
+ url('/fonts/Inter-SemiBold.ttf') format('ttf'),
+ url('/fonts/Inter-Thin.ttf') format('ttf');
+ }
\ No newline at end of file
diff --git a/compass/tailwind.config.ts b/compass/tailwind.config.ts
index c7ead80..abab24e 100644
--- a/compass/tailwind.config.ts
+++ b/compass/tailwind.config.ts
@@ -1,4 +1,4 @@
-import type { Config } from 'tailwindcss'
+import type { Config } from 'tailwindcss';
const config: Config = {
content: [
@@ -10,11 +10,14 @@ const config: Config = {
extend: {
backgroundImage: {
'gradient-radial': 'radial-gradient(var(--tw-gradient-stops))',
- 'gradient-conic':
- 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
+ 'gradient-conic': 'conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))',
+ },
+ fontFamily: {
+ sans: ['Inter', 'sans-serif'],
},
},
},
plugins: [],
-}
-export default config
+};
+
+export default config;
diff --git a/compass/utils/classes/CollectionImpl.tsx b/compass/utils/classes/CollectionImpl.tsx
new file mode 100644
index 0000000..8d8a46a
--- /dev/null
+++ b/compass/utils/classes/CollectionImpl.tsx
@@ -0,0 +1,16 @@
+class CollectionImpl {
+ title: string;
+ icon: any;
+ data: any;
+
+ constructor(title: string, icon: any) {
+ this.title = title;
+ this.icon = icon;
+ }
+
+ // subject to change
+ setData(data: any){
+ this.data = data;
+ }
+
+}
\ No newline at end of file
diff --git a/compass/utils/constants.tsx b/compass/utils/constants.tsx
new file mode 100644
index 0000000..ad0169d
--- /dev/null
+++ b/compass/utils/constants.tsx
@@ -0,0 +1,54 @@
+import { ListBulletIcon, HashtagIcon, Bars3BottomLeftIcon, EnvelopeIcon, AtSymbolIcon, ClipboardIcon, ArrowsUpDownIcon, ChevronDoubleRightIcon, ChevronDoubleLeftIcon, ChevronRightIcon, ChevronLeftIcon, EyeIcon, EyeSlashIcon, UserIcon, BookOpenIcon, MagnifyingGlassIcon, LinkIcon } from '@heroicons/react/24/solid';
+
+export const Icons = {
+ EmailInputIcon: EnvelopeIcon,
+ HidePasswordIcon: EyeSlashIcon,
+ UnhidePasswordIcon: EyeIcon,
+ UserIcon: UserIcon,
+ ResourceIcon: BookOpenIcon,
+ SearchIcon: MagnifyingGlassIcon,
+ ServiceIcon: ClipboardIcon,
+ CloseRightArrow: ChevronDoubleRightIcon,
+ CloseLeftArrow: ChevronDoubleLeftIcon,
+ LinkRightArrow:ChevronRightIcon,
+ LinkLeftArrow:ChevronLeftIcon,
+ SortIcon: ArrowsUpDownIcon,
+ EmailTableIcon:AtSymbolIcon,
+ LinkTableIcon: LinkIcon,
+ TextTableIcon: Bars3BottomLeftIcon,
+ NumberTableIcon: HashtagIcon,
+ MultiselectTableIcon: ListBulletIcon
+};
+
+export enum User {
+ ADMIN,
+ EMPLOYEE,
+ VOLUNTEER
+}
+
+export enum COLLECTION {
+ RESOURCE,
+ SERVICE,
+ USER
+}
+
+export enum PROGRAM {
+ DOMESTIC_VIOLENCE,
+ ECONOMIC_STABILITY,
+ COMMUNITY_EDUCATION
+}
+
+export enum DATATYPE {
+ INTEGER,
+ STRING,
+ LINK,
+ EMAIL,
+ MULTISELECT,
+ SELECT
+}
+
+export const COLLECTION_MAP: {[key in COLLECTION]: CollectionImpl} = {
+ [COLLECTION.RESOURCE]: new CollectionImpl('Resources', Icons.ResourceIcon),
+ [COLLECTION.SERVICE]: new CollectionImpl('Services', Icons.ServiceIcon),
+ [COLLECTION.USER]: new CollectionImpl('Users', Icons.UserIcon)
+}
\ No newline at end of file
diff --git a/compass/utils/routes.tsx b/compass/utils/routes.tsx
new file mode 100644
index 0000000..e69de29