From 4b411fad10260a644abbd4afdf6bf8dc29f1cc52 Mon Sep 17 00:00:00 2001
From: "Antonis Karamitros @antouank" <ablackjim228@gmail.com>
Date: Mon, 19 Jan 2015 22:23:37 +0000
Subject: [PATCH] [ie-support] - remove <nav> and <header> which are not
 supported in IE8 - remove flex and use float instead - remove border on the
 logo link - fix footer and header links - use hex color instead of rgba (
 yes, not supported on IE8 )

---
 index.html | 27 +++++++++++++-------------
 style.css  | 56 +++++++++++++++++++++++++-----------------------------
 2 files changed, 39 insertions(+), 44 deletions(-)
diff --git a/index.html b/index.html
index 12b8b1d..6881fc6 100644
--- a/index.html
+++ b/index.html
@@ -20,15 +20,14 @@
 
 <body>
 
-  <header>
+  <div class="header">
     <div class="content">
-      <a href="/" class="logo">io.js</a>
-      <div class="spacer"></div>
-      <a href="faq.html">FAQ</a>
-      <a href="es6.html">ES6</a>
-      <a href="https://iojs.org/api/">API Docs</a>
+      <a href="/" class="logo pull-left">io.js</a>
+      <a href="https://iojs.org/api/" class="pull-right">API Docs</a>
+      <a href="es6.html" class="pull-right">ES6</a>
+      <a href="faq.html" class="pull-right">FAQ</a>
     </div>
-  </header>
+  </div>
 
   <div class="content">
     <h1>JavaScript I/O</h1>
@@ -71,13 +70,13 @@ <h1>JavaScript I/O</h1>
   </div>
 
   <footer class="content">
-    <nav>
-      <a href="https://github.com/iojs/io.js/issues">GitHub Issues</a><!--
-   --><a href="https://github.com/iojs">GitHub Org</a><!--
-   --><a href="https://webchat.freenode.net/?channels=io.js">IRC Chat</a><!--
-   --><a href="http://logs.libuv.org/io.js/latest">Logs</a><!--
-   --><a href="https://github.com/iojs/io.js/blob/v1.x/GOVERNANCE.md#readme">Governance</a>
-    </nav>
+    <div class="nav">
+      <a href="https://github.com/iojs/io.js/issues">GitHub Issues</a>
+      <a href="https://github.com/iojs">GitHub Org</a>
+      <a href="https://webchat.freenode.net/?channels=io.js">IRC Chat</a>
+      <a href="http://logs.libuv.org/io.js/latest">Logs</a>
+      <a href="https://github.com/iojs/io.js/blob/v1.x/GOVERNANCE.md#readme">Governance</a>
+    </div>
   </footer>
 
 </body>
diff --git a/style.css b/style.css
index 5923dfe..4e8c5fd 100644
--- a/style.css
+++ b/style.css
@@ -26,37 +26,29 @@ body {
   margin: 0 auto;
 }
 
-header {
-  background: #292829;
-  padding: 20px;
+/* utility classes*/
+.pull-right {
+  float: right;
 }
 
-header .content {
-  display: -webkit-flex;
-  display: flex;
+.pull-left {
+  float: left;
 }
 
-header .spacer {
-  -webkit-flex: 1;
-  flex: 1;
+.header {
+  background: #292829;
+  padding: 20px;
+  height: 67px;
 }
 
-header a {
-  color: rgba(255, 255, 255, 0.5);
+.header a {
+  color: #939393;
   font-weight: 700;
   font-size: 1rem;
-  padding: 0 0.7rem;
-}
-
-header a:first-child {
-  padding-left: 0;
+  padding: 0 12px;
 }
 
-header a:last-child {
-  padding-right: 0;
-}
-
-header a:hover {
+.header a:hover {
   color: #F7DF31;
 }
 
@@ -158,13 +150,13 @@ ul {
   font-size: 0.9rem;
 }
 
-nav {
+.nav {
   font-size: 0.9rem;
   margin: 70px 0 30px 0;
   transition: all 0.2s;
 }
 
-nav a {
+.nav a {
   display: inline-block;
   line-height: 2.2;
   padding: 0 15px;
@@ -173,22 +165,26 @@ nav a {
   transition: all 0.2s;
 }
 
-nav a:first-child, nav a:hover, nav a:hover + a {
+.nav a:first-child, .nav a:hover, .nav a:hover + a {
   border-color: transparent;
 }
 
-nav a:hover {
+.nav a:hover {
   background: #F7DF31;
   color: #292829;
   border-radius: 3px;
 }
 
 p.lead {
-  text-align:center;
+  text-align: center;
+}
+
+.release-logo {
+  border: none;
 }
 
 @media (max-width: 560px) {
-  nav a {
+  .nav a {
     line-height: 3;
     display: block;
     border: none;
@@ -207,15 +203,15 @@ p.lead {
     line-height: 1.6;
   }
 
-  nav {
+  .nav {
     margin-top: 20px;
   }
 
-  header .content {
+  .header .content {
     padding: 0;
   }
 
-  header a {
+  .header a {
     padding-left: 1rem;
   }
 }
