initial project panel and updated few errors

sravtall · Aug 21, 2023 · f6a6124 · f6a6124
1 parent 6fd6b26
commit f6a6124
Show file tree

Hide file tree

Showing 8 changed files with 72 additions and 13 deletions.
diff --git a/website-current/src/components/MainPage/IntroPanel/IntroPanelUtils.jsx b/website-current/src/components/MainPage/IntroPanel/IntroPanelUtils.jsx
@@ -1 +1 @@
-export const MainPageIntroduction = `hello. i'm sravan tallapaka, currently studying computer science at the university of california, irvine. i wouldn't consider myself to be a genius, but tackling each unique yet exciting problem brings a sense of fulfillment in this journey of exploring computer science. luckily, as a voracious eater, this great hunger draws a parallel to learning a pleathora of concepts, stemming from fundamental ideas to modern views. maybe i'm being a bit too verbose here, but to put it shortly, i enjoy cs (lmao).`;
+export const MainPageIntroduction = `hello. i'm sravan tallapaka, currently studying computer science at the university of california, irvine. i wouldn't consider myself to be a genius, but tackling each unique yet exciting problem brings a sense of fulfillment in this journey of exploring computer science. luckily, as a voracious eater, this great hunger draws a parallel to learning a plethora of concepts, stemming from fundamental ideas to modern views. maybe i'm being a bit too verbose here, but to put it shortly, i enjoy cs (lmao).`;
diff --git a/website-current/src/components/MainPage/InvolvementPanel/InvolvementPanel.jsx b/website-current/src/components/MainPage/InvolvementPanel/InvolvementPanel.jsx
@@ -17,7 +17,7 @@ const InvolvementPanel = ({ name, pos, time, desc }) => {
         </div>
         <div className={styles.involvement_desc}>
           <ul>
-            {desc.map((d, index) => (
+            {desc?.map((d, index) => (
               <li key={index}>{d}</li>
             ))}
           </ul>

diff --git a/website-current/src/components/MainPage/InvolvementPanel/InvolvementPanel.module.css b/website-current/src/components/MainPage/InvolvementPanel/InvolvementPanel.module.css
@@ -35,6 +35,6 @@ h6 {
   font-weight: normal;
 }
 
-ul {
+.involvement_desc ul {
   direction: rtl;
 }
diff --git a/website-current/src/components/MainPage/ProjectPanel/ProjectPanel.jsx b/website-current/src/components/MainPage/ProjectPanel/ProjectPanel.jsx
@@ -1,12 +1,22 @@
 import { React } from "react";
 
-const ProjectPanel = () => {
+import styles from "./ProjectPanel.module.css";
+
+const ProjectPanel = ({ name, desc }) => {
   return (
     <div>
-      <h3>Project Panel</h3>
-      <h4>Project Name</h4>
-      <h6>Link if applicable</h6>
-      <p>Description</p>
+      <div className={styles.container}>
+        <div className={styles.project_name}>
+          <h4>{name}</h4>
+        </div>
+        <div className={styles.project_desc}>
+          <ul>
+            {desc?.map((d, index) => (
+              <li key={index}>{d}</li>
+            ))}
+          </ul>
+        </div>
+      </div>
     </div>
   );
 };

diff --git a/website-current/src/components/MainPage/ProjectPanel/ProjectPanel.module.css b/website-current/src/components/MainPage/ProjectPanel/ProjectPanel.module.css
@@ -0,0 +1,22 @@
+.container {
+  border: 1px solid black;
+
+  text-align: left;
+  width: 100%;
+  margin-bottom: 5px;
+}
+
+.project_name {
+  font-size: 2em;
+  margin: auto;
+  padding: 5px;
+}
+
+h4 {
+  margin: 0;
+  font-weight: normal;
+}
+
+.project_desc ul {
+  direction: ltr;
+}
diff --git a/website-current/src/pages/MainPage/MainPage.jsx b/website-current/src/pages/MainPage/MainPage.jsx
@@ -5,7 +5,7 @@ import IntroPanel from "../../components/MainPage/IntroPanel/IntroPanel.jsx";
 import InvolvementPanel from "../../components/MainPage/InvolvementPanel/InvolvementPanel.jsx";
 import ProjectPanel from "../../components/MainPage/ProjectPanel/ProjectPanel.jsx";
 
-import { Info } from "./MainPageUtils.jsx";
+import { Involvements, Projects } from "./MainPageUtils.jsx";
 import styles from "./MainPage.module.css";
 
 const MainPage = () => {
@@ -14,7 +14,7 @@ const MainPage = () => {
       <NavBar />
       <IntroPanel />
       <div className={styles.involvements}>
-        {Info.map((involvement, index) => (
+        {Involvements.map((involvement, index) => (
           <InvolvementPanel
             key={index}
             name={involvement.name}
@@ -24,7 +24,11 @@ const MainPage = () => {
           />
         ))}
       </div>
-      <ProjectPanel />
+      <div className={styles.projects}>
+        {Projects.map((project, index) => (
+          <ProjectPanel key={index} name={project.name} desc={project.desc} />
+        ))}
+      </div>
     </div>
   );
 };

diff --git a/website-current/src/pages/MainPage/MainPage.module.css b/website-current/src/pages/MainPage/MainPage.module.css
@@ -1,5 +1,11 @@
 .involvements {
-  width: 75vw;
+  width: 75%;
+  margin: auto;
+  padding: 0;
+}
+
+.projects {
+  width: 75%;
   margin: auto;
   padding: 0;
 }
diff --git a/website-current/src/pages/MainPage/MainPageUtils.jsx b/website-current/src/pages/MainPage/MainPageUtils.jsx
@@ -1,4 +1,4 @@
-export const Info = [
+export const Involvements = [
   {
     name: "Experian",
     pos: "Consumer Information Services Intern",
@@ -21,3 +21,20 @@ export const Info = [
     ],
   },
 ];
+
+export const Projects = [
+  {
+    name: "Test project",
+    desc: [
+      "djfbidjfhodhfjdbfjkdbfdjk djkfjkd  dfkdjfh dkdjfh kdj jkdfbd dj fdkjkdb dk",
+      "this project does this this and this wow wow wow",
+    ],
+  },
+  {
+    name: "Test project2",
+    desc: [
+      "djfbidjfhodhfjdbfjkdbfdjk djkfjkd  dfkdjfh dkdjfh kdj jkdfbd dj fdkjkdb dk",
+      "this project does this this and this wow wow wow but 2",
+    ],
+  },
+];