updated the frosh 2t4 logo, ocomm exec photos on about us page, and c…

…hanged font

client/index.html

@@ -4,7 +4,7 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>F!rosh Week</title>
-    <link rel="icon" type="image/x-icon" href="/src/assets/logo/main-frosh-logo.ico">
+    <link rel="icon" type="image/x-icon" href="/src/assets/logo/main-logo.png">
     <meta name="description" content="The University of Toronto's Engineering Student's Orientation Week Event">
     <meta name="keywords" content="F!rosh Week, UofT Engineering, Engineering Orientation, F!rosh Week UofT, Frosh Week, Frosh Week UofT, University of Toronto, University of Toronto Orientation">
     <meta name="author" content="Orientation Committee">

client/src/App.scss

@@ -1,10 +1,11 @@
 @import './scssStyles/_mixins.scss';
+@import url('https://fonts.googleapis.com/css2?family=Almendra+SC&display=swap');
 
 * {
   box-sizing: border-box;
   margin: 0;
   padding: 0;
-  font-family: 'Nunito', sans-serif;
+  font-family: 'Almendra SC', sans-serif;
   @include devices(tablet) {
     user-select: none;
   }
@@ -14,6 +15,11 @@
   --dark-mode: true;
 }
 
+@font-face {
+  font-family: 'LittleWitches';
+  src: url('../assets/fonts/LittleWitches-K7r7y.otf') format('opentype');
+}
+
 @font-face {
   font-family: 'Inter';
   font-style: normal;
@@ -46,15 +52,15 @@ html {
   background-color: var(--page-bg);
   scroll-behavior: smooth;
   overflow-x: hidden;
-  font-family: 'Nunito', sans-serif;
+  font-family: 'Almendra SC', sans-serif;
 }
 
 h1,
 h2,
 h3,
 h4,
 h5 {
-  font-family: 'Nunito-Bold', sans-serif;
+  font-family: 'Almendra SC', serif;
   margin: 0px;
   padding: 0px;
 }

client/src/components/Navbar/Navbar.jsx

@@ -18,7 +18,7 @@ import MessageIconDefaultDarkMode from '../../assets/darkmode/navbar/message-sol
 
 import ProfileIcon from '../../assets/navbar/circle-user-solid-purple.svg';
 import ProfileIconDarkMode from '../../assets/darkmode/navbar/circle-user-solid-purple.svg';
-import MainFroshLogo from '../../assets/logo/frosh-draft-logo-2t4.svg';
+import MainFroshLogo from '../../assets/logo/main-logo.png';
 
 import { Link, useLocation } from 'react-router-dom';
 import { pages } from '../../util/pages';
@@ -204,26 +204,26 @@ const NavbarMobile = ({ isLoggedIn, froshInitials, isRegistered }) => {
                         <img
                           className="navbar-svg-icon"
                           alt={
-                            page.label === 'Home'
-                              ? 'home'
-                              : page.label === 'About'
-                              ? 'about'
+                            page.label === 'HOME'
+                              ? 'HOME'
+                              : page.label === 'ABOUT'
+                              ? 'ABOUT'
                               : page.label === 'FAQ'
-                              ? 'faq'
+                              ? 'FAQ'
                               : ''
                           }
                           src={
                             pathname === page.path
-                              ? page.label === 'Home'
+                              ? page.label === 'HOME'
                                 ? HomeIconPurple
-                                : page.label === 'About'
+                                : page.label === 'ABOUT'
                                 ? AboutIconPurple
                                 : page.label === 'FAQ'
                                 ? MessageIconPurple
                                 : {}
-                              : page.label === 'Home'
+                              : page.label === 'HOME'
                               ? HomeIconGrey
-                              : page.label === 'About'
+                              : page.label === 'ABOUT'
                               ? AboutIconGrey
                               : page.label === 'FAQ'
                               ? MessageIconGrey
@@ -234,26 +234,26 @@ const NavbarMobile = ({ isLoggedIn, froshInitials, isRegistered }) => {
                         <img
                           className="navbar-svg-icon"
                           alt={
-                            page.label === 'Home'
-                              ? 'home'
-                              : page.label === 'About'
-                              ? 'about'
+                            page.label === 'HOME'
+                              ? 'HOME'
+                              : page.label === 'ABOUT'
+                              ? 'ABOUT'
                               : page.label === 'FAQ'
-                              ? 'faq'
+                              ? 'FAQ'
                               : ''
                           }
                           src={
                             pathname === page.path
-                              ? page.label === 'Home'
+                              ? page.label === 'HOME'
                                 ? HomeIconHighlightDarkMode
-                                : page.label === 'About'
+                                : page.label === 'ABOUT'
                                 ? AboutIconHighlightDarkMode
                                 : page.label === 'FAQ'
                                 ? MessageIconHighlightDarkMode
                                 : {}
-                              : page.label === 'Home'
+                              : page.label === 'HOME'
                               ? HomeIconDefaultDarkMode
-                              : page.label === 'About'
+                              : page.label === 'ABOUT'
                               ? AboutIconDefaultDarkMode
                               : page.label === 'FAQ'
                               ? MessageIconDefaultDarkMode

client/src/pages/About/About.jsx

@@ -52,7 +52,7 @@ const PageAbout = () => {
 
 const AboutUsSection = () => {
   return (
-    <Header text="About Us">
+    <Header text="ABOUT US">
       <div className="aboutus-subsubcontainer">
         <div className="aboutus-image-container">
           <LazyLoadImage className="aboutus-image" src={ExecLogo} alt="logo"></LazyLoadImage>
@@ -286,7 +286,7 @@ const AboutUsExecTeam = () => {
 
 const tabs = [
   {
-    title: 'Exec Team',
+    title: 'EXEC TEAM',
     component: <AboutUsExecTeam />,
     active: true,
     wantToLoad: true,
@@ -316,7 +316,7 @@ const AboutUsTeamsTab = () => {
   const wantedTabs = tabs.filter((tab) => tab.wantToLoad);
 
   const [currentTab, setCurrentTab] = useState(
-    wantedTabs.length > 0 ? wantedTabs.at(0).title : 'Exec Team',
+    wantedTabs.length > 0 ? wantedTabs.at(0).title : 'EXEC TEAM',
   );
 
   let tabsCounter = 0;

client/src/pages/Home/Home.jsx

@@ -10,7 +10,7 @@ import { Link } from 'react-router-dom';
 
 import { Timeline } from '../../components/timeline/Timeline/Timeline';
 import { ImageCarousel } from '../../components/ImageCarousel/ImageCarousel';
-import MainFroshLogo from '../../assets/logo/frosh-draft-logo-2t4.svg';
+import MainFroshLogo from '../../assets/logo/main-logo.png';
 import 'react-slideshow-image/dist/styles.css';
 import { Slide } from 'react-slideshow-image';
 import { ScheduleComponent } from '../../components/schedule/ScheduleHome/ScheduleHome';

client/src/pages/Home/Home.scss

@@ -21,7 +21,7 @@
   text-align: center;
   object-fit: fill;
   height: 300px;
-  background-color: rgba(220, 191, 225, 0.8);
+  // background-color: rgba(220, 191, 225, 0.8);
   border-radius: 100px;
 
   @include devices(tablet) {

client/src/util/about/aboutus.jsx

@@ -1,6 +1,6 @@
 export const aboutUsInfo = [
   {
-    title: 'What is F!rosh Week?',
+    title: 'WHAT IS F!ROSH WEEK?',
     description: `
       F!rosh Week is a week-long orientation where students and faculty welcome over 1000 incoming students to the U of T Engineering Community! 
       Central to the experience at Skule™, F!rosh Week consists of engaging and exciting events designed to introduce students to the community, 
@@ -9,7 +9,7 @@ export const aboutUsInfo = [
     `,
   },
   {
-    title: 'What is SKULE™?',
+    title: 'WHAT IS SKULE™?',
     description: `
       Skule™ is the name of the University of Toronto's engineering community at the St. George campus. It is made up of about 5000 undergraduate students, 
       hundreds of graduate students, and a range of dedicated alumni. It is also home to hundreds of engineering clubs, athletics teams, design teams, 

client/src/util/about/execs.jsx

@@ -1,10 +1,10 @@
-import oc1Photo from '../../assets/about/execs/co-oc1.jpg';
-import oc2Photo from '../../assets/about/execs/co-oc2.jpg';
-import vcFinance from '../../assets/about/execs/vcfinance.jpg';
-import vcEvents1 from '../../assets/about/execs/vcevents1.jpg';
-import vcEvents2 from '../../assets/about/execs/vcevents2.jpg';
-import vcLeadership from '../../assets/about/execs/vcleadership.jpg';
-import vcMarketing from '../../assets/about/execs/vcmarketing.jpg';
+import oc1Photo from '../../assets/about/execs/Lily_pfp.png';
+import oc2Photo from '../../assets/about/execs/vedant_pfp.png';
+import vcFinance from '../../assets/about/execs/finance_pfp.png';
+import vcEvents1 from '../../assets/about/execs/vc-events_pfp.png';
+import vcEvents2 from '../../assets/about/execs/events_pfp.png';
+import vcLeadership from '../../assets/about/execs/leadership_pfp.png';
+import vcMarketing from '../../assets/about/execs/marketing_pfp.png';
 
 export const execInfo = {
   ocs: [