[gnome-devel-docs/gnome3-hig] collapsing menu for the sidebar.

[Jakub Steiner <jimmac src gnome org>]

commit 24a0a77193d5fea5940bb7b0882d9f84585ffbe1
Author: Jakub Steiner <jimmac gmail com>
Date:   Thu Jan 19 21:08:11 2012 +0100

    collapsing menu for the sidebar.

 hig3/site/javascripts/hig.js  |   28 ++++++++++++++++++++++++++--
 hig3/src/layouts/default.haml |   27 ++++++++++++++-------------
 hig3/src/layouts/landing.haml |   25 +++++++++++++------------
 hig3/src/stylesheets/hig.scss |   23 ++++++++++++++++-------
 4 files changed, 69 insertions(+), 34 deletions(-)
---
diff --git a/hig3/site/javascripts/hig.js b/hig3/site/javascripts/hig.js
index 888d383..6ab8bd9 100644
--- a/hig3/site/javascripts/hig.js
+++ b/hig3/site/javascripts/hig.js
@@ -1,5 +1,5 @@
 function positionFooter() {
-  var $footer = $('#footer');
+  var $footer = $('#footerpositioner');
   $footer.removeClass('fixedfooter');
   if ($(document.body).height() < $(window).height()) {
     $footer.addClass('fixedfooter');
@@ -8,9 +8,33 @@ function positionFooter() {
   }
 }
 
+$.fn.expander = function () {
+  $(this).each(function () {
+    $(this).click(function () {
+      if ($(this).hasClass('expand')) {
+        //hide
+        $(this).removeClass('expand').addClass('collapse');
+        $(this).siblings('ul').hide(200, function () {
+          $(window).resize(positionFooter).resize();
+        });
+      } else {
+        //show
+        $(this).removeClass('collapse').addClass('expand');
+        $(this).siblings('ul').show(200, function () {
+          $(window).resize(positionFooter).resize();
+        });
+      }
+    }).click();
+  });
+}
+
+
 $(document).ready(function () {
+  var $items = $(".sidebar .collapsed>li>a");
+
+  $items.expander();  
   $(window).resize(positionFooter).resize();
-  console.log('yay');
+
   //preventFOUT();
 });
 $(window).ready(function () {
diff --git a/hig3/src/layouts/default.haml b/hig3/src/layouts/default.haml
index d6d63d8..c228247 100644
--- a/hig3/src/layouts/default.haml
+++ b/hig3/src/layouts/default.haml
@@ -19,16 +19,17 @@
           = partial('menu')
       %article.main
         = yield
-    %hr.footerart
-    #footer
-      .contain
-        = partial('menu')
-        .copy
-          %p
-            Copyright &copy; 2005&mdash;2012 The GNOME Project
-          %p
-            Free to share and remix: 
-            %a{:href => "http://creativecommons.org/licenses/by/3.0/"} Creative Commons CC-BY.
-            Optimised for standards. Hosted by 
-            %a{:href => "http://canonical.com"} Canonical
-            Powered by WordPress. 
+    #footerpositioner
+      %hr.footerart
+      #footer
+        .contain
+          = partial('menu')
+          .copy
+            %p
+              Copyright &copy; 2005&mdash;2012 The GNOME Project
+            %p
+              Free to share and remix: 
+              %a{:href => "http://creativecommons.org/licenses/by/3.0/"} Creative Commons CC-BY.
+              Optimised for standards. Hosted by 
+              %a{:href => "http://canonical.com"} Canonical
+              Powered by WordPress. 
diff --git a/hig3/src/layouts/landing.haml b/hig3/src/layouts/landing.haml
index 3109b3b..9c08c99 100644
--- a/hig3/src/layouts/landing.haml
+++ b/hig3/src/layouts/landing.haml
@@ -18,15 +18,16 @@
           = partial('menu')
       %article.main
         = yield
-    %hr.footerart
-    #footer
-      .contain
-        .copy
-          %p
-            Copyright &copy; 2005&mdash;2012 The GNOME Project
-          %p
-            Free to share and remix: 
-            %a{:href => "http://creativecommons.org/licenses/by/3.0/"} Creative Commons CC-BY.
-            Optimised for standards. Hosted by 
-            %a{:href => "http://canonical.com"} Canonical
-            Powered by WordPress. 
+    #footerpositioner
+      %hr.footerart
+      #footer
+        .contain
+          .copy
+            %p
+              Copyright &copy; 2005&mdash;2012 The GNOME Project
+            %p
+              Free to share and remix: 
+              %a{:href => "http://creativecommons.org/licenses/by/3.0/"} Creative Commons CC-BY.
+              Optimised for standards. Hosted by 
+              %a{:href => "http://canonical.com"} Canonical
+              Powered by WordPress. 
diff --git a/hig3/src/stylesheets/hig.scss b/hig3/src/stylesheets/hig.scss
index a174ea0..9cc1e00 100644
--- a/hig3/src/stylesheets/hig.scss
+++ b/hig3/src/stylesheets/hig.scss
@@ -125,16 +125,18 @@ h1 { font-size: 200%;  }
         /* COLLAPSING MENU */
         &.collapsed {
           &>li {
-            margin-top: 2em;
             padding: 0;
             a.expand {
+              background: url(../images/minus.png) no-repeat 4px 7px;
+            }
+            a.collapse {
               background: url(../images/plus.png) no-repeat 4px 7px;
             }
             &>a {
               display: block;
               color: black;
               padding-left: 24px;
-              
+              cursor: pointer;
               &:hover {
                 text-decoration: none;
               }
@@ -210,6 +212,16 @@ hr.footerart {
   background: url(../images/footer-art.png) no-repeat bottom center;
 }
 
+#footerpositioner {
+  margin: 0;
+  padding: 0;
+  width: 100%;
+  &.fixedfooter {
+    position: absolute;
+    bottom: 0;
+  }
+}
+
 #footer {
   margin: 0;
   padding: 0;
@@ -219,11 +231,7 @@ hr.footerart {
   overflow: hidden;
   position: inline;
   
-  &.fixedfooter {
-    position: absolute;
-    bottom: 0;
-  }
-  
+ 
   .copy {
    @include column(16);
    margin-top: 2em;
@@ -367,6 +375,7 @@ hr.footerart {
     .navmenu {
       font-size: 130%;
       line-height: 300%;
+      margin-bottom: 2em;
       h3 {
         margin: 2em 0 1em;
       }