Merge pull request #245 from uxbox/bug_fixing

Bug fixing

frontend/resources/styles/main/partials/sidebar-element-options.scss

@@ -431,6 +431,7 @@
   .input-text {
     padding-left: 0;
     color: #b1b2b5;
+    background-color: transparent;
   }
 }
 

frontend/src/uxbox/main/ui/workspace/shapes/outline.cljs

@@ -13,13 +13,15 @@
    [uxbox.common.geom.shapes :as gsh]
    [uxbox.util.object :as obj]
    [rumext.util :refer [map->obj]]
-   [uxbox.main.ui.shapes.path :as path]))
+   [uxbox.main.ui.shapes.path :as path]
+   [uxbox.main.refs :as refs]))
 
 
 (mf/defc outline
   {::mf/wrap-props false}
   [props]
-  (let [shape (unchecked-get props "shape")
+  (let [zoom (mf/deref refs/selected-zoom)
+        shape (unchecked-get props "shape")
         transform (gsh/transform-matrix shape)
         {:keys [id x y width height]} shape
 
@@ -30,7 +32,7 @@
 
         common {:fill "transparent"
                 :stroke "#31EFB8"
-                :strokeWidth "1px"
+                :strokeWidth (/ 1 zoom)
                 :pointerEvents "none"
                 :transform transform}
 

frontend/src/uxbox/main/ui/workspace/sidebar/options/frame.cljs

@@ -68,7 +68,8 @@
         on-width-change #(on-size-change % :width)
         on-height-change #(on-size-change % :height)
         on-pos-x-change #(on-position-change % :x)
-        on-pos-y-change #(on-position-change % :y)]
+        on-pos-y-change #(on-position-change % :y)
+        select-all #(-> % (dom/get-target) (.select))]
 
     [:div.element-set
 
@@ -103,6 +104,7 @@
        [:div.input-element.pixels
         [:input.input-text {:type "number"
                             :min "0"
+                            :on-click select-all
                             :on-change on-width-change
                             :value (-> (:width shape)
                                        (math/precision 2)
@@ -112,6 +114,7 @@
        [:div.input-element.pixels
         [:input.input-text {:type "number"
                             :min "0"
+                            :on-click select-all
                             :on-change on-height-change
                             :value (-> (:height shape)
                                        (math/precision 2)
@@ -123,6 +126,7 @@
        [:div.input-element.pixels
         [:input.input-text {:placeholder "x"
                             :type "number"
+                            :on-click select-all
                             :on-change on-pos-x-change
                             :value (-> (:x shape)
                                        (math/precision 2)
@@ -130,6 +134,7 @@
        [:div.input-element.pixels
         [:input.input-text {:placeholder "y"
                             :type "number"
+                            :on-click select-all
                             :on-change on-pos-y-change
                             :value (-> (:y shape)
                                        (math/precision 2)

frontend/src/uxbox/main/ui/workspace/sidebar/options/measures.cljs

@@ -22,7 +22,6 @@
    [uxbox.util.i18n :refer [t] :as i18n]))
 
 ;; -- User/drawing coords
-
 (mf/defc measures-menu
   [{:keys [shape options] :as props}]
   (let [options (or options #{:size :position :rotation :radius})
@@ -72,7 +71,8 @@
         on-width-change #(on-size-change % :width)
         on-height-change #(on-size-change % :height)
         on-pos-x-change #(on-position-change % :x)
-        on-pos-y-change #(on-position-change % :y)]
+        on-pos-y-change #(on-position-change % :y)
+        select-all #(-> % (dom/get-target) (.select))]
 
     [:div.element-set
      [:div.element-set-content
@@ -90,6 +90,7 @@
           [:input.input-text {:type "number"
                               :min "0"
                               :no-validate true
+                              :on-click select-all
                               :on-change on-width-change
                               :value (str (-> (:width shape)
                                               (d/coalesce 0)
@@ -100,6 +101,7 @@
           [:input.input-text {:type "number"
                               :min "0"
                               :no-validate true
+                              :on-click select-all
                               :on-change on-height-change
                               :value (str (-> (:height shape)
                                               (d/coalesce 0)
@@ -113,12 +115,14 @@
           [:input.input-text {:placeholder "x"
                               :type "number"
                               :no-validate true
+                              :on-click select-all
                               :on-change on-pos-x-change
                               :value (-> shape :selrect :x (math/precision 2))}]]
          [:div.input-element.Yaxis
           [:input.input-text {:placeholder "y"
                               :type "number"
                               :no-validate true
+                              :on-click select-all
                               :on-change on-pos-y-change
                               :value (-> shape :selrect :y (math/precision 2))}]]])
 
@@ -132,6 +136,7 @@
             :no-validate true
             :min "0"
             :max "359"
+            :on-click select-all
             :on-change on-rotation-change
             :value (str (-> (:rotation shape)
                             (d/coalesce 0)
@@ -154,6 +159,7 @@
           [:input.input-text
            {:placeholder "rx"
             :type "number"
+            :on-click select-all
             :on-change on-radius-change
             :value (str (-> (:rx shape)
                             (d/coalesce 0)

frontend/src/uxbox/main/ui/workspace/sidebar/options/rows/color_row.cljs

@@ -77,7 +77,8 @@
                                     dom/get-target
                                     dom/get-value
                                     string->opacity
-                                    change-opacity))]
+                                    change-opacity))
+        select-all #(-> % (dom/get-target) (.select))]
 
     (mf/use-effect
      (mf/deps value)
@@ -91,12 +92,14 @@
      [:div.color-info
       [:input {:value (-> @state :value (subs 1))
                :pattern "^[0-9a-fA-F]{0,6}$"
+               :on-click select-all
                :on-change handle-input-color-change}]]
 
      (when (not disable-opacity)
        [:div.input-element.percentail
         [:input.input-text {:type "number"
                             :value (-> @state :opacity opacity->string)
+                            :on-click select-all
                             :on-change handle-opacity-change
                             :min "0"
                             :max "100"}]])