From d1c18ff2567cdaf9969fe719e30e3823e0fae738 Mon Sep 17 00:00:00 2001
From: =?utf8?q?Fr=C3=A9d=C3=A9ric=20Buclin?= <LpSolit@gmail.com>
Date: Sun, 5 Apr 2015 21:16:25 +0200
Subject: [PATCH] Bug 1143502: Use structural HTML5 elements instead of <div>
 r=dkl a=sgreen

---
 skins/standard/global.css                   |  8 ++++++++
 template/en/default/global/footer.html.tmpl | 10 ++++++----
 template/en/default/global/header.html.tmpl | 20 +++++++++++++++-----
 3 files changed, 29 insertions(+), 9 deletions(-)

diff --git a/skins/standard/global.css b/skins/standard/global.css
index 3941808bec..3b96b6138a 100644
--- a/skins/standard/global.css
+++ b/skins/standard/global.css
@@ -16,6 +16,14 @@
         font-family: Verdana, sans-serif;
         font-size: small;
     }
+
+    /* header and footer are required for IE8. IE9+ support them natively.
+     * main is required for all IE versions and KHTML-based browsers.
+     * Other browsers support them natively already. */
+    header, main, footer {
+        display: block;
+    }
+
     /* monospace is much smaller than Verdana by default, so we make it a bit bigger. */
     pre, code, kbd {
         font-size: medium;
diff --git a/template/en/default/global/footer.html.tmpl b/template/en/default/global/footer.html.tmpl
index 7cc5e1b44a..7390a6d994 100644
--- a/template/en/default/global/footer.html.tmpl
+++ b/template/en/default/global/footer.html.tmpl
@@ -12,15 +12,17 @@
   #%]
 
       [% Hook.process('main-end') %]
-    </div>
+    </main>
 
-    <div id="footer">
+    <footer id="footer">
       <div class="intro">[% Hook.process('intro') %]</div>
 
-      [% PROCESS "global/useful-links.html.tmpl" %]
+      <nav>
+        [% PROCESS "global/useful-links.html.tmpl" %]
+      </nav>
 
       <div class="outro">[% Hook.process('outro') %]</div>
-    </div>
+    </footer>
 
     [% Hook.process("end") %]
   </body>
diff --git a/template/en/default/global/header.html.tmpl b/template/en/default/global/header.html.tmpl
index f63b175ec8..d59ecef8b3 100644
--- a/template/en/default/global/header.html.tmpl
+++ b/template/en/default/global/header.html.tmpl
@@ -228,6 +228,16 @@
       [% PROCESS format_js_link %]
     [% END %]
 
+    [%# IE8 doesn't understand these HTML5 elements. So we have to declare them here. %]
+    <!--[if lt IE 9]>
+      <script>
+        document.createElement('header');
+        document.createElement('nav');
+        document.createElement('main');
+        document.createElement('footer');
+      </script>
+    <![endif]-->
+
     [%# this puts the live bookmark up on firefox for the Atom feed %]
     [% IF atomlink %]
        <link rel="alternate" 
@@ -248,7 +258,7 @@
                  [%+ class FILTER css_class_quote %]
                [% END %] yui-skin-sam">
 
-  <div id="header">
+  <header id="header">
     [% INCLUDE global/banner.html.tmpl %]
 
     <div id="titles">
@@ -263,9 +273,9 @@
       [% END %]
     </div>
 
-    <div id="common_links">
+    <nav id="common_links">
       [% PROCESS "global/common-links.html.tmpl" qs_suffix = "_top" %]
-    </div>
+    </nav>
 
     [% IF Bugzilla.languages.size > 1 %]
       <div id="lang_links_container" class="bz_default_hidden">
@@ -284,9 +294,9 @@
         </ul>
       </div>
     [% END %]
-  </div>
+  </header>
 
-  <div id="bugzilla-body">
+  <main role="main" id="bugzilla-body">
     [% IF Param('announcehtml') %]
       [% Param('announcehtml') FILTER none %]
     [% END %]
-- 
2.47.2