From: Martijn Cuppens <martijn.cuppens@gmail.com>
Date: Wed, 1 Apr 2020 05:53:07 +0000 (+0200)
Subject: Backport #30353 (#30361)
X-Git-Tag: v4.5.0~86
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=1b575c27cd654a3af82e056af15f7621cbfa6eee;p=thirdparty%2Fbootstrap.git

Backport #30353 (#30361)

Remove appearance from date inputs

Co-authored-by: XhmikosR <xhmikosr@gmail.com>
---

diff --git a/scss/_forms.scss b/scss/_forms.scss
index b2edb7b27b..66a4efe1d4 100644
--- a/scss/_forms.scss
+++ b/scss/_forms.scss
@@ -59,6 +59,15 @@
   }
 }
 
+input[type="date"],
+input[type="time"],
+input[type="datetime-local"],
+input[type="month"] {
+  &.form-control {
+    appearance: none; // Fix appearance for date inputs in Safari
+  }
+}
+
 select.form-control {
   &:focus::-ms-value {
     // Suppress the nested default white text on blue background highlight given to
diff --git a/scss/_reboot.scss b/scss/_reboot.scss
index b6c98ccd77..e9b5a7eddd 100644
--- a/scss/_reboot.scss
+++ b/scss/_reboot.scss
@@ -376,18 +376,6 @@ input[type="checkbox"] {
 }
 
 
-input[type="date"],
-input[type="time"],
-input[type="datetime-local"],
-input[type="month"] {
-  // Remove the default appearance of temporal inputs to avoid a Mobile Safari
-  // bug where setting a custom line-height prevents text from being vertically
-  // centered within the input.
-  // See https://bugs.webkit.org/show_bug.cgi?id=139848
-  // and https://github.com/twbs/bootstrap/issues/11266
-  -webkit-appearance: listbox;
-}
-
 textarea {
   overflow: auto; // Remove the default vertical scrollbar in IE.
   // Textareas should really only resize vertically so they don't break their (horizontal) containers.