From 23cfb187feb0ca932b8f2811a34bdb252c21b72c Mon Sep 17 00:00:00 2001
From: "cjt002@ucsd.edu" <64194102+angelatsai1214@users.noreply.github.com>
Date: Mon, 29 Jul 2024 00:18:01 -0700
Subject: [PATCH] styling fixes

---
 package-lock.json                     | 12 ++++++------
 package.json                          |  2 +-
 src/components/Header/index.less      |  5 +++++
 src/components/Header/index.tsx       |  4 ++--
 src/components/MainFooter/index.tsx   | 16 ++++++++++++++--
 src/components/ProjectCard/index.less | 12 ++++++------
 src/pages/AboutPage/index.less        |  2 +-
 src/pages/AboutPage/index.tsx         |  6 +++---
 src/pages/CompetitionsPage/index.tsx  |  2 +-
 src/pages/EventsPage/index.tsx        |  4 ++++
 src/pages/MainPage/index.tsx          |  8 +++-----
 src/pages/ProjectsPage/index.tsx      |  2 +-
 12 files changed, 47 insertions(+), 28 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index 82f957d..125f35d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -29,7 +29,7 @@
         "react-icons": "^4.10.1",
         "react-remark": "^2.1.0",
         "react-router-dom": "^5.1.2",
-        "react-scripts": "^5.0.0"
+        "react-scripts": "^5.0.1"
       },
       "devDependencies": {
         "@babel/plugin-proposal-private-property-in-object": "^7.21.11",
@@ -16134,9 +16134,9 @@
       "integrity": "sha512-24e6ynE2H+OKt4kqsOvNd8kBpV65zoxbA4BVsEOB3ARVWQki/DHzaUoC5KuON/BiccDaCCTZBuOcfZs70kR8bQ=="
     },
     "node_modules/react-scripts": {
-      "version": "5.0.0",
-      "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.0.tgz",
-      "integrity": "sha512-3i0L2CyIlROz7mxETEdfif6Sfhh9Lfpzi10CtcGs1emDQStmZfWjJbAIMtRD0opVUjQuFWqHZyRZ9PPzKCFxWg==",
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-5.0.1.tgz",
+      "integrity": "sha512-8VAmEm/ZAwQzJ+GOMLbBsTdDKOpuZh7RPs0UymvBR2vRk4iZWCskjbFnxqjrzoIvlNNRZ3QJFx6/qDSi6zSnaQ==",
       "dependencies": {
         "@babel/core": "^7.16.0",
         "@pmmmwh/react-refresh-webpack-plugin": "^0.5.3",
@@ -16154,7 +16154,7 @@
         "dotenv": "^10.0.0",
         "dotenv-expand": "^5.1.0",
         "eslint": "^8.3.0",
-        "eslint-config-react-app": "^7.0.0",
+        "eslint-config-react-app": "^7.0.1",
         "eslint-webpack-plugin": "^3.1.1",
         "file-loader": "^6.2.0",
         "fs-extra": "^10.0.0",
@@ -16171,7 +16171,7 @@
         "postcss-preset-env": "^7.0.1",
         "prompts": "^2.4.2",
         "react-app-polyfill": "^3.0.0",
-        "react-dev-utils": "^12.0.0",
+        "react-dev-utils": "^12.0.1",
         "react-refresh": "^0.11.0",
         "resolve": "^1.20.0",
         "resolve-url-loader": "^4.0.0",
diff --git a/package.json b/package.json
index fd9931a..8238044 100644
--- a/package.json
+++ b/package.json
@@ -23,7 +23,7 @@
     "react-icons": "^4.10.1",
     "react-remark": "^2.1.0",
     "react-router-dom": "^5.1.2",
-    "react-scripts": "^5.0.0"
+    "react-scripts": "^5.0.1"
   },
   "scripts": {
     "start": "react-app-rewired start",
diff --git a/src/components/Header/index.less b/src/components/Header/index.less
index 6caa26c..74f9c7c 100644
--- a/src/components/Header/index.less
+++ b/src/components/Header/index.less
@@ -83,6 +83,11 @@
       p {
         font-weight: @semi-bold;
       }
+
+      h4 {
+        font-weight: @semi-bold;;
+        color: white;
+      }
   
     }
   }
