Opacity on draggable dragging objects

Author: philwareham

dist/textpattern/jquery-ui.css

@@ -265,6 +265,7 @@ a.ui-state-default:focus {
  */
 .ui-draggable-dragging {
   z-index: 1000;
+  opacity: 0.66;
   box-shadow: 0 0 0.5em rgba(0, 0, 0, 0.2);
 }
 
@@ -577,7 +578,6 @@ a.ui-state-default:focus {
   /* 4 */
   cursor: pointer;
   -webkit-user-select: none;
-     -moz-user-select: none;
       -ms-user-select: none;
           user-select: none;
 }
@@ -1573,7 +1573,6 @@ input.ui-button.ui-icon-notext .ui-icon {
   font-family: inherit;
   cursor: pointer;
   -webkit-user-select: auto;
-     -moz-user-select: auto;
       -ms-user-select: auto;
           user-select: auto;
 }
@@ -1946,7 +1945,8 @@ button:not(.ui-button):focus .ui-icon {
  * Default state icons.
  */
 .ui-state-default .ui-icon {
-  filter: brightness(1.6666667);
+  -webkit-filter: brightness(1.6666667);
+          filter: brightness(1.6666667);
 }
 
 /**
@@ -1961,7 +1961,8 @@ button:not(.ui-button):focus .ui-icon {
  */
 .success .ui-icon,
 .success.ui-icon {
-  filter: brightness(2) sepia(1) hue-rotate(82deg) saturate(250%) brightness(90%);
+  -webkit-filter: brightness(2) sepia(1) hue-rotate(82deg) saturate(250%) brightness(90%);
+          filter: brightness(2) sepia(1) hue-rotate(82deg) saturate(250%) brightness(90%);
 }
 
 /**
@@ -1977,7 +1978,8 @@ button:not(.ui-button):focus .ui-icon {
 .ui-state-highlight .ui-icon,
 .warning .ui-icon,
 .warning.ui-icon {
-  filter: brightness(2) sepia(1) hue-rotate(4deg) saturate(500%) brightness(112%);
+  -webkit-filter: brightness(2) sepia(1) hue-rotate(4deg) saturate(500%) brightness(112%);
+          filter: brightness(2) sepia(1) hue-rotate(4deg) saturate(500%) brightness(112%);
 }
 
 /**
@@ -1996,7 +1998,8 @@ button:not(.ui-button):focus .ui-icon {
 .error.ui-icon,
 .destroy .ui-icon,
 .destroy.ui-icon {
-  filter: brightness(2) sepia(1) hue-rotate(-62deg) saturate(750%) brightness(65%);
+  -webkit-filter: brightness(2) sepia(1) hue-rotate(-62deg) saturate(750%) brightness(65%);
+          filter: brightness(2) sepia(1) hue-rotate(-62deg) saturate(750%) brightness(65%);
 }
 
 /**
@@ -2011,15 +2014,17 @@ button:not(.ui-button):focus .ui-icon {
  */
 .information .ui-icon,
 .information.ui-icon {
-  filter: brightness(2) sepia(1) hue-rotate(150deg) saturate(600%) brightness(80%);
+  -webkit-filter: brightness(2) sepia(1) hue-rotate(150deg) saturate(600%) brightness(80%);
+          filter: brightness(2) sepia(1) hue-rotate(150deg) saturate(600%) brightness(80%);
 }
 
 /**
  * 'White out' (inversed) icons.
  */
 .ui-icon-inversed,
 #messagepane .ui-icon {
-  filter: brightness(5);
+  -webkit-filter: brightness(5);
+          filter: brightness(5);
 }
 
 /**
@@ -2035,7 +2040,8 @@ input[type=button] .ui-icon,
 .ui-state-hover .ui-icon .ui-icon,
 .ui-state-focus .ui-icon .ui-icon,
 .ui-state-active .ui-icon .ui-icon {
-  filter: none !important;
+  -webkit-filter: none !important;
+          filter: none !important;
 }
 
 /* Icon set.

scss/modules/_draggable.scss

@@ -28,5 +28,6 @@
 
 .ui-draggable-dragging {
     z-index: 1000;
+    opacity: 0.66;
     box-shadow: $standard-shadow;
 }