From 384336b99a322ad7b7a6ca85b62ad34b20cd8314 Mon Sep 17 00:00:00 2001
From: David DeSandro <david@desandro.com>
Date: Mon, 27 Dec 2010 21:15:25 -0500
Subject: [PATCH] html : clean sort

---
 _layouts/elements.html | 45 +++++++++++++++++++++++++-----------------
 css/style.css          |  8 ++++----
 2 files changed, 31 insertions(+), 22 deletions(-)

diff --git a/_layouts/elements.html b/_layouts/elements.html
index 385e789..07f8c38 100644
--- a/_layouts/elements.html
+++ b/_layouts/elements.html
@@ -40,25 +40,34 @@
     </ul>
 
 
-    <h3>Sort Ascending</h3>
-
-    <ul id="sort-asc" class="sort asc option-set floated clearfix">
-      <li><a href="#original-order" class="selected">original-order asc</a></li>
-      <li><a href="#name">name asc</a></li>
-      <li><a href="#symbol">symbol asc</a></li>
-      <li><a href="#number">number asc</a></li>
-      <li><a href="#weight">weight asc</a></li>
-      <li><a href="#category">category asc</a></li>
+    <h3>Sort</h3>
+    
+    <ul id="sort" class="sort option-set">
+      <li>
+        <ul class="sort asc option-set floated clearfix">
+          <li><a href="#original-order" class="selected">original-order (asc)</a></li>
+          <li><a href="#name">name (asc)</a></li>
+          <li><a href="#symbol">symbol (asc)</a></li>
+          <li><a href="#number">number (asc)</a></li>
+          <li><a href="#weight">weight (asc)</a></li>
+          <li><a href="#category">category (asc)</a></li>
+        </ul>
+      </li>
+      <li>
+        <ul class="sort desc option-set floated clearfix">
+          <li><a href="#original-order">original-order (desc)</a></li>
+          <li><a href="#name">name (desc)</a></li>
+          <li><a href="#symbol">symbol (desc)</a></li>
+          <li><a href="#number">number (desc)</a></li>
+          <li><a href="#weight">weight (desc)</a></li>
+          <li><a href="#category">category (desc)</a></li>
+        </ul>
+      </li>
     </ul>
 
-    <ul id="sort-desc" class="sort desc option-set floated clearfix">
-      <li><a href="#original-order">original-order desc</a></li>
-      <li><a href="#name">name desc</a></li>
-      <li><a href="#symbol">symbol desc</a></li>
-      <li><a href="#number">number desc</a></li>
-      <li><a href="#weight">weight desc</a></li>
-      <li><a href="#category">category desc</a></li>
-    </ul>
+
+
+
 
     <h3>Layouts</h3>
   
@@ -167,7 +176,7 @@
         return false;
       });
 
-      $('.sort a').click(function(){
+      $('#sort a').click(function(){
         // get href attribute, minus the #
         var $this = $(this),
             sortName = $this.attr('href').slice(1),
diff --git a/css/style.css b/css/style.css
index 546ea09..fdbc36b 100644
--- a/css/style.css
+++ b/css/style.css
@@ -245,22 +245,22 @@ body {
   font-weight: bold;
   text-shadow: 0 1px hsla( 0, 0%, 100%, 0.5 );
   background-image: -moz-linear-gradient(-90deg, 
-    hsla( 0, 0%, 100%, 0.4 ) , 
+    hsla( 0, 0%, 100%, 0.3 ) , 
     hsla( 0, 0%, 100%, 0.0 ) 
   );
   background-image: -webkit-gradient(linear, 0 top, 0 bottom, 
-    from( hsla( 0, 0%, 100%, 0.4 ) ), 
+    from( hsla( 0, 0%, 100%, 0.3 ) ), 
     to(   hsla( 0, 0%, 100%, 0.0 ) )
   );
     margin-bottom: 0.2em;
 }
 
 #options li a:hover {
-  background-color: #2BF;
+  background-color: #5BF;
 }
 
 #options li a:active {
-  background-color: #29D;
+  background-color: #39D;
   -webkit-box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );
      -moz-box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );
        -o-box-shadow: inset 0 2px 8px hsla( 0, 0%, 0%, 0.6 );