From 08002abcef90e0ed73ce97c249c1982d596e0db3 Mon Sep 17 00:00:00 2001
From: Hadi Nategh <hnategh@gmail.com>
Date: Wed, 14 Sep 2016 11:19:31 +0200
Subject: [PATCH] Make selectbox's style more consistence among all browsers

---
 pixelegg/css/mobile.css                    | 22 +++++++++++---------
 pixelegg/css/pixelegg.css                  | 22 +++++++++++---------
 pixelegg/less/layout_content_elements.less | 24 +++++++++++-----------
 pixelegg/mobile/fw_mobile.css              | 22 +++++++++++---------
 4 files changed, 48 insertions(+), 42 deletions(-)

diff --git a/pixelegg/css/mobile.css b/pixelegg/css/mobile.css
index 66edec30c4..69f648c16c 100644
--- a/pixelegg/css/mobile.css
+++ b/pixelegg/css/mobile.css
@@ -2626,7 +2626,8 @@ div.client_error_log tr td.stack > div {
 * ########################################################################################
 */
 body,
-textarea {
+textarea,
+button {
   font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
 }
 #egw_fw_basecontainer {
@@ -2696,6 +2697,16 @@ div.selectbox-wrapper ul li {
 }
 select {
   position: relative;
+  padding-right: 20px !important;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  margin: 0;
+  background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
+  background-size: 16px auto;
+}
+/*IE has no appearance but we can remove arrows by ms-expand*/
+select::-ms-expand {
+  display: none;
 }
 select,
 input,
@@ -2792,15 +2803,6 @@ table.table_passord_change tr {
 table.table_passord_change td:first-child {
   padding-right: 4em;
 }
-@media screen and (-webkit-min-device-pixel-ratio: 0) {
-  select {
-    padding-right: 20px !important;
-    -webkit-appearance: none;
-    margin: 0;
-    background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
-    background-size: 16px auto;
-  }
-}
 /**
  * EGroupware: Stylite Pixelegg template
  *
diff --git a/pixelegg/css/pixelegg.css b/pixelegg/css/pixelegg.css
index 38b8eccfb3..f5dc61de05 100644
--- a/pixelegg/css/pixelegg.css
+++ b/pixelegg/css/pixelegg.css
@@ -2615,7 +2615,8 @@ div.client_error_log tr td.stack > div {
 * ########################################################################################
 */
 body,
-textarea {
+textarea,
+button {
   font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
 }
 #egw_fw_basecontainer {
@@ -2685,6 +2686,16 @@ div.selectbox-wrapper ul li {
 }
 select {
   position: relative;
+  padding-right: 20px !important;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  margin: 0;
+  background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
+  background-size: 16px auto;
+}
+/*IE has no appearance but we can remove arrows by ms-expand*/
+select::-ms-expand {
+  display: none;
 }
 select,
 input,
@@ -2781,15 +2792,6 @@ table.table_passord_change tr {
 table.table_passord_change td:first-child {
   padding-right: 4em;
 }
-@media screen and (-webkit-min-device-pixel-ratio: 0) {
-  select {
-    padding-right: 20px !important;
-    -webkit-appearance: none;
-    margin: 0;
-    background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
-    background-size: 16px auto;
-  }
-}
 /**
  * EGroupware: Stylite Pixelegg template
  *
diff --git a/pixelegg/less/layout_content_elements.less b/pixelegg/less/layout_content_elements.less
index 1f7ebbb326..2ac5b6904f 100755
--- a/pixelegg/less/layout_content_elements.less
+++ b/pixelegg/less/layout_content_elements.less
@@ -25,7 +25,8 @@
 
 
 body,
-textarea {
+textarea,
+button {
 	.basefontfamily;
 }
 
@@ -96,8 +97,17 @@ div.selectbox-wrapper {
 
 select {
 	position:relative;
+	padding-right: 20px !important;
+	-webkit-appearance:none;
+	-moz-appearance: none;
+	margin:0;
+	background:  #ffffff url(../images/selectarrowdown.png) no-repeat center right;
+	background-size: 16px auto;
+}
+/*IE has no appearance but we can remove arrows by ms-expand*/
+select::-ms-expand {
+	display: none;
 }
-
 select,input,button
 {
 	.color_100_gray;
@@ -201,13 +211,3 @@ table.table_passord_change {
 
 }
 
-/////* Targetting Webkit browsers only. FF will show the dropdown arrow with so much padding. */
-@media screen and (-webkit-min-device-pixel-ratio:0) {
-	select {
-		padding-right: 20px !important;
-		-webkit-appearance:none;
-		margin:0;
-		background:  #ffffff url(../images/selectarrowdown.png) no-repeat center right;
-		background-size: 16px auto;
-	}
-}
diff --git a/pixelegg/mobile/fw_mobile.css b/pixelegg/mobile/fw_mobile.css
index 18412cd27e..9bf647e249 100644
--- a/pixelegg/mobile/fw_mobile.css
+++ b/pixelegg/mobile/fw_mobile.css
@@ -2637,7 +2637,8 @@ div.client_error_log tr td.stack > div {
 * ########################################################################################
 */
 body,
-textarea {
+textarea,
+button {
   font-family: Verdana, "Lucida Grande", Helvetica, Sans-Serif;
 }
 #egw_fw_basecontainer {
@@ -2707,6 +2708,16 @@ div.selectbox-wrapper ul li {
 }
 select {
   position: relative;
+  padding-right: 20px !important;
+  -webkit-appearance: none;
+  -moz-appearance: none;
+  margin: 0;
+  background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
+  background-size: 16px auto;
+}
+/*IE has no appearance but we can remove arrows by ms-expand*/
+select::-ms-expand {
+  display: none;
 }
 select,
 input,
@@ -2803,15 +2814,6 @@ table.table_passord_change tr {
 table.table_passord_change td:first-child {
   padding-right: 4em;
 }
-@media screen and (-webkit-min-device-pixel-ratio: 0) {
-  select {
-    padding-right: 20px !important;
-    -webkit-appearance: none;
-    margin: 0;
-    background: #ffffff url(../images/selectarrowdown.png) no-repeat center right;
-    background-size: 16px auto;
-  }
-}
 /**
  * EGroupware: Stylite Pixelegg template
  *