From 136ba7262d35cf714edf898f47d4ef85028d971b Mon Sep 17 00:00:00 2001
From: Adam Bradley <adamdbradley@gmail.com>
Date: Mon, 18 Nov 2013 10:05:54 -0600
Subject: [PATCH] active list bg fix

---
 dist/css/ionic.css   | 42 ++++++++++++++++++++----------------------
 scss/_items.scss     |  5 -----
 scss/_mixins.scss    |  6 ++++--
 scss/_variables.scss |  2 +-
 test/lists.html      |  2 +-
 5 files changed, 26 insertions(+), 31 deletions(-)

diff --git a/dist/css/ionic.css b/dist/css/ionic.css
index a2f2f9c74d..a35dbfe04c 100644
--- a/dist/css/ionic.css
+++ b/dist/css/ionic.css
@@ -1361,8 +1361,8 @@ a.subdued‎ {
   border-style: solid;
   font-size: 16px;
   -webkit-transition: margin-left 0.2s ease-in-out, margin-right 0.2s ease-in-out, left 0.2s ease-in-out; }
-  .item.active, .item:active {
-    background-color: activeBgColor;
+  .item.active, .ionic-pseudo .item:active {
+    background-color: #d9d9d9;
     border-color: #cccccc; }
   .item h2 {
     margin: 0 0 4px 0;
@@ -1391,70 +1391,68 @@ a.subdued‎ {
     float: right; }
   .item .badge + .badge {
     margin-right: 5px; }
-  .item.active, .ionic-pseudo .item:active {
-    box-shadow: inset 0px 1px 3px rgba(0, 0, 0, 0.12); }
   .item.item-light {
     color: #444444;
     background-color: white;
     border-color: #dddddd; }
-    .item.item-light.active, .item.item-light:active {
-      background-color: activeBgColor;
+    .item.item-light.active, .ionic-pseudo .item.item-light:active {
+      background-color: #fafafa;
       border-color: #cccccc; }
   .item.item-stable {
     color: #444444;
     background-color: #f8f8f8;
     border-color: #b2b2b2; }
-    .item.item-stable.active, .item.item-stable:active {
-      background-color: activeBgColor;
+    .item.item-stable.active, .ionic-pseudo .item.item-stable:active {
+      background-color: #e5e5e5;
       border-color: #a2a2a2; }
   .item.item-positive {
     color: white;
     background-color: #4a87ee;
     border-color: #145dd7; }
-    .item.item-positive.active, .item.item-positive:active {
-      background-color: activeBgColor;
+    .item.item-positive.active, .ionic-pseudo .item.item-positive:active {
+      background-color: #145dd7;
       border-color: #145dd7; }
   .item.item-calm {
     color: white;
     background-color: #43cee6;
     border-color: #1aaac3; }
-    .item.item-calm.active, .item.item-calm:active {
-      background-color: activeBgColor;
+    .item.item-calm.active, .ionic-pseudo .item.item-calm:active {
+      background-color: #1aaac3;
       border-color: #1aaac3; }
   .item.item-assertive {
     color: white;
     background-color: #ef4e3a;
     border-color: #cc2511; }
-    .item.item-assertive.active, .item.item-assertive:active {
-      background-color: activeBgColor;
+    .item.item-assertive.active, .ionic-pseudo .item.item-assertive:active {
+      background-color: #cc2511;
       border-color: #cc2511; }
   .item.item-balanced {
     color: white;
     background-color: #66cc33;
     border-color: #478f24; }
-    .item.item-balanced.active, .item.item-balanced:active {
-      background-color: activeBgColor;
+    .item.item-balanced.active, .ionic-pseudo .item.item-balanced:active {
+      background-color: #478f24;
       border-color: #478f24; }
   .item.item-energized {
     color: white;
     background-color: #f0b840;
     border-color: #d39511; }
-    .item.item-energized.active, .item.item-energized:active {
-      background-color: activeBgColor;
+    .item.item-energized.active, .ionic-pseudo .item.item-energized:active {
+      background-color: #d39511;
       border-color: #d39511; }
   .item.item-royal {
     color: white;
     background-color: #8a6de9;
     border-color: #552bdf; }
-    .item.item-royal.active, .item.item-royal:active {
-      background-color: activeBgColor;
+    .item.item-royal.active, .ionic-pseudo .item.item-royal:active {
+      background-color: #552bdf;
       border-color: #552bdf; }
   .item.item-dark {
     color: white;
     background-color: #444444;
     border-color: #111111; }
-    .item.item-dark.active, .item.item-dark:active {
-      background-color: activeBgColor;
+    .item.item-dark.active, .ionic-pseudo .item.item-dark:active {
+      background-color: #262626;
       border-color: black; }
 
 .item,
diff --git a/scss/_items.scss b/scss/_items.scss
index 26dc0e08b4..79870f4e4a 100644
--- a/scss/_items.scss
+++ b/scss/_items.scss
@@ -60,11 +60,6 @@
     margin-right: 5px;
   }
 
-  &.active,
-  .ionic-pseudo &:active {
-    box-shadow: inset 0px 1px 3px rgba(0,0,0,0.12);
-  }
-
   // Different themes for list items
   &.item-light { 
     @include item-style($item-light-bg, $item-light-border, $item-light-text, $item-light-active-bg, $item-light-active-border);
diff --git a/scss/_mixins.scss b/scss/_mixins.scss
index 74b3d28ba9..9b0675dc88 100644
--- a/scss/_mixins.scss
+++ b/scss/_mixins.scss
@@ -84,8 +84,8 @@
   border-color: $border-color;
 
   &.active, 
-  &:active {
-    background-color: activeBgColor;
+  .ionic-pseudo &:active {
+    background-color: $active-bg-color;
     border-color: $active-border-color;
   }
 }
@@ -139,6 +139,7 @@
   @include size($size, $size);
 }
 
+
 // Placeholder text
 // -------------------------
 @mixin placeholder($color: $input-color-placeholder) {
@@ -153,6 +154,7 @@
   }
 }
 
+
 // Text overflow
 // -------------------------
 // Requires inline-block or block for proper styling
diff --git a/scss/_variables.scss b/scss/_variables.scss
index 1cc6f7748d..3804d69d49 100644
--- a/scss/_variables.scss
+++ b/scss/_variables.scss
@@ -347,7 +347,7 @@ $item-dark-active-border:          $button-dark-active-border;
 $item-default-bg:                  $item-light-bg;
 $item-default-border:              $item-light-border;
 $item-default-text:                $item-light-text;
-$item-default-active-bg:           $item-light-active-bg;
+$item-default-active-bg:           #D9D9D9;
 $item-default-active-border:       $item-light-active-border;
 
 
diff --git a/test/lists.html b/test/lists.html
index 602afb334e..33643e497d 100644
--- a/test/lists.html
+++ b/test/lists.html
@@ -14,7 +14,7 @@
       }
     </style>
   </head>
-  <body>
+  <body class="ionic-pseudo">
 
     <header class="bar bar-header bar-dark">
       <h1 class="title">Lists</h1>