Merge pull request #75 from TreeHacks/frontendUpdates

color changes, icon update
TreeHacks · Dec 2, 2021 · f38160e · f38160e
2 parents 1c41bf9 + 772c3ee
commit f38160e
Show file tree

Hide file tree

Showing 6 changed files with 16 additions and 8 deletions.
diff --git a/public/images/favicon/favicon.ico b/public/images/favicon/favicon.ico
diff --git a/public/index.html b/public/index.html
@@ -15,7 +15,7 @@
     />
     <meta name="theme-color" content="#ffffff" />
     <link rel="icon" href="/images/favicon/favicon.ico" />
-    <title>TreeHacks 2021</title>
+    <title>TreeHacks 2022</title>
   </head>
   <body>
     <noscript>

diff --git a/src/js/header.jsx b/src/js/header.jsx
@@ -1,16 +1,16 @@
 import React from 'react';
-import * as logo from '../svg/logo.svg';
+import * as whiteLeavesLogo from '../svg/whiteLeavesLogo.svg';
 import {FontAwesomeIcon} from '@fortawesome/react-fontawesome'
 import {faInstagram, faFacebookF, faTwitter} from '@fortawesome/free-brands-svg-icons';
 // import Timer from './timer.jsx';
 
 function Header() {
   return(
     <nav id="header">
-      <ul className="container">
+      <ul className="container" style={{background: '#15766A'}}>
         <li id="header-logo">
           <a href="/">
-            <img src={logo} alt="treehacks small logo"/>
+            <img src={whiteLeavesLogo} alt="treehacks small logo"/>
             <span className="logo-text-tree">tree</span>
             <span className="logo-text-hacks">hacks</span>
             <span className="logo-text-live">live</span>
@@ -25,9 +25,9 @@ function Header() {
 function SocialMedia() {
   return(
     <div id="social-media">
-      <a href="https://www.instagram.com/stanfordtreehacks" target="_blank"><FontAwesomeIcon icon={faInstagram} /></a>
-      <a href="https://www.facebook.com/treehacks/" target="_blank"><FontAwesomeIcon icon={faFacebookF} /></a>
-      <a href="https://twitter.com/hackwithtrees" target="_blank"><FontAwesomeIcon icon={faTwitter} /></a>
+      <a style={{background: 'white'}} href="https://www.instagram.com/stanfordtreehacks" target="_blank"><FontAwesomeIcon style={{color: '#15766A'}} icon={faInstagram} /></a>
+      <a style={{background: 'white'}} href="https://www.facebook.com/treehacks/" target="_blank"><FontAwesomeIcon style={{color: '#15766A'}} icon={faFacebookF} /></a>
+      <a style={{background: 'white'}} href="https://twitter.com/hackwithtrees" target="_blank"><FontAwesomeIcon style={{color: '#15766A'}} icon={faTwitter} /></a>
     </div>
   );
 }

diff --git a/src/sass/global.scss b/src/sass/global.scss
@@ -18,18 +18,21 @@ $section-width: 80vw;
 
 .logo-text-tree {
   font-family: $base-font-family;
+  color: white;
 }
 
 .logo-text-hacks {
   font-family: $base-font-family;
   font-weight: bold;
+  color: white;
 }
 
 .logo-text-live {
   font-family: $base-font-family;
   font-weight: bold;
   color: $primary-color;
   padding-left: 10px;
+  color: white;
 }
 
 .section-heading {

diff --git a/src/sass/themes/green_sprout.scss b/src/sass/themes/green_sprout.scss
@@ -5,7 +5,7 @@
 $background-color: hsl(339, 77%, 99%);
 $background-color-light-border: #eeeeee;
 
-$primary-color: #0D9071;
+$primary-color: #15766A;
 $secondary-color: #E83028;
 $tertiary-color: #FF730E;
 

diff --git a/src/svg/whiteLeavesLogo.svg b/src/svg/whiteLeavesLogo.svg