Rework footer again

2 files changed, 36 insertions, 21 deletions

diff --git a/index.html b/index.html
index 048a262..b0b10ce 100644
--- a/index.html
+++ b/index.html
@@ -255,28 +255,28 @@
     <footer>
       <div class="container">
         <div class="row">
-          <div class="col-xs-12 col-md-3">
-            <h3 class="footerhead" id="more-gentoo">More Gentoo Websites</h3>
-              <ul class="footerlinks">
-                <li><a href="http://www.gentoo.org/" title="Main Gentoo website"><span class="fa fa-home fa-fw"></span> gentoo.org</a></li>
-                <li><a href="http://wiki.gentoo.org/" title="Find and contribute documentation"><span class="fa fa-file-text fa-fw"></span> Wiki</a></li>
-                <li><a href="https://bugs.gentoo.org/" title="Report issues and find common issues"><span class="fa fa-bug fa-fw"></span> Bugs</a></li>
-                <li><a href="http://forums.gentoo.org/" title="Discuss with the community"><span class="fa fa-comments-o fa-fw"></span> Forums</a></li>
-                <li><a href="http://planet.gentoo.org/" title="Find out what's going on in the developer community"><span class="fa fa-rss fa-fw"></span> Planet</a></li>
-                <li class="divider"></li>
-                <li><a href="http://twitter.com/gentoo" title="Get the latest Gentoo news"><span class="fa fa-twitter fa-fw"></span> Twitter</a></li>
-                <li><a href="https://plus.google.com/+Gentoo" title="Get the latest Gentoo news"><span class="fa fa-google-plus fa-fw"></span> Google+</a></li>
-                <li><a href="https://www.facebook.com/gentoo.org" title="Get updates on the services provided by Gentoo"><span class="fa fa-facebook fa-fw"></span> Facebook</a></li>
-              </ul>
+          <div class="col-xs-12 col-md-offset-2 col-md-7">
+          <!-- Application footer goes here (only here please):
+            <p class="spacer">If you don't want a headline</p>
+            or
+            <h3 class="footerhead">Headline</h3>
+            <p>Contents</p>
+          -->
           </div>
-          <div class="col-xs-12 col-md-offset-1 col-md-8">
-            <!-- Application Footer goes here, nowhere else please -->
+          <div class="col-xs-12 col-md-3">
             <h3 class="footerhead">Questions or comments?</h3>
             Please feel free to <a href="http://www.gentoo.org/main/en/contact.xml">contact us</a>.
           </div>
         </div>
         <div class="row">
-          <div class="col-md-12">
+          <div class="col-xs-3 col-md-2">
+            <ul class="footerlinks three-icons">
+              <li><a href="http://twitter.com/gentoo" title="@Gentoo on Twitter"><span class="fa fa-twitter fa-fw"></span></a></li>
+              <li><a href="https://plus.google.com/+Gentoo" title="+Gentoo on Google+"><span class="fa fa-google-plus fa-fw"></span></a></li>
+              <li><a href="https://www.facebook.com/gentoo.org" title="Gentoo on Facebook"><span class="fa fa-facebook fa-fw"></span></a></li>
+            </ul>
+          </div>
+          <div class="col-xs-9 col-md-9">
             <strong>&copy; 2001&ndash;2015 Gentoo Foundation, Inc.</strong><br />
             <small>
               Gentoo is a trademark of the Gentoo Foundation, Inc.
diff --git a/sources/css/tyrian/less/footer.less b/sources/css/tyrian/less/footer.less
index 8aa6dff..d8a9805 100644
--- a/sources/css/tyrian/less/footer.less
+++ b/sources/css/tyrian/less/footer.less
@@ -1,11 +1,11 @@
 footer {
   background-color: @footer-bg;
   color: #444;
-  border-top: 4px solid darken(@footer-bg, 10%);
+  border-top: 1px solid darken(@footer-bg, 10%);
   margin-top: 2em;
   padding-top: 0.5em;
   padding-bottom: 1em;
-  //.box-shadow(~"inset 0 -1px 15px 0 rgba(0,0,0,.15)");
+  .box-shadow(~"inset 0 -1px 15px 0 rgba(0,0,0,.15)");
   background-image: url('black-thing.png'), url('znurt.png');
   background-position: right bottom, right top;
   background-repeat: no-repeat;
@@ -25,6 +25,13 @@ footer {
     margin-top: 1em;
     font-family: @font-family-sans-serif;
     font-weight: normal;
+    text-transform: uppercase;
+    color: darken(@footer-bg, 60%);
+    font-size: 1.2em;
+  }
+
+  .spacer {
+    margin-top: 1em;
   }
 }
 
@@ -51,14 +58,16 @@ ul.footerlinks {
   li {
     list-style-type: none;
 
-    a:link {
+    a:link, a:visited {
+      color: darken(@footer-bg, 40%);
+      border-radius: 2px;
       border: none;
       display: block;
-      padding: 10px 15px;
+      padding: 6px 12px;
     }
 
     a:hover, a:active {
-      background-color: @gentoo-purple-light;
+      background-color: darken(@footer-bg, 30%);
       text-decoration: none;
       color: white;
     }
@@ -69,4 +78,10 @@ ul.footerlinks {
     margin-top: 5px;
     padding-bottom: 5px;
   }
+}
+
+ul.three-icons li {
+  float: left;
+  width: 33%;
+  text-align: center;
 }
\ No newline at end of file