From 6634952a9f44b11d96c771f9585be479420ef344 Mon Sep 17 00:00:00 2001
From: connors <connor.sears@github.com>
Date: Tue, 8 Oct 2013 15:50:45 -0700
Subject: [PATCH] Cleaning up the tab bar active states.

---
 dist/ratchet.css   | 19 +++++++++++--------
 lib/sass/bars.scss | 30 ++++++++++++++++++++----------
 2 files changed, 31 insertions(+), 18 deletions(-)

diff --git a/dist/ratchet.css b/dist/ratchet.css
index 2a62730..487daf2 100644
--- a/dist/ratchet.css
+++ b/dist/ratchet.css
@@ -360,20 +360,23 @@ strong {
   -webkit-box-flex: 1;
   box-flex: 1;
 }
+.tab-item .tab-label,
 .tab-item .icon {
-  width: 24px;
-  height: 24px;
-  margin-top: -2px;
+  color: #929292;
 }
-
-.tab-label {
+.tab-item .tab-label {
   margin-top: -2px;
   font-size: 11px;
   font-weight: 400;
-  color: #929292;
 }
-
-.tab-item.active .tab-label {
+.tab-item .icon {
+  width: 24px;
+  height: 24px;
+  margin-top: -2px;
+}
+.tab-item.active .tab-label,
+.tab-item.active .icon, .tab-item:active .tab-label,
+.tab-item:active .icon {
   color: #007aff;
 }
 
diff --git a/lib/sass/bars.scss b/lib/sass/bars.scss
index b13093b..3794d20 100644
--- a/lib/sass/bars.scss
+++ b/lib/sass/bars.scss
@@ -99,22 +99,32 @@
   text-align: center;
   @include box-flex(1);
 
+  .tab-label,
+  .icon {
+    color: $default-color;
+  }
+
+  // Label for tab
+  .tab-label {
+    margin-top: -2px;
+    font-size: 11px;
+    font-weight: 400;
+  }
+  
   .icon {
     width: 24px;
     height: 24px;
     margin-top: -2px;
   }
-}
 
-// Label for tab
-.tab-label {
-  margin-top: -2px;
-  font-size: 11px;
-  font-weight: 400;
-  color: $default-color;
-}
-.tab-item.active .tab-label {
-  color: $primary-color;
+  // Active states for the tab bar
+  &.active,
+  &:active {
+    .tab-label,
+    .icon {
+      color: $primary-color;
+    }
+  }
 }
 
 // Nav bar in popovers