HackMerced · trumanjchan · Jul 30, 2021 · Jul 30, 2021 · Jul 30, 2021
diff --git a/src/assets/images/sponsor-logos/1.png b/src/assets/images/sponsor-logos/1.png
diff --git a/src/assets/images/sponsor-logos/10.png b/src/assets/images/sponsor-logos/10.png
diff --git a/src/assets/images/sponsor-logos/11.png b/src/assets/images/sponsor-logos/11.png
diff --git a/src/assets/images/sponsor-logos/1Password.png b/src/assets/images/sponsor-logos/1Password.png
diff --git a/src/assets/images/sponsor-logos/2.png b/src/assets/images/sponsor-logos/2.png
diff --git a/src/assets/images/sponsor-logos/3.png b/src/assets/images/sponsor-logos/3.png
diff --git a/src/assets/images/sponsor-logos/4.png b/src/assets/images/sponsor-logos/4.png
diff --git a/src/assets/images/sponsor-logos/6.png b/src/assets/images/sponsor-logos/6.png
diff --git a/src/assets/images/sponsor-logos/7.png b/src/assets/images/sponsor-logos/7.png
diff --git a/src/assets/images/sponsor-logos/9.png → src/assets/images/sponsor-logos/ACM.png b/src/assets/images/sponsor-logos/9.png → src/assets/images/sponsor-logos/ACM.png
diff --git a/src/assets/images/sponsor-logos/ASUCM.png b/src/assets/images/sponsor-logos/ASUCM.png
diff --git a/src/assets/images/sponsor-logos/5.png → src/assets/images/sponsor-logos/Adobe.png b/src/assets/images/sponsor-logos/5.png → src/assets/images/sponsor-logos/Adobe.png
diff --git a/src/assets/images/sponsor-logos/Alumni.png b/src/assets/images/sponsor-logos/Alumni.png
diff --git a/src/assets/images/sponsor-logos/Citrus.png b/src/assets/images/sponsor-logos/Citrus.png
diff --git a/src/assets/images/sponsor-logos/CoolerMaster.png b/src/assets/images/sponsor-logos/CoolerMaster.png
diff --git a/src/assets/images/sponsor-logos/GoodDayChocolate.png b/src/assets/images/sponsor-logos/GoodDayChocolate.png
diff --git a/src/assets/images/sponsor-logos/GuayakiYerbaMate.png b/src/assets/images/sponsor-logos/GuayakiYerbaMate.png
diff --git a/src/assets/images/sponsor-logos/IT.png b/src/assets/images/sponsor-logos/IT.png
diff --git a/src/assets/images/sponsor-logos/InterviewCake.png b/src/assets/images/sponsor-logos/InterviewCake.png
diff --git a/src/assets/images/sponsor-logos/JetBrains.png b/src/assets/images/sponsor-logos/JetBrains.png
diff --git a/src/assets/images/sponsor-logos/MLH.png b/src/assets/images/sponsor-logos/MLH.png
diff --git a/src/assets/images/sponsor-logos/MakeSchool.png b/src/assets/images/sponsor-logos/MakeSchool.png
diff --git a/src/assets/images/sponsor-logos/MakeyMakey.png b/src/assets/images/sponsor-logos/MakeyMakey.png
diff --git a/src/assets/images/sponsor-logos/MercoCU.png b/src/assets/images/sponsor-logos/MercoCU.png
diff --git a/src/assets/images/sponsor-logos/MonsterEnergy.png b/src/assets/images/sponsor-logos/MonsterEnergy.png
diff --git a/src/assets/images/sponsor-logos/OSI.png b/src/assets/images/sponsor-logos/OSI.png
diff --git a/src/assets/images/sponsor-logos/8.png → src/assets/images/sponsor-logos/Replit.png b/src/assets/images/sponsor-logos/8.png → src/assets/images/sponsor-logos/Replit.png
diff --git a/src/assets/images/sponsor-logos/Sketch.png b/src/assets/images/sponsor-logos/Sketch.png
diff --git a/src/assets/images/sponsor-logos/12.png → src/assets/images/sponsor-logos/Snorkel.png b/src/assets/images/sponsor-logos/12.png → src/assets/images/sponsor-logos/Snorkel.png
diff --git a/src/assets/images/sponsor-logos/Stickermule.png b/src/assets/images/sponsor-logos/Stickermule.png
diff --git a/src/assets/images/sponsor-logos/UCANR.png b/src/assets/images/sponsor-logos/UCANR.png
diff --git a/src/assets/images/sponsor-logos/Vanguard.png b/src/assets/images/sponsor-logos/Vanguard.png
diff --git a/src/assets/images/sponsor-logos/VentureLab.png b/src/assets/images/sponsor-logos/VentureLab.png
diff --git a/src/assets/images/sponsor-logos/WolframLanguage.png b/src/assets/images/sponsor-logos/WolframLanguage.png
diff --git a/src/assets/images/sponsor-logos/ZuckerbergInitiative.png b/src/assets/images/sponsor-logos/ZuckerbergInitiative.png
diff --git a/src/pages/ContactUs/index.tsx b/src/pages/ContactUs/index.tsx
@@ -16,16 +16,12 @@ const ContactUs: FC = (): JSX.Element => {
                 <div className="contact-us__content">
                     <div className="contact-us__content__header">Ways to contact us</div>
                     <section className="contact-us__content__description">
-                        <a href="mailto:[email protected]?subject=HackMerced Questions&amp;body=Dear HackMerced,">
+                        <a className="hoverchange" href="mailto:[email protected]?subject=HackMerced Questions&amp;body=Dear HackMerced,">
                             <FontAwesomeIcon icon={faEnvelope} className="fa contact-us__content__description__icon" />
+                            <h4 className="contact-us__content__description__text">  
+                                Email us at [email protected]
+                            </h4>
                         </a>
-                        <h4 className="contact-us__content__description__text">
-                            Email us at&nbsp;
-                            <a href="mailto:[email protected]?subject=HackMerced Questions&amp;body=Dear HackMerced,">
-                                [email protected]
-                            </a>
-                        </h4>
-                        <br />
                         <FontAwesomeIcon icon={faUsers} className="fa contact-us__content__description__icon" />
                         <h4 className="contact-us__content__description__text">
                             Connect with our social medias: @hackmerced

diff --git a/src/pages/ContactUs/styles.scss b/src/pages/ContactUs/styles.scss
@@ -1,7 +1,6 @@
 .contact-us {
     flex-direction: column;
     justify-content: center;
-    padding-bottom: 2%;
     background-color: var(--background);
 
     @media only screen and (max-width: 900px), only screen and (max-height: 640px) {
@@ -16,7 +15,7 @@
             color: var(--text-color);
             font-weight: bolder;
             overflow: hidden;
-            padding: 1% 0% 1% 0%;
+            padding-top: 1%;
 
             @media (min-width: 768px) {
                 font-size: 2.5rem;
@@ -30,30 +29,32 @@
             align-items: center;
             justify-content: center;
             text-align: center;
-
             margin-bottom: 2rem;
 
-            &__text {
-                font-size: 20px;
-                text-align: center;
-                margin: 1% auto auto auto;
+            .hoverchange:hover {
                 color: var(--text-color);
-                text-align: center;
-                font-weight: normal;
+                background-color: #8FBC8F;
             }
 
             &__icon {
                 color: var(--orange);
                 font-size: 35px !important;
-                margin: 10px;
+            }
+
+            &__text {
+                font-size: 20px;
+                text-align: center;
+                color: var(--text-color);
+                text-align: center;
+                font-weight: normal;
             }
         }
 
         @media only screen and (max-width: 1024px), only screen and (max-height: 1366px) {
             //sized to an ipad pro
             padding-top: 2rem;
 
-            padding-bottom : 12rem;
+            padding-bottom: 10rem;
 
             &__header {
                margin-bottom: 2rem;

diff --git a/src/pages/SponsorUs/index.tsx b/src/pages/SponsorUs/index.tsx
@@ -5,19 +5,33 @@ import { faHeart, faHandshake, faInfoCircle } from "@fortawesome/free-solid-svg-
 import Navbar from "../../components/NavBar";
 import Footer from "../../components/Footer";
 import Form from "../../components/Form";
-// import PAST_SPONSORS from "../../assets/images/past-sponsors.png";
-import A from "../../assets/images/sponsor-logos/1.png";
-import B from "../../assets/images/sponsor-logos/2.png";
-import C from "../../assets/images/sponsor-logos/3.png";
-import D from "../../assets/images/sponsor-logos/4.png";
-import E from "../../assets/images/sponsor-logos/5.png";
-import F from "../../assets/images/sponsor-logos/6.png";
-import G from "../../assets/images/sponsor-logos/7.png";
-import H from "../../assets/images/sponsor-logos/8.png";
-import I from "../../assets/images/sponsor-logos/9.png";
-import J from "../../assets/images/sponsor-logos/10.png";
-import K from "../../assets/images/sponsor-logos/11.png";
-import L from "../../assets/images/sponsor-logos/12.png";
+import A from "../../assets/images/sponsor-logos/ASUCM.png";
+import B from "../../assets/images/sponsor-logos/MLH.png";
+import C from "../../assets/images/sponsor-logos/1Password.png";
+import D from "../../assets/images/sponsor-logos/Alumni.png";
+import E from "../../assets/images/sponsor-logos/Adobe.png";
+import F from "../../assets/images/sponsor-logos/Sketch.png";
+import G from "../../assets/images/sponsor-logos/Citrus.png";
+import H from "../../assets/images/sponsor-logos/Replit.png";
+import I from "../../assets/images/sponsor-logos/ACM.png";
+import J from "../../assets/images/sponsor-logos/MakeSchool.png";
+import K from "../../assets/images/sponsor-logos/JetBrains.png";
+import L from "../../assets/images/sponsor-logos/Snorkel.png";
+import M from "../../assets/images/sponsor-logos/InterviewCake.png";
+import N from "../../assets/images/sponsor-logos/Stickermule.png";
+import O from "../../assets/images/sponsor-logos/VentureLab.png";
+import P from "../../assets/images/sponsor-logos/WolframLanguage.png";
+import Q from "../../assets/images/sponsor-logos/ZuckerbergInitiative.png";
+import R from "../../assets/images/sponsor-logos/MakeyMakey.png";
+import S from "../../assets/images/sponsor-logos/CoolerMaster.png";
+import T from "../../assets/images/sponsor-logos/MonsterEnergy.png";
+import U from "../../assets/images/sponsor-logos/MercoCU.png";
+import V from "../../assets/images/sponsor-logos/GoodDayChocolate.png";
+import W from "../../assets/images/sponsor-logos/GuayakiYerbaMate.png";
+import X from "../../assets/images/sponsor-logos/Vanguard.png";
+import Y from "../../assets/images/sponsor-logos/UCANR.png";
+import Z from "../../assets/images/sponsor-logos/OSI.png";
+import AA from "../../assets/images/sponsor-logos/IT.png";
 
 
 import "./styles.scss";
@@ -67,7 +81,7 @@ const SponsorUs: FC = (): JSX.Element => {
 
                 {/* Past Sponsors Gallery */}
                 <div className="past-sponsors">
-                    <div>Our Past Sponsors</div>
+                    <div className="logos-title">Our Past Sponsors</div>
                     <ul className="list">
                         <li className="items"><img className="logoimage" src={A} alt="ASUCM-Logo" /></li>
                         <li className="items"><img className="logoimage" src={B} alt="MLH-Logo" /></li>
@@ -78,9 +92,24 @@ const SponsorUs: FC = (): JSX.Element => {
                         <li className="items"><img className="logoimage" src={G} alt="CITRIS-Logo" /></li>
                         <li className="items"><img className="logoimage" src={H} alt="REPL-Logo" /></li>
                         <li className="items"><img className="logoimage" src={I} alt="ACM-Logo" /></li>
-                        <li className="items"><img className="logoimage" src={J} alt="" /></li>
+                        <li className="items"><img className="logoimage" src={J} alt="MAKESCHOOL-Logo" /></li>
                         <li className="items"><img className="logoimage" src={K} alt="JETBRAINS-Logo" /></li>
                         <li className="items"><img className="logoimage" src={L} alt="SNORKEL-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={M} alt="INTERVIEWCAKE-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={N} alt="STICKERMULE-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={O} alt="VENTURELAB-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={P} alt="WOLFRAMLANGUAGE-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={Q} alt="ZUCKERBERGINITIATIVE-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={R} alt="MAKEYMAKEY-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={S} alt="COOLERMASTER-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={T} alt="MONSTERENERGY-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={U} alt="MERCO-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={V} alt="GOODDAY-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={W} alt="GUAYAKI-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={X} alt="VANGUARD-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={Y} alt="UCANR-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={Z} alt="OSI-Logo" /></li>
+                        <li className="items"><img className="logoimage" src={AA} alt="IT-Logo" /></li>
                     </ul>
                 </div>
             </main>

diff --git a/src/pages/SponsorUs/styles.scss b/src/pages/SponsorUs/styles.scss
@@ -16,7 +16,7 @@
             color: var(--text-color);
             font-weight: bolder;
             overflow: hidden;
-            padding: 1% 0% 2% 0%;
+            padding: 2.5% 0% 2% 0%;
             @media (min-width: 768px) {
                 font-size: 2.5rem;
             }
@@ -66,11 +66,15 @@
 
 
 .past-sponsors {
-    font-weight: 500;
-    font-size: 50px;
-    text-align: center;
-    color: black;
-    margin: 2%;
+    padding: 4% 2% 0% 2%;
+
+    .logos-title {
+        font-weight: bold;
+        font-size: 50px;
+        text-align: center;
+        padding-bottom: 3%;
+        color: var(--text-color);
+    }
 
     .list {
         padding: 0;
@@ -86,11 +90,10 @@
             display: flex;
             border: 2px solid transparent;
             animation-name: animateIn;
-            animation-duration: 350ms;
+            animation-duration: 4s;
             animation-delay: 300ms;
             animation-fill-mode: both;
             animation-timing-function: ease-out-in;
-            padding: 0px;
             text-align: center;
             font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;