LabConnect-RCOS · WBroadwell · Oct 21, 2025 · Sep 30, 2025 · Oct 4, 2025 · Oct 14, 2025
diff --git a/README.md b/README.md
@@ -28,6 +28,9 @@ posted by professors, graduate students, or lab staff.</p>
 [![Node.js][Node.js]][Node.js-url]
 [![Tailwind CSS][TailwindCSS]][TailwindCSS-url]
 
+### Current Frontend UI
+<img src="src/images/website_image2.png" alt="Website Image 1" width="360" align="top">
+<img src="src/images/website_image1.png" alt="Website Image 2" width="360" align="top">
 
 <!-- Getting Started -->
 ## Prerequisites
@@ -64,23 +67,55 @@ posted by professors, graduate students, or lab staff.</p>
 |------------------------|---------------|---------------------------------------------------------------|
 | `VITE_BACKEND_SERVER` | None | URL to the backend server |
 
-Set the varaible with:
-```
-$ export VITE_BACKEND_SERVER="http://127.0.0.1:9000"
-```
+* Set the variable with:
+    ```
+    $ export VITE_BACKEND_SERVER="http://127.0.0.1:9000"
+    ```
 
 ## Testing
  * To run the frontend locally run the following:
     ```
     $ make develop
     ```
     This command allows editing and autoreloading while making changes
+
+### Linting
+* Run the linter and fix any lint issues to maintiain code quality and standards
+    ```
+    make lint
+    ```
 
 ## Building
-  * To build the application use this command to build the static files and test the production version of deploy the files.
+  * To build the application use this command to build the static files and test the production version of the files.
     ```
-    npm run build
+    $ npm run build
     ```
