Eliminate HTML5 elements

IE8, *sigh*

diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index 2c186c909226a89788088dce891be0312bf1e38b..c1f6af00495839c1d5ea9a0fa16eb20aa87dfcc5 100644 (file)
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -132,10 +132,10 @@ $(document).ready(function () {
 
   $("#menu-icon").on("click", function(e) {
     e.preventDefault();
 
   $("#menu-icon").on("click", function(e) {
     e.preventDefault();

-    $("header").toggleClass("closed");
+    $("#header").toggleClass("closed");

   });
 
   });
 

-  $("nav.primary li a").on("click", function() {
-    $("header").toggleClass("closed");
+  $(".nav.primary li a").on("click", function() {
+    $("#header").toggleClass("closed");

   });
 });
   });
 });

diff --git a/app/assets/javascripts/index.js b/app/assets/javascripts/index.js
index 6fc870a4ce296a2971d1f965be8ddf249268d736..9514fd5f026e4ffda57e5e0e1e46da41cb428b57 100644 (file)
--- a/app/assets/javascripts/index.js
+++ b/app/assets/javascripts/index.js
@@ -263,7 +263,7 @@ $(document).ready(function () {
 
   $(".search_form").on("submit", function(e) {
     e.preventDefault();
 
   $(".search_form").on("submit", function(e) {
     e.preventDefault();

-    $("header").addClass("closed");
+    $("#header").addClass("closed");

     var query = $(this).find("input[name=query]").val();
     if (query) {
       OSM.route("/search?query=" + encodeURIComponent(query) + OSM.formatHash(map));
     var query = $(this).find("input[name=query]").val();
     if (query) {
       OSM.route("/search?query=" + encodeURIComponent(query) + OSM.formatHash(map));

diff --git a/app/assets/stylesheets/common.css.scss b/app/assets/stylesheets/common.css.scss
index f88e0d1d2fcec35901148bab0dc590b3c6fa3e74..d456e0685cfe481b3691ac3fff085d2b6226cd69 100644 (file)
--- a/app/assets/stylesheets/common.css.scss
+++ b/app/assets/stylesheets/common.css.scss
@@ -244,13 +244,13 @@ table {
   opacity: 0.6;
 }
 
   opacity: 0.6;
 }
 

-header {
+#header {

   height: $headerHeight;
   position: relative;
   z-index: 1001;
   font-size: 13px;
 
   height: $headerHeight;
   position: relative;
   z-index: 1001;
   font-size: 13px;
 

-  h1, nav, nav > ul, nav > ul > li, .dropdown {
+  h1, .nav, .nav > ul, .nav > ul > li, .user-menu {

     display: inline-block;
   }
 
     display: inline-block;
   }
 


@@ -259,7 +259,7 @@ header {
     padding: $lineheight/2;
   }
 
     padding: $lineheight/2;
   }
 

-  h1, nav.primary {
+  h1, .nav.primary {

     float: left;
   }
 
     float: left;
   }
 


@@ -284,7 +284,7 @@ header {
   }
 }
 
   }
 }
 

-nav.primary {
+.nav.primary {

   > ul {
     $border: 1px solid $green;
 
   > ul {
     $border: 1px solid $green;
 


@@ -347,11 +347,12 @@ nav.primary {
   }
 }
 
   }
 }
 

-nav.secondary {
+.nav.secondary {

   position: absolute;
   right: 0;
 
   position: absolute;
   right: 0;
 

-  > ul {
+  > ul,
+  > #compact-secondary-nav {

     vertical-align: middle;
     a, .dropdown-toggle {
       display: inline-block;
     vertical-align: middle;
     a, .dropdown-toggle {
       display: inline-block;


@@ -455,7 +456,7 @@ nav.secondary {
     display: inline-block;
   }
   .compact-hide {
     display: inline-block;
   }
   .compact-hide {

-    display: none;
+    display: none !important;

   }
 }
 
   }
 }
 


@@ -900,7 +901,7 @@ nav.secondary {
 
 /* Rules for the search box */
 
 
 /* Rules for the search box */
 

-header .search_form {
+#header .search_form {

   display: none;
 }
 
   display: none;
 }
 

diff --git a/app/assets/stylesheets/print.css b/app/assets/stylesheets/print.css
index fa04314b1fe55bfda816e9eab85dbba1d70abbd9..5186f8c588cb120ea16169190c77a5157f9fea66 100644 (file)
--- a/app/assets/stylesheets/print.css
+++ b/app/assets/stylesheets/print.css
@@ -1,4 +1,4 @@
-header,
+#header,

 #sidebar,
 #permalink,
 .leaflet-control {
 #sidebar,
 #permalink,
 .leaflet-control {

diff --git a/app/assets/stylesheets/small.css.scss b/app/assets/stylesheets/small.css.scss
index 39b946af06d93c96eacf54d691bb6fbb02c54c27..06acc4da7386d5433d36e1227a5d1bd615f56b86 100644 (file)
--- a/app/assets/stylesheets/small.css.scss
+++ b/app/assets/stylesheets/small.css.scss
@@ -15,15 +15,14 @@ input[type="text"] {
   display: inline-block !important;
 }
 
   display: inline-block !important;
 }
 

-nav.primary,
-nav.secondary {
+.nav {

   float: none !important;
   position: relative;
   display: block;
   clear: both;
 }
 
   float: none !important;
   position: relative;
   display: block;
   clear: both;
 }
 

-header {
+#header {

   height: auto;
   min-height: $headerHeight;
   background: #fff;
   height: auto;
   min-height: $headerHeight;
   background: #fff;


@@ -32,7 +31,7 @@ header {
     padding-bottom: 15px;
   }
 
     padding-bottom: 15px;
   }
 

-  &.closed nav {
+  &.closed .nav {

     display: none;
   }
 
     display: none;
   }
 


@@ -47,7 +46,7 @@ header {
   display: none;
 }
 
   display: none;
 }
 

-nav.primary {
+.nav.primary {

   padding: 0;
 
   ul, li {
   padding: 0;
 
   ul, li {


@@ -71,7 +70,7 @@ nav.primary {
   }
 }
 
   }
 }
 

-nav.secondary {
+.nav.secondary {

   border-bottom: 1px solid #eee;
 
   .user-menu {
   border-bottom: 1px solid #eee;
 
   .user-menu {

diff --git a/app/views/layouts/_header.html.erb b/app/views/layouts/_header.html.erb
index dbb9966b60997c83b57f285c64a2e6e96e592098..35cc0578c2aaa14d9158fe9eee91d3f9076eab6c 100644 (file)
--- a/app/views/layouts/_header.html.erb
+++ b/app/views/layouts/_header.html.erb
@@ -1,4 +1,4 @@
-<header class="closed">
+<div id="header" class="closed">

   <h1>
     <a href="<%= root_path %>" class="geolink">
       <%= image_tag "osm_logo.png", :alt => t('layouts.logo.alt_text'), :class => 'logo' %>
   <h1>
     <a href="<%= root_path %>" class="geolink">
       <%= image_tag "osm_logo.png", :alt => t('layouts.logo.alt_text'), :class => 'logo' %>


@@ -6,7 +6,7 @@
     </a>
   </h1>
   <a href="#" id="menu-icon"></a>
     </a>
   </h1>
   <a href="#" id="menu-icon"></a>

-  <nav class='primary'>
+  <div class='nav primary'>

     <%= content_for :header %>
     <ul>
       <li id="edit_tab" class="dropdown <%= current_page_class(edit_path) %>">
     <%= content_for :header %>
     <ul>
       <li id="edit_tab" class="dropdown <%= current_page_class(edit_path) %>">


@@ -32,23 +32,23 @@
         <%= link_to t('layouts.export'), export_path, :class => 'tab geolink' %>
       </li>
     </ul>
         <%= link_to t('layouts.export'), export_path, :class => 'tab geolink' %>
       </li>
     </ul>

-  </nav>
-  <nav class='secondary'>
-    <ul>
-      <li class="compact-hide <%= current_page_class(traces_path) %>"><%= link_to t('layouts.gps_traces'), traces_path %></li>
-      <li class="compact-hide <%= current_page_class(diary_path) %>"><%= link_to t('layouts.user_diaries'), diary_path %></li>
-      <li class="compact-hide <%= current_page_class(help_path) %>"><%= link_to t('layouts.help'), help_path %></li>
-      <li class="compact-hide <%= current_page_class(about_path) %>"><%= link_to t('layouts.about'), about_path %></li>
-      <li id="compact-secondary-nav" class="dropdown">
-        <a class="dropdown-toggle" data-toggle="dropdown" href="#">More <b class="caret"></b></a>
-        <ul class="dropdown-menu">
-          <li class="<%= current_page_class(traces_path) %>"><%= link_to t('layouts.gps_traces'), traces_path %></li>
-          <li class="<%= current_page_class(diary_path) %>"><%= link_to t('layouts.user_diaries'), diary_path %></li>
-          <li class="<%= current_page_class(help_path) %>"><%= link_to t('layouts.help'), help_path %></li>
-          <li class="<%= current_page_class(about_path) %>"><%= link_to t('layouts.about'), about_path %></li>
-        </ul>
-      </li>
+  </div>
+  <div class='nav secondary'>
+    <ul class="compact-hide">
+      <li class="<%= current_page_class(traces_path) %>"><%= link_to t('layouts.gps_traces'), traces_path %></li>
+      <li class="<%= current_page_class(diary_path) %>"><%= link_to t('layouts.user_diaries'), diary_path %></li>
+      <li class="<%= current_page_class(help_path) %>"><%= link_to t('layouts.help'), help_path %></li>
+      <li class="<%= current_page_class(about_path) %>"><%= link_to t('layouts.about'), about_path %></li>

     </ul>
     </ul>

+    <div id="compact-secondary-nav" class="dropdown">
+      <a class="dropdown-toggle" data-toggle="dropdown" href="#">More <b class="caret"></b></a>
+      <ul class="dropdown-menu">
+        <li class="<%= current_page_class(traces_path) %>"><%= link_to t('layouts.gps_traces'), traces_path %></li>
+        <li class="<%= current_page_class(diary_path) %>"><%= link_to t('layouts.user_diaries'), diary_path %></li>
+        <li class="<%= current_page_class(help_path) %>"><%= link_to t('layouts.help'), help_path %></li>
+        <li class="<%= current_page_class(about_path) %>"><%= link_to t('layouts.about'), about_path %></li>
+      </ul>
+    </div>

     <% if @user %>
       <div class='dropdown user-menu logged-in'>
         <a class='dropdown-toggle' data-toggle='dropdown' href="#">
     <% if @user %>
       <div class='dropdown user-menu logged-in'>
         <a class='dropdown-toggle' data-toggle='dropdown' href="#">


@@ -85,5 +85,5 @@
         <li><%= link_to t('layouts.sign_up'), user_new_path %></li>
       </ul>
     <% end %>
         <li><%= link_to t('layouts.sign_up'), user_new_path %></li>
       </ul>
     <% end %>

-  </nav>
-</header>
+  </div>
+</div>