From 641e4080bc639d8d07cd2d2adb4aa51f4745e635 Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Tue, 25 May 2021 15:55:03 +0200 Subject: [PATCH] :sparkles: Changed transparent for none --- .../app/main/ui/handoff/selection_feedback.cljs | 2 +- frontend/src/app/main/ui/measurements.cljs | 2 +- frontend/src/app/main/ui/shapes/attrs.cljs | 2 +- frontend/src/app/main/ui/shapes/path.cljs | 4 ++-- .../main/ui/workspace/shapes/bounding_box.cljs | 2 +- .../app/main/ui/workspace/shapes/path/editor.cljs | 11 +++++++---- .../app/main/ui/workspace/viewport/drawarea.cljs | 2 +- .../main/ui/workspace/viewport/frame_grid.cljs | 2 +- .../main/ui/workspace/viewport/interactions.cljs | 8 +++++--- .../app/main/ui/workspace/viewport/outline.cljs | 2 +- .../app/main/ui/workspace/viewport/selection.cljs | 15 ++++++++------- 11 files changed, 29 insertions(+), 23 deletions(-) diff --git a/frontend/src/app/main/ui/handoff/selection_feedback.cljs b/frontend/src/app/main/ui/handoff/selection_feedback.cljs index 890accbe2..ccfd21824 100644 --- a/frontend/src/app/main/ui/handoff/selection_feedback.cljs +++ b/frontend/src/app/main/ui/handoff/selection_feedback.cljs @@ -75,7 +75,7 @@ :y y :width width :height height - :style {:fill "transparent" + :style {:fill "none" :stroke select-color :stroke-width selection-rect-width}}]])) diff --git a/frontend/src/app/main/ui/measurements.cljs b/frontend/src/app/main/ui/measurements.cljs index 75dce1ac1..3cdb0faff 100644 --- a/frontend/src/app/main/ui/measurements.cljs +++ b/frontend/src/app/main/ui/measurements.cljs @@ -177,7 +177,7 @@ :y y :width width :height height - :style {:fill "transparent" + :style {:fill "none" :stroke hover-color :stroke-width selection-rect-width}}]])) diff --git a/frontend/src/app/main/ui/shapes/attrs.cljs b/frontend/src/app/main/ui/shapes/attrs.cljs index bbd09a262..83f1debbe 100644 --- a/frontend/src/app/main/ui/shapes/attrs.cljs +++ b/frontend/src/app/main/ui/shapes/attrs.cljs @@ -89,7 +89,7 @@ ;; we setup the default fill as transparent (instead of black) (and (not (contains? shape :svg-attrs)) (not (#{ :svg-raw :group } (:type shape)))) - {:fill "transparent"} + {:fill "none"} :else {}) diff --git a/frontend/src/app/main/ui/shapes/path.cljs b/frontend/src/app/main/ui/shapes/path.cljs index 08b716e15..256730eb2 100644 --- a/frontend/src/app/main/ui/shapes/path.cljs +++ b/frontend/src/app/main/ui/shapes/path.cljs @@ -28,8 +28,8 @@ #js {:d pdata}))] (if background? [:g - [:path {:stroke "transparent" - :fill "transparent" + [:path {:stroke "none" + :fill "none" :stroke-width "20px" :d pdata}] [:& shape-custom-stroke {:shape shape diff --git a/frontend/src/app/main/ui/workspace/shapes/bounding_box.cljs b/frontend/src/app/main/ui/workspace/shapes/bounding_box.cljs index 62746cd99..83e58e5c7 100644 --- a/frontend/src/app/main/ui/workspace/shapes/bounding_box.cljs +++ b/frontend/src/app/main/ui/workspace/shapes/bounding_box.cljs @@ -42,7 +42,7 @@ :height height :transform (or transform "none") :style {:stroke color - :fill "transparent" + :fill "none" :stroke-width "1px" :pointer-events "none"}}]) diff --git a/frontend/src/app/main/ui/workspace/shapes/path/editor.cljs b/frontend/src/app/main/ui/workspace/shapes/path/editor.cljs index 88cc10114..5d050a58c 100644 --- a/frontend/src/app/main/ui/workspace/shapes/path/editor.cljs +++ b/frontend/src/app/main/ui/workspace/shapes/path/editor.cljs @@ -86,10 +86,11 @@ :on-mouse-down on-mouse-down :on-mouse-enter on-enter :on-mouse-leave on-leave + :pointer-events (when-not preview? "visible") :style {:cursor (cond (= edit-mode :draw) cur/pen-node (= edit-mode :move) cur/pointer-node) - :fill "transparent"}}]])) + :fill "none"}}]])) (mf/defc path-handler [{:keys [index prefix point handler zoom selected? hover? edit-mode snap-angle?]}] (when (and point handler) @@ -111,7 +112,7 @@ (= edit-mode :move) (st/emit! (drp/start-move-handler index prefix))))] - [:g.handler {:pointer-events (when (= edit-mode :draw))} + [:g.handler {:pointer-events (if (= edit-mode :draw) "none" "visible")} [:line {:x1 (:x point) :y1 (:y point) @@ -147,12 +148,12 @@ :on-mouse-enter on-enter :on-mouse-leave on-leave :style {:cursor (when (= edit-mode :move) cur/pointer-move) - :fill "transparent"}}]]))) + :fill "none"}}]]))) (mf/defc path-preview [{:keys [zoom command from]}] [:g.preview {:style {:pointer-events "none"}} (when (not= :move-to (:command command)) - [:path {:style {:fill "transparent" + [:path {:style {:fill "none" :stroke pc/black-color :stroke-width (/ 1 zoom) :stroke-dasharray (/ 4 zoom)} @@ -274,6 +275,7 @@ [:g.drag-handler {:pointer-events "none"} [:& path-handler {:point last-p :handler drag-handler + :edit-mode edit-mode :zoom zoom}]]) (when @hover-point @@ -325,6 +327,7 @@ (when prev-handler [:g.prev-handler {:pointer-events "none"} [:& path-handler {:point last-p + :edit-mode edit-mode :handler prev-handler :zoom zoom}]]) diff --git a/frontend/src/app/main/ui/workspace/viewport/drawarea.cljs b/frontend/src/app/main/ui/workspace/viewport/drawarea.cljs index ebf106595..20d6e4960 100644 --- a/frontend/src/app/main/ui/workspace/viewport/drawarea.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/drawarea.cljs @@ -45,6 +45,6 @@ :width width :height height :style {:stroke "#1FDEA7" - :fill "transparent" + :fill "none" :stroke-width (/ 1 zoom)}}]))) diff --git a/frontend/src/app/main/ui/workspace/viewport/frame_grid.cljs b/frontend/src/app/main/ui/workspace/viewport/frame_grid.cljs index e10f485a9..d9b147bbc 100644 --- a/frontend/src/app/main/ui/workspace/viewport/frame_grid.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/frame_grid.cljs @@ -55,7 +55,7 @@ :opacity color-opacity} #js {:stroke color-value :strokeOpacity color-opacity - :fill "transparent"})] + :fill "none"})] [:g.grid (for [{:keys [x y width height]} (gg/grid-areas frame grid)] (do diff --git a/frontend/src/app/main/ui/workspace/viewport/interactions.cljs b/frontend/src/app/main/ui/workspace/viewport/interactions.cljs index 6c894fab6..4e126fe87 100644 --- a/frontend/src/app/main/ui/workspace/viewport/interactions.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/interactions.cljs @@ -109,7 +109,7 @@ "translate(" (* zoom x) ", " (* zoom y) ")")}] (when arrow-dir [:path {:stroke "#31EFB8" - :fill "transparent" + :fill "none" :stroke-width 2 :d arrow-pdata :transform (str @@ -134,14 +134,16 @@ (if-not selected? [:path {:stroke "#B1B2B5" - :fill "transparent" + :fill "none" + :pointer-events "visible" :stroke-width (/ 2 zoom) :d pdata :on-mouse-down #(on-mouse-down % orig-shape selected)}] [:g {:on-mouse-down #(on-mouse-down % orig-shape selected)} [:path {:stroke "#31EFB8" - :fill "transparent" + :fill "none" + :pointer-events "visible" :stroke-width (/ 2 zoom) :d pdata}] [:& interaction-marker {:x orig-x diff --git a/frontend/src/app/main/ui/workspace/viewport/outline.cljs b/frontend/src/app/main/ui/workspace/viewport/outline.cljs index 6c8733776..a024a7d3a 100644 --- a/frontend/src/app/main/ui/workspace/viewport/outline.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/outline.cljs @@ -36,7 +36,7 @@ :path "path" "rect") - common {:fill "transparent" + common {:fill "none" :stroke color :strokeWidth (/ 1 zoom) :pointerEvents "none" diff --git a/frontend/src/app/main/ui/workspace/viewport/selection.cljs b/frontend/src/app/main/ui/workspace/viewport/selection.cljs index 85b91a8ff..3b1812943 100644 --- a/frontend/src/app/main/ui/workspace/viewport/selection.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/selection.cljs @@ -53,7 +53,7 @@ :on-mouse-down on-move-selected :style {:stroke color :stroke-width (/ selection-rect-width zoom) - :fill "transparent"}}]))) + :fill "none"}}]))) (defn- handlers-for-selection [{:keys [x y width height]} {:keys [type]} zoom] (let [zoom-width (* width zoom) @@ -142,7 +142,7 @@ :y y :width size :height size - :fill (if (debug? :rotation-handler) "blue" "transparent") + :fill (if (debug? :rotation-handler) "blue" "none") :transform transform :on-mouse-down on-rotate}])) @@ -174,7 +174,7 @@ :width resize-point-circle-radius :height resize-point-circle-radius :transform (when rotation (str/fmt "rotate(%s, %s, %s)" rotation cx' cy')) - :style {:fill (if (debug? :resize-handler) "red" "transparent") + :style {:fill (if (debug? :resize-handler) "red" "none") :cursor cursor} :on-mouse-down #(on-resize {:x cx' :y cy'} %)}]) @@ -187,7 +187,7 @@ :r (/ resize-point-circle-radius zoom) :cx cx' :cy cy' - :style {:fill (if (debug? :resize-handler) "red" "transparent") + :style {:fill (if (debug? :resize-handler) "red" "none") :cursor cursor}}]) )])) @@ -214,7 +214,7 @@ :transform (gmt/multiply transform (gmt/rotate-matrix angle (gpt/point x y))) :on-mouse-down #(on-resize res-point %) - :style {:fill (if (debug? :resize-handler) "yellow" "transparent") + :style {:fill (if (debug? :resize-handler) "yellow" "none") :cursor (if (#{:left :right} position) (cur/resize-ew rotation) (cur/resize-ns rotation)) }}])) @@ -245,7 +245,7 @@ transform (geom/transform-matrix shape {:no-flip true})] (when (not (#{:move :rotate} current-transform)) - [:g.controls {:pointer-events (when disable-handlers "none")} + [:g.controls {:pointer-events (if disable-handlers "none" "visible")} ;; Selection rect [:& selection-rect {:rect selrect @@ -282,10 +282,11 @@ :transform (geom/transform-matrix shape) :width width :height height + :pointer-events "visible" :style {:stroke color :stroke-width "0.5" :stroke-opacity "1" - :fill "transparent"}}]])) + :fill "none"}}]])) (mf/defc multiple-selection-handlers [{:keys [shapes selected zoom color disable-handlers on-move-selected] :as props}]