update new font and clean up styling

_data/officers.json

@@ -8,28 +8,28 @@
             "last": "Begotka",
             "year": 2018,
             "title": "",
-            "intro": "Welcome to Thomas Jefferson High School for Science and Technology's Student Government Association"
+            "intro": ""
         },
         {
             "first": "Sherry",
             "last": "Xie",
             "year": 2018,
             "title": "",
-            "intro": "Welcome to Thomas Jefferson High School for Science and Technology's Student Government Association"
+            "intro": ""
         },
         {
             "first": "Shreya",
             "last": "Chappidi",
             "year": 2018,
             "title": "",
-            "intro": "Welcome to Thomas Jefferson High School for Science and Technology's Student Government Association"
+            "intro": ""
         },
         {
             "first": "Sitara",
             "last": "Uppalapati",
             "year": 2019,
             "title": "",
-            "intro": "Welcome to Thomas Jefferson High School for Science and Technology's Student Government Association"
+            "intro": ""
         }
     ]
 }

_includes/header.html

@@ -3,7 +3,8 @@
             <button id="menu-toggle">
                 <i></i>
             </button>
-            <h1>TJ STUDENT GOVERNMENT ASSOCIATION</h1>
+            <div id="logo">
+            </div>
         </div>
         <nav id="menu">
             <a class="menu-item" href="index.html">

about.html

@@ -40,8 +40,8 @@ orgs: ["officers", "excomm", "senators", "sponsors"]
                 <div class="{{ org.username }}-text">
                     {% assign year = member.year | downcase %}
                     <span>{{ member.first }} {{ member.last }}</span>
-                    {% if name != "sponsors" %}
+                    {% if name != "sponsors" and name != "senators" %}
-                    <span>'{{ year | slice: 2, 3 }}</span>
+                    <span>{{ year }}</span>
                     {% endif %}
                     {% if name != "officers" %}
                     <span>{{ member.title }}</span>

css/about.css

@@ -1,5 +1,11 @@
+/*#excomm:after {
+    content: '';
+    flex: auto;
+}*/
+
 #contact {
-    max-width: 1200px;
+    width: 1200px;
+    max-width: 100vw;
     display: block;
     text-align: center;
 }
@@ -20,15 +26,16 @@
 .senators-image,
 .sponsors-image {
     width: 100%;
-    height: 20vh;
+    height: calc(25vh - 4vw);
+    margin-bottom: 1vh;
 }
 
 .officers-image:after,
 .excomm-image:after,
 .senators-image:after,
 .sponsors-image:after {
-    width: 20vh;
+    width: calc(25vh - 4vw);
-    height: 20vh;
+    height: calc(25vh - 4vw);
     content: '';
     display: block;
     position: relative;
@@ -68,7 +75,6 @@
     text-align: center;
     margin: 2vw;
     flex-basis: calc(25% - 4vw);
-    display: flex;
     flex-wrap: wrap;
 }
 

css/header.css

@@ -14,14 +14,22 @@ header {
     z-index: 3;
 }
 
-#banner h1 {
+#banner #logo {
-    display: table-cell;
+    content: '';
+    height: 10vh;
+    width: 10vh;
+    display: inline-block;
     vertical-align: middle;
     font-size: 2.5em;
     font-weight: bold;
     overflow: hidden;
+    background-image: url('../img/logo.png');
+    background-size: 90%;
+    background-position: center;
+    background-repeat: no-repeat;
 }
 
+
 #menu-toggle {
     cursor: pointer;
     background-color: #fff;

css/main.css

@@ -1,4 +1,4 @@
-@font-face {
+/*@font-face {
     font-family: OpenSans;
     src: url('../fonts/OpenSans/OpenSans-Regular.ttf')
 }
@@ -7,12 +7,14 @@
     font-family: OpenSans;
     font-weight: bold;
     src: url('../fonts/OpenSans/OpenSans-Bold.ttf')
-}
+}*/
+
+@import url('https://fonts.googleapis.com/css?family=Lato');
 
 /*http://meyerweb.com/eric/tools/css/reset/*/
 html,body,div,span,button,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video {
     font: inherit;
-    font-family: 'Segoe UI', 'Open Sans', 'Helvetica Neue', Helvetica, sans-serif;
+    font-family: 'Lato', 'Helvetica Neue', Helvetica, sans-serif;
     font-size: 100%;
     margin: 0;
     padding: 0;
@@ -211,9 +213,6 @@ section h2,
     margin: 0 2vw;
 }
 
-#logo {
-    display: inline-block;
-}
 
 #letter {
     width: 100%;

css/responsive.css

@@ -43,6 +43,9 @@
         position: fixed;
         box-shadow: 0 28rem 79rem 0 rgba(91, 194, 182, .08), 0 40rem 32rem 0 rgba(0, 0, 0, .04);
     }
+    #banner #logo {
+        display: none;
+    }
     #menu-toggle {
         position: absolute;
         left: 0;

index.html

@@ -15,9 +15,6 @@ permalink: /
         <section id="intro">
             <div id="intro-text" class="fluid">
                 <h2 id="intro-title">Welcome!</h2>
-                <div id="logo">
-                    <img src="img/logo.png" alt="TJSGA Logo" />
-                </div>
                 <div id="letter">
                     <p>
                         &nbsp;&nbsp;&nbsp;&nbsp;Welcome to Thomas Jefferson High School for Science and Technology's school-wide Student Government