From cb3a9c28f05e6365f59715e24bd038fff4a85868 Mon Sep 17 00:00:00 2001
From: elhombretecla <delacruzgarciajuan@gmail.com>
Date: Mon, 9 May 2016 20:08:07 +0200
Subject: [PATCH] add multiselect nav to images dashboard section

---
 resources/styles/framework.scss               | 13 ++++++
 resources/styles/partials/dashboard-grid.scss | 46 +++++++++++++++++++
 src/uxbox/ui/dashboard/images.cljs            | 15 +++++-
 3 files changed, 73 insertions(+), 1 deletion(-)

diff --git a/resources/styles/framework.scss b/resources/styles/framework.scss
index c5aa0fe61..2e5b92a01 100644
--- a/resources/styles/framework.scss
+++ b/resources/styles/framework.scss
@@ -821,6 +821,19 @@ input[type=range]:focus::-ms-fill-upper {
 
   }
 
+  &.tooltip-top {
+
+    &:hover {
+
+      &::after {
+        top: -165%;
+        left: -60%;
+      }
+
+    }
+
+  }
+
   &.tooltip-hover {
 
     &:hover {
diff --git a/resources/styles/partials/dashboard-grid.scss b/resources/styles/partials/dashboard-grid.scss
index 79f948e9b..de19b3bb3 100644
--- a/resources/styles/partials/dashboard-grid.scss
+++ b/resources/styles/partials/dashboard-grid.scss
@@ -288,3 +288,49 @@
   }
 
 }
+
+// MULTISELECT OPTIONS BAR
+.multiselect-bar {
+  align-items: center;
+  background-color: $color-white;
+  display: flex;
+  left: 0;
+  justify-content: center;
+  padding: $medium;
+  position: absolute;
+  width: 100%;
+  bottom: 0;
+
+  .multiselect-nav {
+    align-items: center;
+    display: flex;
+    justify-content: space-between;
+    width: 110px;
+
+    svg {
+      cursor: pointer;
+      fill: $medium-ui-icons;
+      height: 20px;
+      width: 20px;
+
+      &:hover {
+        fill: $intense-ui-icons;
+      }
+
+    }
+
+    span.delete {
+
+      &:hover {
+
+        svg{
+          fill: $color-danger-light;
+        }
+
+      }
+
+    }
+
+  }
+
+}
diff --git a/src/uxbox/ui/dashboard/images.cljs b/src/uxbox/ui/dashboard/images.cljs
index 13b66a5fb..1f9c21226 100644
--- a/src/uxbox/ui/dashboard/images.cljs
+++ b/src/uxbox/ui/dashboard/images.cljs
@@ -98,7 +98,20 @@
           [:div.input-checkbox.check-primary
            [:input {:type "checkbox" :id "item-6" :value "Yes"}]
            [:label {:for "item-6"}]]]
-       [:span "image_name.jpg"]]]]))
+       [:span "image_name.jpg"]]]
+
+    ;; MULTISELECT OPTIONS BAR
+    [:div.multiselect-bar
+     [:div.multiselect-nav
+      [:span.move-item.tooltip.tooltip-top
+       {:alt "Move to"}
+       i/organize]
+      [:span.copy.tooltip.tooltip-top
+       {:alt "Duplicate"}
+       i/copy]
+      [:span.delete.tooltip.tooltip-top
+       {:alt "Delete"}
+       i/trash]]]]))
 
 (def ^:const ^:private grid
   (mx/component