From 039a49979af1011edcc99bda14a9eb385e79477f Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?P=C3=A1sztor=20G=C3=A1bor?= <gpasztor87@gmail.com>
Date: Wed, 21 Dec 2016 20:15:07 +0100
Subject: [PATCH] Style improvements on reportcontainer's manage widget
 dropdown.

---
 .../assets/css/reportcontainer.css            | 10 +++++----
 .../assets/less/reportcontainer.less          | 21 ++++++-------------
 .../widgets/table/assets/css/table.css        |  6 ++----
 .../widgets/table/assets/less/table.less      |  6 ++----
 4 files changed, 16 insertions(+), 27 deletions(-)

diff --git a/modules/backend/widgets/reportcontainer/assets/css/reportcontainer.css b/modules/backend/widgets/reportcontainer/assets/css/reportcontainer.css
index a1e1c9bb6..401799efc 100644
--- a/modules/backend/widgets/reportcontainer/assets/css/reportcontainer.css
+++ b/modules/backend/widgets/reportcontainer/assets/css/reportcontainer.css
@@ -1,3 +1,6 @@
+.report-container {
+  margin-bottom: 15px;
+}
 .report-container > ul {
   list-style: none;
   padding: 0;
@@ -120,9 +123,9 @@
   width: 100%;
 }
 .report-container > ul .item.dragged {
-  -webkit-transition-duration: 0!important;
-  -moz-transition-duration: 0!important;
-  transition-duration: 0!important;
+  -webkit-transition-duration: 0s !important;
+  -moz-transition-duration: 0s !important;
+  transition-duration: 0s !important;
   -webkit-transform: translate3d(0, 0, 0) !important;
   transform: translate3d(0, 0, 0) !important;
   position: absolute;
@@ -152,7 +155,6 @@
   -moz-border-radius: 3px;
   border-radius: 3px;
   margin-left: 5px;
-  margin-bottom: 15px;
 }
 .report-container .manage-widgets i {
   margin-right: 5px;
diff --git a/modules/backend/widgets/reportcontainer/assets/less/reportcontainer.less b/modules/backend/widgets/reportcontainer/assets/less/reportcontainer.less
index 57da0595f..28ba91a45 100644
--- a/modules/backend/widgets/reportcontainer/assets/less/reportcontainer.less
+++ b/modules/backend/widgets/reportcontainer/assets/less/reportcontainer.less
@@ -1,6 +1,7 @@
 @import "../../../../assets/less/core/boot.less";
 
 .report-container {
+    margin-bottom: 15px;
     > ul {
         list-style: none;
         padding: 0;
@@ -106,12 +107,8 @@
             &.width-10 {width: 100%;}
 
             &.dragged {
-                -webkit-transition-duration: 0!important;
-                -moz-transition-duration: 0!important;
-                transition-duration: 0!important;
-
-                .translate3d(0, 0, 0)!important;
-
+                .transition-duration(0s) !important;
+                .translate3d(0, 0, 0) !important;
                 position: absolute;
                 opacity: 0.5;
                 z-index: 2000;
@@ -146,7 +143,6 @@
         border: 1px dashed #bcc3c7;
         .border-radius(@border-radius-base);
         margin-left: 5px;
-        margin-bottom: 15px;
 
         i {
             margin-right: 5px;
@@ -173,16 +169,11 @@
 
     &.isotope,
     &.isotope .isotope-item {
-      -webkit-transition-duration: 0.8s;
-         -moz-transition-duration: 0.8s;
-              transition-duration: 0.8s;
-
+      .transition-duration(0.8s);
     }
 
     &.isotope {
-      -webkit-transition-property: height, width;
-         -moz-transition-property: height, width;
-              transition-property: height, width;
+      .transition-property(height, width);
     }
 
     &.isotope .isotope-item {
@@ -198,7 +189,7 @@
             // The breakpoint should be defined in the CSS and JS,
             // otherwise some widgets can't calculate the width properly, 
             // as the JS is applied too late.
-            width: 100%!important;
+            width: 100% !important;
         }
     }
 }
\ No newline at end of file
diff --git a/modules/backend/widgets/table/assets/css/table.css b/modules/backend/widgets/table/assets/css/table.css
index c52253e61..bdf6eb9c6 100644
--- a/modules/backend/widgets/table/assets/css/table.css
+++ b/modules/backend/widgets/table/assets/css/table.css
@@ -158,8 +158,7 @@
   margin-right: 8px;
   position: relative;
   top: 3px;
-  background: transparent url(../images/table-icons.gif) no-repeat;
-  background-position: 0 0;
+  background: transparent url(../images/table-icons.gif) no-repeat 0 0;
   background-size: 32px auto;
 }
 .control-table .toolbar a.table-icon.add-table-row-above:before {
@@ -334,9 +333,8 @@ ul.table-widget-autocomplete li a {
 }
 /* Frameless control styles end */
 html.cssanimations .control-table td[data-column-type=dropdown] [data-view-container].loading:after {
-  background-image: url('../../../../../../modules/system/assets/ui/images/loader-transparent.svg');
+  background: url('../../../../../../modules/system/assets/ui/images/loader-transparent.svg') 50% 50%;
   background-size: 15px 15px;
-  background-position: 50% 50%;
   position: absolute;
   width: 15px;
   height: 15px;
diff --git a/modules/backend/widgets/table/assets/less/table.less b/modules/backend/widgets/table/assets/less/table.less
index f33458f91..8cc32792f 100644
--- a/modules/backend/widgets/table/assets/less/table.less
+++ b/modules/backend/widgets/table/assets/less/table.less
@@ -198,8 +198,7 @@
                 margin-right: 8px;
                 position: relative;
                 top: 3px;
-                background: transparent url(../images/table-icons.gif) no-repeat;
-                background-position: 0 0;
+                background: transparent url(../images/table-icons.gif) no-repeat 0 0;
                 background-size: 32px auto;
             }
 
@@ -404,9 +403,8 @@ ul.table-widget-autocomplete {
 html.cssanimations {
     .control-table td[data-column-type=dropdown] {
         [data-view-container].loading:after {
-            background-image: url('../../../../../../modules/system/assets/ui/images/loader-transparent.svg');
+            background: url('../../../../../../modules/system/assets/ui/images/loader-transparent.svg') 50% 50%;
             background-size: 15px 15px;
-            background-position: 50% 50%;
             position: absolute;
             width: 15px;
             height: 15px;