Changeset 26417

Timestamp:

11/26/2013 09:37:20 PM (11 years ago)

Author:

iammattthomas

Message:

Remove gradients and text-shadow from ui-slider-handle and restyle it to mimic buttons. Match the background color to the chosen color scheme's -color. See #25858.

Location:

trunk/src/wp-admin/css

Files:

• color-schemes/_admin.scss (modified) (1 diff)
• colors-fresh.css (modified) (1 diff)
• wp-admin.css (modified) (2 diffs)

trunk/src/wp-admin/css/color-schemes/_admin.scss

@@ -400 +400 @@
 
 
+/* jQuery UI Slider */
+
+.wp-slider .ui-slider-handle,
+.wp-slider .ui-slider-handle.ui-state-hover,
+.wp-slider .ui-slider-handle.focus {
+    background: $button-color;
+    border-color: darken( $button-color, 10% );
+    -webkit-box-shadow: inset 0 1px 0 lighten( $button-color, 15% ), 0 1px 0 rgba(0,0,0,.15);
+    box-shadow: inset 0 1px 0 lighten( $button-color, 15% ), 0 1px 0 rgba(0,0,0,.15);
+}
+
+
 /* Responsive Component */
 

trunk/src/wp-admin/css/colors-fresh.css

@@ -1393 +1393 @@
 .wp-slider .ui-slider-handle.focus {
     background: #2ea2cc;
-    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#2ea2cc), color-stop(100%,#1e8cbe));
-    background: -webkit-linear-gradient(-45deg, #2ea2cc 0%,#1e8cbe 100%);
-    background: linear-gradient(135deg, #2ea2cc 0%,#1e8cbe 100%);
-    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2ea2cc', endColorstr='#1e8cbe',GradientType=1 );
-    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
+    border: 1px solid #0074a2;
+    -webkit-box-shadow: inset 0 1px 0 #78c8e6, 0 1px 0 rgba(0,0,0,.15);
+    box-shadow: inset 0 1px 0 #78c8e6, 0 1px 0 rgba(0,0,0,.15);
 }
 
 .wp-slider .ui-slider-handle:before {
     color: #fff;
-    text-shadow: 0 1px 1px rgba(0,116,162,1);
-}
-
-.wp-slider .ui-slider-handle.ui-state-active {
-    background: #0074a2;
-    background: -webkit-gradient(linear, left top, right bottom, color-stop(0%,#0074a2), color-stop(100%,#005684));
-    background: -webkit-linear-gradient(-45deg,  #0074a2 0%,#005684 100%);
-    background: linear-gradient(135deg,  #0074a2 0%,#005684 100%);
-    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0074a2', endColorstr='#005684',GradientType=1 );
 }
 

trunk/src/wp-admin/css/wp-admin.css

@@ -4962 +4962 @@
 .wp-slider .ui-slider-handle {
     border-radius: 50%;
-    height: 20px;
-    margin-top: -2px;
+    height: 18px;
+    margin-top: -3px;
     outline: none;
     position: absolute;
-    width: 20px;
+    width: 18px;
     z-index: 2;
 }
@@ -4973 +4973 @@
     background: none;
     position: absolute;
-    margin-top: 1px;
-    margin-left: 1px;
     top: 0;
     left: 0;