diff --git a/src/components/Header/index.tsx b/src/components/Header/index.tsx
index 4d5735a..04362a3 100644
--- a/src/components/Header/index.tsx
+++ b/src/components/Header/index.tsx
@@ -157,11 +157,11 @@ function Header() {
                     onClick={() => {
                       logoutUser();
                       setUser(defaultUser);
-                      message.success('Logged out');
+                      
                       history.push('/');
                     }}
                   >
-                    <p>Login</p>
+                    <h4>Login</h4>
                   </Button>
                 </Link>
               )}
diff --git a/src/components/MainFooter/index.tsx b/src/components/MainFooter/index.tsx
index 508a8cd..440d60c 100644
--- a/src/components/MainFooter/index.tsx
+++ b/src/components/MainFooter/index.tsx
@@ -3,10 +3,21 @@ import React from 'react';
 import './index.less';
 import { AiOutlineLink } from 'react-icons/ai';
 import { BiLogoInstagram, BiLogoDiscord } from 'react-icons/bi';
-const { Footer } = Layout;
+import '../../newStyles/components.less'
+const { Footer, Content } = Layout;
 
-const MainFooter = () => {
+interface MainFooterProps {
+  isMainPage: boolean;
+}
+
+// const MainFooter = (isMainPage: boolean) => {
+const MainFooter: React.FC<MainFooterProps> = ({ isMainPage }) => {
   return (
+    <>
+    <Content>
+      <div className=" gradient-bar"></div>
+    </Content>
+    {/* <Footer className={`mainFooter ${isMainPage ? '' : 'gradient-bar'}`}> */}
     <Footer className="mainFooter">
       <Row className="splitRow">
         <Col className="infoText">
@@ -110,6 +121,7 @@ const MainFooter = () => {
 
       <h3>ACM AI at UCSD 2023</h3>
     </Footer>
+    </>
   );
 };
 
diff --git a/src/components/ProjectCard/index.less b/src/components/ProjectCard/index.less
index e5fa31b..587d48f 100644
--- a/src/components/ProjectCard/index.less
+++ b/src/components/ProjectCard/index.less
@@ -9,7 +9,7 @@
   flex-direction: row;
   align-items: center;
   
-
+  
   .projectQuarter {
     font-weight: @semi-bold;
     margin-left: 1rem;
@@ -19,10 +19,8 @@
 
   .ProjectCard {
     border: none;
-
-    @media screen and (max-width: @md) {
-      height: 100% !important/* Adjusted width for smaller screens */
-    }
+    overflow: scroll;
+    height:50vh !important;
 
     .title {
       font-weight: @semi-bold;
@@ -38,6 +36,7 @@
     .descriptionBox {
       display: flex;
       align-items: center;
+      flex-grow: 1;
       justify-content: flex-start;
       border-radius: 10px;
       margin: 1rem 0 2rem 0;
@@ -46,7 +45,7 @@
       /* webkit attributes supported in 93% of all browsers*/
       -webkit-line-clamp: 2; /* Limit the number of lines to 2 */
       -webkit-box-orient: vertical;
-      overflow: hidden;
+      height:100%;
       p {
         margin: 0;
         white-space: normal;
@@ -152,6 +151,7 @@
     .description {
       margin: 1rem;
     }
+    
 
   }
 
diff --git a/src/pages/AboutPage/index.less b/src/pages/AboutPage/index.less
index e693004..1a8e924 100644
--- a/src/pages/AboutPage/index.less
+++ b/src/pages/AboutPage/index.less
@@ -155,6 +155,7 @@
       }
 
       h4 {
+        margin-top: 1rem;
         font-weight: @semi-bold;
       }
 
@@ -210,7 +211,6 @@
           background: white;
           height: 35px;
           width: 35px;
-          box-shadow: 0px 3px 5px 1px rgba(189, 189, 189, 0.5);
         }
 
         a {
diff --git a/src/pages/AboutPage/index.tsx b/src/pages/AboutPage/index.tsx
index 5605de2..44323ce 100644
--- a/src/pages/AboutPage/index.tsx
+++ b/src/pages/AboutPage/index.tsx
@@ -241,7 +241,7 @@ function AboutPage() {
           />
         </Content>
 
-        <MainFooter />
+        <MainFooter isMainPage={false}/>
       </Content>
 
       {isDrawerVisible && (
@@ -265,7 +265,7 @@ function AboutPage() {
         >
           <div className="drawerContent">
             <Col>
-              <Row className="drawerHeader">
+              <Row className="drawerHeader" gutter={[16, { xs: 8, sm: 16, md: 24, lg: 32 }]}>
                 <img
                   style={{
                     marginRight: '1rem',
@@ -280,7 +280,7 @@ function AboutPage() {
                   alt={`profile of ${selectedPerson!!.name}`}
                 />
                 <Col className="titleBox">
-                  <Tag bordered={false} color={'error'}>
+                  <Tag bordered={false} color={'error'} >
                     {selectedPerson!!.role}
                   </Tag>
                   <h4>{selectedPerson!!.name}</h4>
diff --git a/src/pages/CompetitionsPage/index.tsx b/src/pages/CompetitionsPage/index.tsx
index 81971b0..b84e40c 100644
--- a/src/pages/CompetitionsPage/index.tsx
+++ b/src/pages/CompetitionsPage/index.tsx
@@ -349,7 +349,7 @@ function CompetitionsPage(props: any) {
           </div>
         </Content>
 
-        <MainFooter />
+        <MainFooter isMainPage={false}/>
       </Content>
     </DefaultLayout>
   );
diff --git a/src/pages/EventsPage/index.tsx b/src/pages/EventsPage/index.tsx
index a395124..6b9a2a5 100644
--- a/src/pages/EventsPage/index.tsx
+++ b/src/pages/EventsPage/index.tsx
@@ -87,6 +87,10 @@ function EventsPage(props: any) {
           ></Tabs>
         </Content>
 
+        <Content>
+          <div className=" gradient-bar"></div>
+        </Content>
+
         <Footer className="eventsFooter">
           <Row className="row">
             <Col>
diff --git a/src/pages/MainPage/index.tsx b/src/pages/MainPage/index.tsx
index 023f3fb..4a9062c 100644
--- a/src/pages/MainPage/index.tsx
+++ b/src/pages/MainPage/index.tsx
@@ -33,7 +33,7 @@ function MainPage() {
 
         <Content className="homeHeader">
           <div className="homeHeaderContent">
-            <h1 className="homeTitle">ACM AI</h1>
+            <h1 className="homeTitle">ACM AI<br></br>at UC San Diego</h1>
             <h4>
               We aspire to inspire the next generation of AI advocates,
               engineers, and scientists.
@@ -185,11 +185,9 @@ function MainPage() {
           </div>
         </Content>
 
-        <Content>
-          <div className="homeBottomBar"></div>
-        </Content>
+        
 
-        <MainFooter />
+        <MainFooter isMainPage={true} />
       </Content>
     </DefaultLayout>
   );
diff --git a/src/pages/ProjectsPage/index.tsx b/src/pages/ProjectsPage/index.tsx
index 37ecd95..d7673d3 100644
--- a/src/pages/ProjectsPage/index.tsx
+++ b/src/pages/ProjectsPage/index.tsx
@@ -184,7 +184,7 @@ function ProjectsPage() {
           </Content>
         </Content>
 
-        <MainFooter />
+        <MainFooter isMainPage={false}/>
       </Content>
     </DefaultLayout>
   );