Fix focus state/simplify select triangles

diff --git a/scss/forms/_text.scss b/scss/forms/_text.scss
index ac0ced6bea75a66ac80d212b6b3e3924814d93de..8c74b6a8ab4312fa99db922552f3f93dbabe2803 100644 (file)
--- a/scss/forms/_text.scss
+++ b/scss/forms/_text.scss
@@ -87,7 +87,7 @@ $input-radius: $global-radius !default;
   // Focus state
   &:focus {
     border: $input-border-focus;
-    background: $input-background-focus;
+    background-color: $input-background-focus;
     outline: none;
     box-shadow: $input-shadow-focus;
 

diff --git a/scss/util/_mixins.scss b/scss/util/_mixins.scss
index cf209cd74b4be322c166018ce7cf92e7b792b53e..a8cb9a84c317097df8d43616cdb99b5805638d0a 100644 (file)
--- a/scss/util/_mixins.scss
+++ b/scss/util/_mixins.scss
@@ -110,9 +110,7 @@
 ///
 /// @param {Color} $color [$black] - Color to use for the triangle.
 @mixin background-triangle($color: $black) {
-  $rgb: 'rgb(#{red($color)}, #{green($color)}, #{blue($color)})';
-
-  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="32" height="24" viewBox="0 0 32 24"><polygon points="0,0 32,0 16,24" style="fill: #{$rgb}"></polygon></svg>');
+  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" version="1.1" width="32" height="24" viewBox="0 0 32 24"><polygon points="0,0 32,0 16,24" fill="#{$color}"></polygon></svg>');
 
   @media screen and (min-width:0\0) {
     @if lightness($color) < 50% {