+    This command allows editing and autoreloading while making changes
+
+## Deployment
+Create PRs to the main branch from your working branch. Make sure your new code is tested and bug free. Upon creating a merge request, a build test will make sure your code is running without errors and safe to merge to main.
+
+## Contact Us
+[![Discord](https://img.shields.io/badge/Discord-5865F2.svg?style=for-the-badge&logo=discord&logoColor=white)](https://discord.gg/tsaxCKjYHT)
+[![Jira](https://img.shields.io/badge/Jira-0052CC.svg?style=for-the-badge&logo=jira&logoColor=white)](https://rcoslabconnect.atlassian.net/jira/software/projects/CCS/list)
+
+## Project Contributors
+
+Running list of contributors to the LabConnect project:
+
+### Project Lead
+
+- **Will Broadwell** [Project Lead]
+- **Rafael Cenzano** [Former Project Lead]
+
+### Rensselaer Center for Open Source Development Team
+
+- **Jaswanth D** [Frontend]
+- **Doan N** [Frontend]
+- **Pragathi A** [Frontend / Backend]
+- **Aniket S** [Backend]
+
+### Past Rensselaer Center for Open Source Development Team
 
 ## Deployment
 Create PRs to the main branch. Upon merging, a build test will make sure your code is running without errors and safe to merge to main. On a completed merge the action will build and push the new docker image.

diff --git a/index.html b/index.html
@@ -3,7 +3,7 @@
 
 <head>
   <meta charset="UTF-8" />
-  <link rel="icon" href="/favicon.ico" />
+  <link rel="icon" href="/public/favicon.ico" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>Labconnect</title>
 </head>

diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/logo192.png b/public/logo192.png
diff --git a/public/logo512.png b/public/logo512.png
diff --git a/src/App.tsx b/src/App.tsx
@@ -25,7 +25,7 @@ function App() {
       <HelmetProvider>
         <div className="min-h-screen flex flex-col bg-white dark:bg-gray-900">
           <MainNavigation />
-          <main className="p-8 grow bg-transparent">
+          <main className="p-10 grow bg-transparent">
             <Routes>
               <Route path="/" element={<Home />} />
               <Route path="/health" element={<p>App is Healthy</p>} />

diff --git a/src/images/simple_logo-transparent.png b/src/images/simple_logo-transparent.png
diff --git a/src/images/simple_logo.png b/src/images/simple_logo.png
diff --git a/src/images/website_image1.png b/src/images/website_image1.png
diff --git a/src/images/website_image2.png b/src/images/website_image2.png
diff --git a/src/logo.svg b/src/logo.svg
diff --git a/src/opportunities/components/AboutSection.tsx b/src/opportunities/components/AboutSection.tsx
diff --git a/src/opportunities/components/AboutSectionElement.tsx b/src/opportunities/components/AboutSectionElement.tsx
diff --git a/src/opportunities/components/HorizontalIconButton.tsx b/src/opportunities/components/HorizontalIconButton.tsx
@@ -1,8 +1,8 @@
 import React from "react";
 
 interface HorizontalIconButtonProps {
-  children?: React.ReactNode;
-  onClick: (arg?: React.ReactNode) => void;
+  children: string;
+  onClick: (arg: string) => void;
   icon: React.ReactNode;
   special: boolean;
 }

diff --git a/src/opportunities/components/JobDetails.tsx b/src/opportunities/components/JobDetails.tsx
@@ -1,5 +1,4 @@
 import React from "react";
-import AboutSection from "./AboutSection";
 import JobHeader from "./JobHeader";
 import JobDescription from "./JobDescription";
 
@@ -9,17 +8,14 @@ interface JobDetailsProps {
   department: string;
   description: string;
   authorProfile: string;
-  aboutSection: AboutItem[];
   recommended_experience: string;
 }
 
 const JobDetails = ({
   name,
   author,
-  department,
   description,
   authorProfile,
-  aboutSection,
   recommended_experience,
 }: JobDetailsProps) => {
   return (
@@ -28,9 +24,7 @@ const JobDetails = ({
         title={name}
         author={author}
         img={authorProfile}
-        department={department}
       />
-      <AboutSection aboutSection={aboutSection} />
       <JobDescription
         description={`${description ? description : "No description available."
           }`}

diff --git a/src/opportunities/components/JobHeader.tsx b/src/opportunities/components/JobHeader.tsx
@@ -5,14 +5,13 @@ interface JobHeaderProps {
   title: string;
   img: string;
   author: string;
-  department: string;
 }
 
-const JobHeader = ({ title, img, author, department }: JobHeaderProps) => {
+const JobHeader = ({ title, img, author}: JobHeaderProps) => {
   return (
     <section className="flex flex-col gap-3">
       <h2 className="font-bold text-5xl">{title}</h2>
-      <Avatar img={img} name={author} role={department} />
+      <Avatar img={img} name={author} />
     </section>
   );
 };

diff --git a/src/opportunities/components/OpportunitiesDetails.tsx b/src/opportunities/components/OpportunitiesDetails.tsx
@@ -1,4 +1,5 @@
 import React from "react";
+import { Link } from "react-router-dom";
 import { OpportunityList } from "../../types/opportunities.ts";
 
 interface OpportunitiesListProps {
@@ -39,9 +40,11 @@ export default function OpportunitiesList({ opportunities }: OpportunitiesListPr
                     {opportunity.semester} {opportunity.year}
                   </td>
                   <td className="p-3 border">
-                    <button className="bg-blue-500 text-white px-4 py-1 rounded hover:bg-blue-600 mr-2">
-                      View
-                    </button>
+                    <Link to={`/post/${opportunity.id}`}>
+                      <button className="bg-blue-500 text-white px-4 py-1 rounded hover:bg-blue-600 mr-2">
+                        View
+                      </button>
+                    </Link>
                   </td>
                   <td className="p-3 border">
                     <button className="bg-blue-500 text-white px-4 py-1 rounded hover:bg-blue-600">

diff --git a/src/opportunities/pages/IndividualPost.tsx b/src/opportunities/pages/IndividualPost.tsx
@@ -20,7 +20,6 @@ const IndividualPost = () => {
     }
 
     const data = await response.json();
-    console.log(data);
     return data["data"];
   };
 
@@ -33,6 +32,10 @@ const IndividualPost = () => {
     findDetails();
   });
 
+
+
+
+
   return (
     <div>
       {details === "Searching" ? (

diff --git a/src/shared/components/Navigation/MainNavigation.tsx b/src/shared/components/Navigation/MainNavigation.tsx
@@ -3,7 +3,7 @@ import { Disclosure } from "@headlessui/react";
 import { Bars3Icon, XMarkIcon } from "@heroicons/react/24/outline";
 import { Link, NavLink } from "react-router-dom";
 import { useAuth } from "../../../context/AuthContext.tsx";
-import logo from "../../../images/LabConnect_Logo-removebg-preview.png"; // Adjust path if needed
+import logo from "../../../images/simple_logo-transparent.png"; // Adjust path if needed
 
 export default function MainNavigation() {
   const { auth } = useAuth();
@@ -41,7 +41,7 @@ export default function MainNavigation() {
                 <img
                   src={logo}
                   alt="LabConnect Logo"
-                  className="h-16 w-auto filter brightness-0 invert"
+                  className="pr-3 pl-5 h-16 w-auto filter brightness-0 invert"
                 />
               </Link>
               <span className="font-bold text-xl">LabConnect</span>
@@ -54,7 +54,8 @@ export default function MainNavigation() {
                     key={item.name}
                     to={item.href}
                     className={({ isActive }) =>
-                      `text-2xl font-bold hover:underline ${isActive ? "underline" : ""
+                      `text-2xl font-bold transition duration-175 hover:scale-115 ${
+                        isActive ? "underline scale-115" : ""
                       }`
                     }
                   >

diff --git a/src/shared/components/Navigation/StickyFooter.tsx b/src/shared/components/Navigation/StickyFooter.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import { Link } from "react-router-dom";
 import { useAuth } from "../../../context/AuthContext.tsx";
-import logo from "../../../images/LabConnect_Logo-removebg-preview.png";
+import logo from "../../../images/simple_logo-transparent.png";
 
 export default function StickyFooter() {
   const { auth } = useAuth();
@@ -27,7 +27,7 @@ export default function StickyFooter() {
             <img
               src={logo}
               alt="LabConnect Logo"
-              className="h-16 w-auto mr-2 filter brightness-0 invert"
+              className="pr-3 pl-5 h-16 w-auto mr-2 filter brightness-0 invert"
             />
           </Link>
           <span className="font-bold text-xl">LabConnect</span>
@@ -39,7 +39,7 @@ export default function StickyFooter() {
               <Link
                 key={index}
                 to={link.to}
-                className="hover:underline text-2xl font-bold"
+                className="transition duration-175 hover:scale-115 text-2xl font-bold"
               >
                 {link.label}
               </Link>

diff --git a/src/shared/components/Profile/ProfileOpportunities.tsx b/src/shared/components/Profile/ProfileOpportunities.tsx
@@ -29,6 +29,7 @@ export default function ProfileOpportunities({ id, staff }: { id: string, staff:
       {id &&
         Array.isArray(opportunities) &&
         opportunities.map((opportunity) => (
+
           <LargeTextCard
             to={`/post/${opportunity.id}`}
             title={opportunity.title}
@@ -43,7 +44,7 @@ export default function ProfileOpportunities({ id, staff }: { id: string, staff:
 
   return (
     <div>
-      <h1>Posted Opportunties</h1>
+      <h1 className="pt-10 pb-2 text-xl">Posted Opportunities:</h1>
       {opportunities !== null ? opportunityList : "Loading..."}
       {opportunities === "no response" && "No Opportunities Found"}
     </div>

diff --git a/src/shared/components/UIElements/LargeTextCard.tsx b/src/shared/components/UIElements/LargeTextCard.tsx
@@ -11,12 +11,12 @@ interface LargeTextCardProps {
 
 const LargeTextCard = ({ to, title, due, pay, credits }: LargeTextCardProps) => {
   return (
-    <Link to={to} className="no-underline">
-      <div className="min-h-48 max-h-48 duration-300 w-56 p-1 bg-base-100 card card-compact hover:shadow-md">
-        <div className="card-body">
+    <Link to={to} className="p-1 transition hover:scale-105">
+      <div className="border-1 border-gray-200 min-h-48 max-h-48 duration-300 w-56 p-1 bg-base-100 card card-compact rounded-2xl hover:shadow-md">
+        <div className="card-body p-2 pl-4">
           <h2
             className={`${title.length > 100 ? "text-sm" : "text-lg font-bold"
-              }  p-0 m-0`}
+              } m-0`}
           >
             {title}
           </h2>

diff --git a/src/shared/pages/404.tsx b/src/shared/pages/404.tsx
@@ -9,7 +9,7 @@ const PageNotFound = () => {
       <p className="text-4xl text-center pt-20">Whoops!</p>
       <p className="text-xl text-center pt-8">It looks like that page couldn&apos;t be reached. Please click the link below to return to LabConnect or try refreshing the page</p>
       <section className="pt-8 flex justify-center">
-        <Link to="/" className="btn btn-primary w-1/5 text-gray-200 bg-blue-600 hover:bg-blue-900 focus:bg-blue-900">Home</Link>
+        <Link to="/" className="btn btn-primary w-1/5 text-gray-200 bg-blue-600 transition duration-175 hover:brightness-85 focus:brightness-85">Home</Link>
       </section>
     </>
   );