Manas/officercards

src/components/ImageProjectCard.tsx

@@ -14,7 +14,6 @@ interface Props {
 
     onOpenPopup : () => void;
 
-    key: number;
 }
 
 const ImageProjectCard = forwardRef<HTMLDivElement, Props>((props : Props, ref) => {

src/components/JoinUs.tsx

@@ -0,0 +1,29 @@
+function JoinUs() {
+    return (
+        <section className='box2 box2-override' style={{ marginTop: '-1px' }}>
+        <div className='box1_5-textLeft' id="aboutus-howtoJoin"> How to join us! </div>
+        <div className='joinInstructions'>
+          <div>Feel free to drop in on one of our meetings!</div>
+          <div>
+            Join our discord server to and reach out to one of our officers to get more information!
+          </div>
+          <div>
+            <a href='https://discord.gg/tgbvpCjNgV' target={'_blank'}>
+              {/* <img className='discordLogo' src={discordPng} /> */}
+              <svg className='discordSVG'>
+                <defs>
+                  <style>{`.cls-1{fill:#fff;}`}</style>
+                </defs>
+                <path className="cls-1"
+                  d="M107.7,8.07A105.15,105.15,0,0,0,81.47,0a72.06,72.06,0,0,0-3.36,6.83A97.68,97.68,0,0,0,49,6.83,72.37,72.37,0,0,0,45.64,0,105.89,105.89,0,0,0,19.39,8.09C2.79,32.65-1.71,56.6.54,80.21h0A105.73,105.73,0,0,0,32.71,96.36,77.7,77.7,0,0,0,39.6,85.25a68.42,68.42,0,0,1-10.85-5.18c.91-.66,1.8-1.34,2.66-2a75.57,75.57,0,0,0,64.32,0c.87.71,1.76,1.39,2.66,2a68.68,68.68,0,0,1-10.87,5.19,77,77,0,0,0,6.89,11.1A105.25,105.25,0,0,0,126.6,80.22h0C129.24,52.84,122.09,29.11,107.7,8.07ZM42.45,65.69C36.18,65.69,31,60,31,53s5-12.74,11.43-12.74S54,46,53.89,53,48.84,65.69,42.45,65.69Zm42.24,0C78.41,65.69,73.25,60,73.25,53s5-12.74,11.44-12.74S96.23,46,96.12,53,91.08,65.69,84.69,65.69Z" />
+              </svg>
+            </a>
+          </div>
+        </div>
+
+      </section>
+    )
+
+}
+
+export default JoinUs

src/components/OfficerCards.tsx

@@ -11,7 +11,6 @@ interface Props {
   linkedIn?: string;
   email?: string;
   bio: string;
-  topAlignImage: boolean;
 }
 
 
@@ -53,12 +52,7 @@ function OfficerCards(props: Props) {
     <div ref={hoverRef} className={`baseOfficerCard ${isDrawerOpen ? 'open' : ''}`} onClick={handleClick}>
       <div className='officerCardOverlay'>
         <div className="imageContainer">
-          {props.topAlignImage ?
-          <img src={props.img} className="officerImageTopAlign"/>
-          :
-          <img src={props.img} className="officerImage"/>  
-        }
-
+          <img src={props.img} className="officerImage"/>
         </div>
         <div className="officerInformation">
           <div className="officerName">{props.name}</div>
@@ -73,7 +67,7 @@ function OfficerCards(props: Props) {
             display: 'flex',
             flexDirection: 'column',
             justifyContent: 'space-between',
-            height: '14rem',
+            height: '20rem',
           }}>
             <div className='cardDrawerContent'>
               {props.bio}

src/pages/Homepage.tsx

@@ -13,6 +13,7 @@ import headerImage_1 from '../static/images/homepage/drone.webp';
 import headerImage_2 from '../static/images/homepage/eclair_group.webp';
 import CalendarEmbed from '../components/CalendarEmbed';
 import CurrentSponsorRow from '../components/CurrentSponsorRow';
+import JoinUs from '../components/JoinUs';
 
 function Homepage() {
   const [screenSize, setScreenSize] = useState(getCurrentDimension());
@@ -75,7 +76,6 @@ function Homepage() {
 
     <>
 
-      {/* Section 1 */}
       <section >
         <div className='box2' style={{
           paddingTop: '15em',
@@ -109,15 +109,12 @@ function Homepage() {
         </div>
 
       </section>
-
-      {/* Section 2 */}
       <section className='box2 box2-override'>
         <div className='box1_5-textLeft' id="informationHeading"> Geared Toward Helping Students Pursue Their Passion for Robotics </div>
         <div className='box1_5-textRight' id="informationSubtext">
           The Engineering and Computational Learning of Artificial Intelligence in Robotics (ECLAIR) is a club at UT Austin dedicated to helping all robot-loving students to transform their passionate robotics ideas into reality. We provide the robotics parts and teach members state-of-the-art machine learning techiniques such as neural networks and reinforcement learning to give students the ability to pursue their robotics projects. If you have a cool robot you want to build, come join us!
         </div>
       </section>
-      {/* Section 3*/}
       <section className='box2 box2-override2'>
         <div className='box1_5-textRight' id="infoImageContainer">
           <img className="infoImage" src={headerImage_1}></img>
@@ -133,7 +130,6 @@ function Homepage() {
         </div>
       </section>
 
-      {/* Section  4*/}
       <section className='box2 box2-override3'>
         <div className='box2-encloser'>
           <div className='box1_5-textLeft' id='boldText'>
@@ -147,19 +143,22 @@ function Homepage() {
           <img className="infoImage" src={headerImage_2}></img>
         </div>
       </section>
+
 
-      {/* Section 5*/}
+      <JoinUs/>
+
       <section className='box2 box2-override4'
         style={{
           background: `url(${wavesHeader})  center center no-repeat `,
-          backgroundSize: 'cover',
+          backgroundSize: 'auto 100%',
         }}
       >
         <div className="custom-shape-divider-top-1681028846" style={{ marginTop: '-1px' }}>
-          <svg data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120" preserveAspectRatio="none">
-            <path d="M0,0V46.29c47.79,22.2,103.59,32.17,158,28,70.36-5.37,136.33-33.31,206.8-37.5C438.64,32.43,512.34,53.67,583,72.05c69.27,18,138.3,24.88,209.4,13.08,36.15-6,69.85-17.84,104.45-29.34C989.49,25,1113-14.29,1200,52.47V0Z" opacity=".25" className="shape-fill"></path>
-            <path d="M0,0V15.81C13,36.92,27.64,56.86,47.69,72.05,99.41,111.27,165,111,224.58,91.58c31.15-10.15,60.09-26.07,89.67-39.8,40.92-19,84.73-46,130.83-49.67,36.26-2.85,70.9,9.42,98.6,31.56,31.77,25.39,62.32,62,103.63,73,40.44,10.79,81.35-6.69,119.13-24.28s75.16-39,116.92-43.05c59.73-5.85,113.28,22.88,168.9,38.84,30.2,8.66,59,6.17,87.09-7.5,22.43-10.89,48-26.93,60.65-49.24V0Z" opacity=".5" className="shape-fill"></path>
-            <path d="M0,0V5.63C149.93,59,314.09,71.32,475.83,42.57c43-7.64,84.23-20.12,127.61-26.46,59-8.63,112.48,12.24,165.56,35.4C827.93,77.22,886,95.24,951.2,90c86.53-7,172.46-45.71,248.8-84.81V0Z" className="shape-fill"></path>
+          <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120" preserveAspectRatio="none">
+            <path
+              d="M0,0V46.29c47.79,22.2,103.59,32.17,158,28,70.36-5.37,136.33-33.31,206.8-37.5C438.64,32.43,512.34,53.67,583,72.05c69.27,18,138.3,24.88,209.4,13.08,36.15-6,69.85-17.84,104.45-29.34C989.49,25,1113-14.29,1200,52.47V0Z" opacity=".25" fill="#191e28"/>
+            <path d="M0,0V15.81C13,36.92,27.64,56.86,47.69,72.05,99.41,111.27,165,111,224.58,91.58c31.15-10.15,60.09-26.07,89.67-39.8,40.92-19,84.73-46,130.83-49.67,36.26-2.85,70.9,9.42,98.6,31.56,31.77,25.39,62.32,62,103.63,73,40.44,10.79,81.35-6.69,119.13-24.28s75.16-39,116.92-43.05c59.73-5.85,113.28,22.88,168.9,38.84,30.2,8.66,59,6.17,87.09-7.5,22.43-10.89,48-26.93,60.65-49.24V0Z" opacity=".5" fill="#191e28"/>
+            <path d="M0,0V5.63C149.93,59,314.09,71.32,475.83,42.57c43-7.64,84.23-20.12,127.61-26.46,59-8.63,112.48,12.24,165.56,35.4C827.93,77.22,886,95.24,951.2,90c86.53-7,172.46-45.71,248.8-84.81V0Z" fill="#191e28"/>
           </svg>
         </div>
         <div className="animatedBlob"> {/* This entire div is just a vector that contains the blob, a rectangle, and text at the bottom of the homepage */}
@@ -194,7 +193,6 @@ function Homepage() {
         </div>
       </section>
 
-      {/* Section 6*/}
       <section className='box2 box2-override4'
         style={{
           backgroundSize: 'cover',

src/pages/Projects.tsx

@@ -124,7 +124,7 @@ function Projects() {
       desc: 'We are automating PCR, a medical technique used to duplicate DNA. We have most individual components working, so this semester, we will focus on putting it all together, testing it with PCR, and writing a research paper to publish our robot',
       git:"https://github.com/ECLAIR-Robotics/PCR_Automation", 
       gantt:"https://docs.google.com/spreadsheets/d/1qEEfA078V_SaOaCuu-pih-EUJhn9BdbRNVKUYMlfKlY/edit?usp=sharing",
-      finished:0,
+      finished:1,
       video: pcrVid,
       SliderData : [
         {
@@ -150,7 +150,7 @@ function Projects() {
       desc: 'Chess Teacher is a robot that is designed to not only play a game of chess, but also teach the player how to improve, and adjust its style to allow the player to maximize their learning opportunities. We use an overhead camera coupled with computer vision to enable the robot to have an accurate understanding of the game, while using our own in house chess engine to play the game - enabling the robot to have a comprehensive understanding over every position.',
       git:"https://github.com/ECLAIR-Robotics/Chess_Teacher", 
       gantt:"https://docs.google.com/spreadsheets/d/1CbTH5hqcQgmXZnDkoqhe9yYVnaWjdlhSyqxfz_0mcEA/edit?usp=sharing",
-      finished:0,
+      finished:1,
       video: chessVid,
       SliderData : [
         {
@@ -274,7 +274,7 @@ function Projects() {
       id: 7,
       img : carP,
       name:'Autonomous Car', 
-      lName:"Sahana Ganapathy, Nikhil Kalidasu", 
+      lName:"", 
       members:"Sahana, Nikhil, Ayaan, Jerry, Vinaenae, Cameron, Alexzander, Marcus, Miles, Tommy, Masamu, Hannah",
       desc: 'The goal of the autonomous car project is to build a fully autonomous RC car that has support for natural language intake and feedback. Overall, we are trying to establish a greater bond of trust between the user and the car, something that the industry is still working on today.',
       git: "https://github.com/ECLAIR-Robotics/nlp-car", 
@@ -289,7 +289,7 @@ function Projects() {
       id: 8,
       img : crackleP,
       name:'CRACKLE', 
-      lName:"Tanay Garg", 
+      lName:"", 
       members:"Tanay, Manas, Leo, Yash, Gaurav, Tanay, Manav, Shalani, Ayaan, Isabella, Keshav, Sanskar",
       desc: "Crackle's goal is to emulate DUM-E from Iron Man. This means fully resolving voice commands spoken into dynamically generated plans using GPT. The finished product will be able to perform any physically possible task requested by a user",
       git:"https://github.com/ECLAIR-Robotics/crackle", 
@@ -303,7 +303,7 @@ function Projects() {
       id: 9,
       img : texelArtsP,
       name:'Texel Arts', 
-      lName:"Umer Khan",
+      lName:"",
       members:"Kevin, Anna, Umer",
       desc: 'The Texel Arts project is a machine learning system that takes videos and transforms them into animation files applied on given rigs. The final goal is an online library of animations that can be readily downloaded, where processed animations are continuously added to the website',
       git:"", 
@@ -316,7 +316,7 @@ function Projects() {
       id: 10,
       img : traceP,
       name: "TRACE",
-      lName: "Arnav Joshi, Rizky Pratama",
+      lName: "",
       members: "Arnav, Rizky, Chris, Dan, Rishab, Isabella, Cameron",
       desc: "TRACE is a project to track and control the position of a ball on a tilting platform. The goals of this project are to exhibit a basic control system with two degrees of freedom that also implements computer vision. This will help develop member skills with CV, controls, simulation, and hardware design.",
       git: "",
@@ -331,7 +331,7 @@ function Projects() {
       img: hydroponicsP,
       name: "Hydroponics",
       lName: "Arnav Joshi",
-      members: "Isabella, Sanskar, Markus",
+      members: "Isabella, Sanskar, Markus, Anisha",
       desc: "We aim to create an automated hydroponic garden.",
       git: "",
       gantt: "https://www.notion.so/Autonomous-Hydroponics-de7db5da18214e42a170f000432b0deb",