From 57df8821f13d9380fd2bdbbcb21d409c44fdf752 Mon Sep 17 00:00:00 2001
From: elhombretecla <delacruzgarciajuan@gmail.com>
Date: Sun, 10 Apr 2016 11:51:23 +0200
Subject: [PATCH] add zoom controlers

---
 resources/styles/partials/workspace-bar.scss | 63 ++++++++++++++++++++
 src/uxbox/ui/workspace/header.cljs           | 10 +++-
 2 files changed, 70 insertions(+), 3 deletions(-)

diff --git a/resources/styles/partials/workspace-bar.scss b/resources/styles/partials/workspace-bar.scss
index 07d30fb1a..508bc8e1c 100644
--- a/resources/styles/partials/workspace-bar.scss
+++ b/resources/styles/partials/workspace-bar.scss
@@ -142,6 +142,69 @@
 
     }
 
+    .options-view {
+      align-items: center;
+      display: flex;
+      justify-content: content;
+      margin: 0;
+      margin-left: 30%;
+
+      li {
+        align-items: center;
+        display: flex;
+        flex-shrink: 0;
+        height: 30px;
+        margin: 0 $small;
+        position: relative;
+        width: 50px;
+
+        &.zoom-input {
+          width: 85px;
+          padding: 0 25px;
+          position: relative;
+
+          .add-zoom,
+          .remove-zoom {
+            align-items: center;
+            border-radius: 50%;
+            border: 1px solid $color-primary;
+            cursor: pointer;
+            color: $color-primary;
+            display: none;
+            flex-shrink: 0;
+            font-size: $fs20;
+            font-weight: bold;
+            height: 20px;
+            justify-content: center;
+            position: absolute;
+            top: 5px;
+            width: 20px;
+          }
+
+          .add-zoom {
+            left: -5px;
+          }
+
+          .remove-zoom {
+            right: -5px;
+          }
+
+          &:hover {
+
+            .add-zoom,
+            .remove-zoom {
+              display: flex;
+              @include animation(0s,.3s,fadeIn);
+            }
+
+          }
+
+        }
+
+      }
+
+    }
+
   }
 
 }
diff --git a/src/uxbox/ui/workspace/header.cljs b/src/uxbox/ui/workspace/header.cljs
index 845b6d141..6faaa0704 100644
--- a/src/uxbox/ui/workspace/header.cljs
+++ b/src/uxbox/ui/workspace/header.cljs
@@ -31,9 +31,13 @@
   [own]
   (when-let [{:keys [x y]} (rum/react wb/mouse-canvas-a)]
     (html
-     [:ul.options-btn
-      [:li.tooltip.tooltip-bottom {:alt "x"} x]
-      [:li.tooltip.tooltip-bottom {:alt "y"} y]])))
+     [:ul.options-view
+      [:li.coordinates {:alt "x"} "X: " x]
+      [:li.coordinates {:alt "y"} "Y: " y]
+      [:li.zoom-input
+       [:span.add-zoom "+"]
+       [:span "100%"]
+       [:span.remove-zoom "-"]]])))
 
 (def coordinates
   (mx/component