Merge pull request #82 from acm-ucr/dev

merge to main

.github/workflows/nextjs.yml

@@ -34,7 +34,7 @@ jobs:
  - name: Setup Node
  uses: actions/setup-node@v3
  with:
- node-version: "16"
+ node-version: "18"
  - name: Setup Pages
  uses: actions/configure-pages@v3
  with:

.github/workflows/pull-request.yaml

@@ -14,7 +14,7 @@ jobs:
  - name: Use Node.js
  uses: actions/setup-node@v3
  with:
- node-version: "16.14.2"
+ node-version: "18"
  - run: npm ci
  - run: npm run check
  lint:
@@ -26,7 +26,7 @@ jobs:
  - name: Use Node.js
  uses: actions/setup-node@v3
  with:
- node-version: "16.14.2"
+ node-version: "18"
  - run: npm ci
  - run: npm run eslint
  build:
@@ -38,6 +38,6 @@ jobs:
  - name: Use Node.js
  uses: actions/setup-node@v3
  with:
- node-version: "16.14.2"
+ node-version: "18"
  - run: npm ci
  - run: npm run build

package.json

@@ -14,11 +14,11 @@
  },
  "dependencies": {
  "bootstrap": "^5.3.0",
- "next": "^13.5.4",
+ "next": "^14.0.2",
  "react": "^18.2.0",
  "react-bootstrap": "^2.8.0",
  "react-dom": "^18.2.0",
- "react-icons": "^4.10.1"
+ "react-icons": "^4.11.0"
  },
  "devDependencies": {
  "autoprefixer": "^10.4.15",

src/app/board/page.js

@@ -1,5 +1,28 @@
+import { BOARD } from "../../data/mockBoard";
+import Board from "../../components/board/Board";
+import Title from "@/components/Title";
+
 const page = () => {
- return <div>page</div>;
+ return (
+ <div className="relative w-full flex flex-col items-center mt-14">
+ <div className="absolute w-1/2 aspect-square bg-ewb-blue-100/40 rounded-full -translate-y-14" />
+ <Title title="MEET THE TEAM" />
+ <div className="relative grid grid-cols-4 w-9/12 gap-8 mt-14">
+ {BOARD.map((item, index) => (
+ <Board
+ key={index}
+ name={item.name}
+ position={item.position}
+ grade={item.grade}
+ major={item.major}
+ links={item.links}
+ pronouns={item.pronouns}
+ picture={item.picture}
+ />
+ ))}
+ </div>
+ </div>
+ );
 };
 
 export default page;

src/app/page.js

@@ -1,14 +1,18 @@
 import About from "@/components/home/About";
 import Landing from "@/components/home/Landing";
 import Projects from "@/components/home/Projects";
-import WhyJoin from "@/components/home/Contacts";
+import WhyJoin from "@/components/home/WhyJoin";
+import Events from "@/components/home/Events";
+import Join from "@/components/home/Join";
 const Home = () => {
  return (
  <>
  <Landing />
  <About />
  <WhyJoin />
  <Projects />
+ <Events />
+ <Join />
  </>
  );
 };

src/app/projects/air-quality-system/page.js

@@ -1,5 +1,14 @@
+import AirQuality from "@/components/projects/ AirQuality";
+import Header from "@/components/projects/Header";
+import header from "../../../../public/images/airQualitySystem/AirQualitySystemHeader.webp";
+
 const page = () => {
- return <div>page</div>;
+ return (
+ <>
+ <Header img={header.src} title="Air Quality System" />
+ <AirQuality />
+ </>
+ );
 };
 
 export default page;

src/app/projects/costa-rica/page.js

@@ -1,7 +1,15 @@
 import React from "react";
+import CostaRica from "@/components/projects/CostaRica";
+import Header from "@/components/projects/Header";
+import header from "../../../../public/images/costaRica/CostaRicaHeader.webp";
 
 const page = () => {
- return <div>page</div>;
+ return (
+ <>
+ <Header img={header.src} title="Costa Rica Project" />
+ <CostaRica />
+ </>
+ );
 };
 
 export default page;

src/app/projects/tanzania/page.js

@@ -1,7 +1,14 @@
-import React from "react";
+import Tanzania from "@/components/projects/Tanzania";
+import Header from "@/components/projects/Header";
+import header from "../../../../public/images/tanzania/tanzaniaHeader.webp";
 
 const page = () => {
- return <div>page</div>;
+ return (
+ <>
+ <Header img={header.src} title="Project" />
+ <Tanzania />
+ </>
+ );
 };
 
 export default page;

src/components/ArrowLink.jsx

@@ -4,7 +4,7 @@ const ArrowLink = ({ text, link }) => {
  return (
  <Link
  href={link}
- className="no-underline text-ewb-blue-200 hover:text-ewb-blue-200 flex items-center hover:-translate-y-0.5 duration-300"
+ className="no-underline text-ewb-blue-200 hover:text-ewb-blue-200 flex items-center hover:-translate-y-0.5 duration-300 text-lg"
  >
  {text} <BiRightArrowAlt />
  </Link>

src/components/Footer.jsx

@@ -1,5 +1,39 @@
+import whiteLogo from "../../public/assets/whiteLogo.svg";
+import Image from "next/image";
+import Link from "next/link";
+import { ICONS } from "@/data/icons";
+import { LINKS } from "@/data/links";
+
 const Footer = () => {
- return <div>Footer</div>;
+ return (
+ <div className="w-full bg-ewb-blue-200 border-t-[20px] border-t-ewb-green pt-32 flex justify-between">
+ <div className="flex items-end m-3 gap-3 text-white font-bold text-xl w-1/2">
+ <Image src={whiteLogo} alt="EWB Logo" />
+ <p className="text-xs md:text-lg">EWB at UCR</p>
+ </div>
+
+ <div className="text-right text-white text-sm flex flex-col m-0 p-0 mx-4 w-1/2">
+ <div className="flex flex-row ml-20 self-end">
+ {LINKS.map((social, index) => (
+ <Link
+ key={index}
+ href={social.link}
+ className="no-underline text-white hover:text-ewb-white mx-1 flex flex-col items-center hover:-translate-y-0.5 duration-300"
+ >
+ <icons className="text-2xl">{ICONS[social.text]}</icons>
+ </Link>
+ ))}
+ </div>
+ <div className="py-2">
+ <div>900 University Ave</div>
+ <div>Riverside, CA 92521</div>
+ <div>United States</div>
+ <div>ewb.ucriverside@gmail.com</div>
+ <div>619-395-3534</div>
+ </div>
+ </div>
+ </div>
+ );
 };
 
 export default Footer;