From 40a9615ae3c462f2b963d54b31ad88752070ad4e Mon Sep 17 00:00:00 2001
From: Brandy Carney <brandyscarney@gmail.com>
Date: Tue, 3 Nov 2015 18:04:14 -0500
Subject: [PATCH] fix(searchbar): removing background on activation of
 searchbar buttons md

references #247
---
 ionic/components/searchbar/modes/md.scss | 18 +++++++++++++-----
 1 file changed, 13 insertions(+), 5 deletions(-)

diff --git a/ionic/components/searchbar/modes/md.scss b/ionic/components/searchbar/modes/md.scss
index ba05cdd34c..2ec635638c 100644
--- a/ionic/components/searchbar/modes/md.scss
+++ b/ionic/components/searchbar/modes/md.scss
@@ -26,13 +26,17 @@ ion-searchbar {
 }
 
 .searchbar-search-icon,
-.searchbar-cancel-icon {
+button.searchbar-cancel-icon {
   width: $searchbar-md-input-search-icon-size + 1;
   height: $searchbar-md-input-search-icon-size + 1;
 
   background-size: $searchbar-md-input-search-icon-size;
   background-repeat: no-repeat;
   position: absolute;
+
+  &.activated {
+    background-color: transparent;
+  }
 }
 
 .searchbar-search-icon {
@@ -41,7 +45,7 @@ ion-searchbar {
   @include svg-background-image($searchbar-md-input-search-icon-svg);
 }
 
-.searchbar-cancel-icon {
+button.searchbar-cancel-icon {
   display: none;
   height: 100%;
   margin: 0;
@@ -66,7 +70,7 @@ ion-searchbar {
   @include placeholder($searchbar-md-input-placeholder-color);
 }
 
-.searchbar-close-icon {
+button.searchbar-close-icon {
   width: $searchbar-md-input-close-icon-size;
   height: 100%;
   padding: 0;
@@ -78,6 +82,10 @@ ion-searchbar {
   position: absolute;
   right: 13px;
   top: 0;
+
+  &.activated {
+    background-color: transparent;
+  }
 }
 
 .searchbar-cancel {
@@ -90,7 +98,7 @@ ion-searchbar {
     display: none;
   }
 
-  .searchbar-cancel-icon {
+  button.searchbar-cancel-icon {
     display: inline-flex;
   }
 
@@ -102,7 +110,7 @@ ion-searchbar {
     padding: 3px;
   }
 
-  .searchbar-cancel-icon {
+  button.searchbar-cancel-icon {
     left: 14px;
   }