tweaks & fix nav on mobile

locale/en_US/makerparty.json

@@ -1,4 +1,5 @@
 {
+  "===FIXME===": "===FIXEME=== ===FIXEME=== ===FIXEME=== ===FIXEME=== ===FIXEME===",
   "About Webmaker": "About Webmaker",
   "Anyone can join Maker Party by hosting or attending an event.": "Anyone can join Maker Party by hosting or attending an event.",
   "Attend an Event": "Attend an Event",
@@ -39,6 +40,7 @@
   "Creativity Labs at Indiana University": "Creativity Labs at Indiana University",
   "Decoded": "Decoded",
   "DIY.org Desc": "<b>DIY.org</b> made 250,000 projects with kids [where?]",
+  "Documents": "Documents",
   "Donate": "Donate",
   "E-Skills": "E-Skills",
   "English": "English",
@@ -84,6 +86,7 @@
   "Learn by teaching": "Learn by teaching",
   "Learn by teaching Desc": "The best way to learn the web is to teach it. Hosting a Maker Party is not only personally rewarding, it contributes to the greater goal of increasing web literacy for everyone, everywhere in the world.",
   "Learn more about us": "Learn more about us.",
+  "Logos & Visual Assets": "Logos & Visual Assets",
   "London Zoo/Edge of Existence": "London Zoo/Edge of Existence",
   "MadLab": "MadLab",
   "Make Waves": "Make Waves",

public/less/style.less

@@ -105,13 +105,10 @@ ul.nav-webmaker-logo {
   }
 }
 
-.navbar-toggle {
-  @media (min-width: @screen-sm-min) {
-  }
-}
-
 .navbar-collapse {
+  @media (min-width: @screen-sm-min) {
     padding-left: 0;
+  }
 }
 
 .navbar.navbar-inverse.navbar-no-header-xs {
@@ -137,29 +134,33 @@ ul.nav-webmaker-logo {
   top: -40px;
   h2 {
     margin-top: 10px;
-    color: @mp-green;
+    color: #fff;
   }
   .container {
-    background: @mp-yellow;
-    color: #000;
+    background: #99d2d4;
+    color: @mp-green;
     position: relative;
   }
   .left-triangle {
+    @media (min-width: 830px ) {
       width: 0;
       height: 0;
       border-left: 25px solid transparent;
-    border-bottom: 40px solid #cdbd2c;
+      border-bottom: 40px solid @mp-green;
       position: absolute;
       left: -25px;
     }
+  }
   .right-triangle {
+    @media (min-width: 830px ) {
       width: 0;
       height: 0;
       border-right: 25px solid transparent;
-    border-bottom: 40px solid #cdbd2c;
+      border-bottom: 40px solid @mp-green;
       position: absolute;
       right: -25px;
     }
+  }
 }
 
 footer {
@@ -252,6 +253,15 @@ footer {
   HOME page
 */
 
+.home {
+  .banner {
+    background-image: url('../img/makerparty_landing_image2.jpg');
+    background-size: cover;
+    background-position: center center;
+    min-height: 300px;
+  }
+}
+
 .home-banner-video {
   padding-bottom: 66.66%;
   height: 0;
@@ -453,6 +463,16 @@ footer {
   History page
 */
 
+.history {
+  .banner {
+    background-image: url('../img/makerparty_history_headeryellow2.jpg');
+    background-size: cover;
+    background-position: center center;
+    min-height: 300px;
+  }
+}
+
+
 .history {
   img {
     width: 100%;
@@ -608,4 +628,10 @@ footer {
     background-position: center center;
     min-height: 300px;
   }
+  .asset {
+    .preview {
+      background: @lightgrey;
+      min-height: 200px;
+    }
+  }
 }

views/layout.html

@@ -28,9 +28,7 @@
 
     <nav class="navbar navbar-inverse navbar-no-header-xs">
       <div class="container">
-        <div class="navbar-header">
-        </div>
-        <div class="navbar-collapse" id="mp-navbar-row">
+        <div class="navbar-collapse collapse" id="mp-navbar-row">
           {% block navItems %}
           <ul class="nav navbar-nav">
             <li class="active"><a href="/">{{ gettext("Maker Party") }}</a></li>
@@ -40,9 +38,9 @@
             <li><a href="/history">{{ gettext("History") }}</a></li>
           </ul>
           {% endblock %}
-          <ul class="nav-webmaker-logo">
+<!--           <ul class="nav-webmaker-logo">
             <li><a href="https://webmaker.org"><img src="img/webmaker_headerwordmark.png"></a></li>
-          </ul>
+          </ul> -->
         </div>
       </div>
     </nav>
@@ -148,6 +146,7 @@
   <script src="config.js"></script>
   <script src="bower_components/jquery/dist/jquery.min.js"></script>
   <script src="bower_components/jquery-colorbox/jquery.colorbox-min.js"></script>
+  <script src="bower_components/bootstrap/js/collapse.js"></script>
   <script src="http://mozorg.cdn.mozilla.net/tabzilla/tabzilla.js"></script>
 
   <script src="js/ui.js"></script>

views/resources.html

@@ -30,7 +30,59 @@
 {% block mainContent %}
   <div class="big-section">
     <div class="container">
-      Resources Page
+      <div class="row">
+        <div class="col-md-12">
+          <h2>{{ gettext("Documents") }}</h2>
+          <p>{{ gettext("===FIXME===") }}</p>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col-md-3 asset">
+          <div class="preview"></div>
+          <p>{{ gettext("") }}</p>
+        </div>
+        <div class="col-md-3 asset">
+          <div class="preview"></div>
+          <p>{{ gettext("") }}</p>
+        </div>
+        <div class="col-md-3 asset">
+          <div class="preview"></div>
+          <p>{{ gettext("") }}</p>
+        </div>
+        <div class="col-md-3 asset">
+          <div class="preview"></div>
+          <p>{{ gettext("") }}</p>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="big-section">
+    <div class="container">
+      <div class="row">
+        <div class="col-md-12">
+          <h2>{{ gettext("Logos & Visual Assets") }}</h2>
+          <p>{{ gettext("===FIXME===") }}</p>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col-md-3 asset">
+          <div class="preview"></div>
+          <p>{{ gettext("") }}</p>
+        </div>
+        <div class="col-md-3 asset">
+          <div class="preview"></div>
+          <p>{{ gettext("") }}</p>
+        </div>
+        <div class="col-md-3 asset">
+          <div class="preview"></div>
+          <p>{{ gettext("") }}</p>
+        </div>
+        <div class="col-md-3 asset">
+          <div class="preview"></div>
+          <p>{{ gettext("") }}</p>
+        </div>
+      </div>
     </div>
   </div>
 {% endblock %}