Browse Source

HUE-7949 [dashboard] Move Gridster draggable handle to the widget title

Enrico Berti 7 years ago
parent
commit
371b786e49

File diff suppressed because it is too large
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue-embedded.css


File diff suppressed because it is too large
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue.css


File diff suppressed because it is too large
+ 0 - 0
desktop/core/src/desktop/static/desktop/css/hue3-extra.css


+ 10 - 1
desktop/core/src/desktop/static/desktop/less/components/hue-gridster.less

@@ -33,7 +33,6 @@
       }
     }
     & > li:hover {
-
       .grid-left-bar {
         opacity: 1;
       }
@@ -46,21 +45,30 @@
     }
   }
 
+  &:not(.disabled) {
+    h2 {
+      cursor: move;
+    }
+  }
+
   .card-widget {
     width: 100% !important;
     margin: 0 !important;
   }
+
   .preview-holder {
     border: none !important;
     border-radius: 0 !important;
     background: @cui-gray-200 !important;
   }
+
   .remove-empty-gridster {
     font-size: 12px;
     margin-right: 3px;
     margin-top: 2px;
     .hue-ease-transition(opacity);
   }
+
   .gs-resize-handle-both {
     background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/Pg0KPHN2ZyB2aWV3Qm94PSIwIDAgNiA2IiBzdHlsZT0iYmFja2dyb3VuZC1jb2xvcjojZmZmZmZmMDAiIHZlcnNpb249IjEuMSINCgl4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4bWw6c3BhY2U9InByZXNlcnZlIg0KCXg9IjBweCIgeT0iMHB4IiB3aWR0aD0iNnB4IiBoZWlnaHQ9IjZweCINCj4NCgk8Zz4NCjxwYXRoIGQ9Ik0gNiA2IEwgMCA2IEwgMCA0LjIgTCA0IDQuMiBMIDQuMiA0LjIgTCA0LjIgMCBMIDYgMCBMIDYgNiBMIDYgNiBaIiBmaWxsPSIjMEI3RkFEIi8+DQo8L2c+DQo8L3N2Zz4=) !important;
     width: 20px;
@@ -70,6 +78,7 @@
     background-position: bottom right;
     .hue-ease-transition(opacity);
   }
+
   .empty-gridster-widget {
     height: 215px;
   }

+ 7 - 4
desktop/core/src/desktop/templates/common_dashboard.mako

@@ -206,10 +206,13 @@
 <script id="widget-template-gridster${ suffix }" type="text/html">
   <li>
     <!-- ko ifnot: widget -->
-    <div class="empty-gridster-widget" data-bind="droppable: { data: function(w) { showAddFacetDemiModal(w, $data); }, options: { greedy:true, hoverClass: 'droppable-hover' }}">
-      <div class="inline pull-right remove-empty-gridster" data-bind="visible: $root.isEditing() || $root.isToolbarVisible()">
-        <a href="javascript:void(0)" data-bind="click: function(data){ huePubSub.publish('gridster.remove', data); }"><i class="fa fa-times"></i></a>
-      </div>
+    <div class="empty-gridster-widget card card-widget" data-bind="droppable: { data: function(w) { showAddFacetDemiModal(w, $data); }, options: { greedy:true, hoverClass: 'droppable-hover' }}">
+      <h2 class="card-heading simple">
+        ${ _('Empty widget') }
+        <div class="inline pull-right" data-bind="visible: $root.isEditing() || $root.isToolbarVisible()">
+          <a href="javascript:void(0)" class="remove-widget" data-bind="click: function(data){ huePubSub.publish('gridster.remove', data); }"><i class="fa fa-times"></i></a>
+        </div>
+      </h2>
     </div>
     <!-- /ko -->
   <!-- ko with: widget -->

+ 1 - 0
desktop/libs/dashboard/src/dashboard/templates/common_search.mako

@@ -3780,6 +3780,7 @@ $(document).ready(function () {
       },
     },
     draggable: {
+      handle: 'h2',
       stop: function (e, ui, $widget) {
         huePubSub.publish('gridster.clean.whitespace');
       }

Some files were not shown because too many files changed in this diff