From f34d0c298e8c07fe9650b97a61d7f38d6c4e4770 Mon Sep 17 00:00:00 2001
From: "Manu Mtz.-Almeida" <manu.valladolid@gmail.com>
Date: Thu, 6 Oct 2016 22:18:00 +0200
Subject: [PATCH] refactor(css): appearance mixin (#8212)

---
 src/components/alert/alert.ios.scss | 4 ++--
 src/components/alert/alert.scss     | 4 ++--
 src/components/input/input.scss     | 3 +--
 src/components/slides/slides.scss   | 6 ++----
 src/themes/ionic.mixins.scss        | 4 +++-
 5 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/src/components/alert/alert.ios.scss b/src/components/alert/alert.ios.scss
index 6427422fff..384ac4a187 100644
--- a/src/components/alert/alert.ios.scss
+++ b/src/components/alert/alert.ios.scss
@@ -149,14 +149,14 @@ $alert-ios-checkbox-icon-transform:             rotate(45deg) !default;
 // --------------------------------------------------
 
 .alert-ios .alert-input {
+  @include appearance(none);
+
   margin-top: $alert-ios-input-margin-top;
   padding: $alert-ios-input-padding;
 
   border: $alert-ios-input-border;
   border-radius: $alert-ios-input-border-radius;
   background-color: $alert-ios-input-background-color;
-
-  -webkit-appearance: none;
 }
 
 
diff --git a/src/components/alert/alert.scss b/src/components/alert/alert.scss
index 6bbdf3ab2d..b77584fc71 100644
--- a/src/components/alert/alert.scss
+++ b/src/components/alert/alert.scss
@@ -89,6 +89,8 @@ ion-alert input {
 }
 
 .alert-tappable {
+  @include appearance(none);
+
   margin: 0;
   padding: 0;
 
@@ -98,6 +100,4 @@ ion-alert input {
   line-height: initial;
   text-align: left;
   background: transparent;
-
-  -webkit-appearance: none;
 }
diff --git a/src/components/input/input.scss b/src/components/input/input.scss
index 710c6e1621..bdb4929c5e 100644
--- a/src/components/input/input.scss
+++ b/src/components/input/input.scss
@@ -32,6 +32,7 @@ ion-textarea {
 
 .text-input {
   @include placeholder();
+  @include appearance(none);
 
   display: inline-block;
 
@@ -43,8 +44,6 @@ ion-textarea {
   border: 0;
   border-radius: 0;
   background: transparent;
-
-  -webkit-appearance: none;
 }
 
 textarea.text-input {
diff --git a/src/components/slides/slides.scss b/src/components/slides/slides.scss
index bee9e3153a..471b25eeb1 100644
--- a/src/components/slides/slides.scss
+++ b/src/components/slides/slides.scss
@@ -176,14 +176,12 @@
   opacity: .2;
 }
 button.swiper-pagination-bullet {
+  @include appearance(none);
+
   border: 0;
   margin: 0;
   padding: 0;
   box-shadow: none;
-  -moz-appearance: none;
-  -ms-appearance: none;
-  -webkit-appearance: none;
-  appearance: none;
 }
 .swiper-pagination-clickable .swiper-pagination-bullet {
   cursor: pointer;
diff --git a/src/themes/ionic.mixins.scss b/src/themes/ionic.mixins.scss
index 215b6c7ee7..6079faf992 100644
--- a/src/themes/ionic.mixins.scss
+++ b/src/themes/ionic.mixins.scss
@@ -3,8 +3,10 @@
 // --------------------------------------------------
 
 @mixin appearance($val) {
-  -webkit-appearance: $val;
   -moz-appearance: $val;
+  -ms-appearance: $val;
+  -webkit-appearance: $val;
+  appearance: $val;
 }