From 9e6dd21c890e775e9a919db0a3d7fcb1e981c989 Mon Sep 17 00:00:00 2001
From: Alex Pott <alex.a.pott@googlemail.com>
Date: Thu, 31 Jul 2014 13:39:41 +0100
Subject: [PATCH] Issue #2207391 by LewisNyman, emma.maria, lokapujya: Style
select elements in Webkit only.
---
core/misc/icons/333333/caret-down.svg | 1 +
core/themes/seven/css/style.css | 39 ++++++++++++++++++++++++---
2 files changed, 36 insertions(+), 4 deletions(-)
create mode 100644 core/misc/icons/333333/caret-down.svg
diff --git a/core/misc/icons/333333/caret-down.svg b/core/misc/icons/333333/caret-down.svg
new file mode 100644
index 000000000000..4e48c8c98300
--- /dev/null
+++ b/core/misc/icons/333333/caret-down.svg
@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16"><path fill="#333333" d="M3.8 5.4c-.165-.22-.075-.4.2-.4h8.002c.275 0 .365.18.199.4l-3.898 5.2c-.166.221-.436.221-.6 0l-3.903-5.2z"/></svg>
diff --git a/core/themes/seven/css/style.css b/core/themes/seven/css/style.css
index c911eee58a1b..ff81295a29d6 100644
--- a/core/themes/seven/css/style.css
+++ b/core/themes/seven/css/style.css
@@ -831,8 +831,7 @@ input.form-color,
input.form-file,
input.form-date,
input.form-time,
-textarea.form-textarea,
-select.form-select {
+textarea.form-textarea {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
@@ -861,8 +860,7 @@ select.form-select {
.form-file:focus,
.form-textarea:focus,
.form-date:focus,
-.form-time:focus,
-.form-select:focus {
+.form-time:focus {
border-color: #40b6ff;
outline: 0;
box-shadow: inset 0 1px 3px rgba(0, 0, 0, .05), 0 0 8px #40b6ff;
@@ -888,6 +886,39 @@ select.form-select {
}
+/**
+ * Select elements - Webkit only
+ */
+@media screen and (-webkit-min-device-pixel-ratio: 0) {
+ select {
+ cursor: pointer;
+ -webkit-appearance: none;
+ padding: 1px 1.571em 1px 0.5em; /* LTR */
+ border: 1px solid #a6a6a6;
+ border-radius: 0.143em;
+ background:
+ url("../../../misc/icons/333333/caret-down.svg") no-repeat 99% 63%,
+ -webkit-linear-gradient(top, #f6f6f3, #e7e7df); /* LTR */
+ text-shadow: 0 1px hsla(0, 0%, 100%, 0.6);
+ font-size: 0.875rem;
+ transition: all 0.1s;
+ -webkit-font-smoothing: antialiased;
+ }
+ [dir="rtl"] select {
+ padding: 1px 0.714em 1px 1.571em;
+ background-position: 1% 63%, 0 0;
+ }
+ select:focus,
+ select:hover {
+ background-image: url("../../../misc/icons/333333/caret-down.svg"),
+ -webkit-linear-gradient(top, #fcfcfa, #e9e9dd);
+ color: #1a1a1a;
+ }
+ select:hover {
+ box-shadow: 0 1px 2px hsla(0, 0%, 0%, 0.125);
+ }
+}
+
/**
* Improve spacing of cancel link.
*/
--
GitLab