diff --git a/frontend/src/app/main/ui/shapes/custom_stroke.cljs b/frontend/src/app/main/ui/shapes/custom_stroke.cljs index f7d6efdeb0..62f667fe5e 100644 --- a/frontend/src/app/main/ui/shapes/custom_stroke.cljs +++ b/frontend/src/app/main/ui/shapes/custom_stroke.cljs @@ -87,7 +87,7 @@ cap-end (:stroke-cap-end stroke) color (if (some? gradient) - (str/ffmt "url(#stroke-color-gradient_%s_%s)" render-id index) + (str/ffmt "url(#stroke-color-gradient-%s-%s)" render-id index) (:stroke-color stroke)) opacity (when-not (some? gradient) @@ -198,7 +198,7 @@ alignment (:stroke-alignment stroke :center) width (:stroke-width stroke 0) - props #js {:id (dm/str "stroke-color-gradient_" render-id "_" index) + props #js {:id (dm/str "stroke-color-gradient-" render-id "-" index) :gradient gradient :shape shape}] [:* @@ -391,7 +391,7 @@ props (if (or (some? (->> shape-shadow (remove :hidden) seq)) (not ^boolean (:hidden shape-blur))) - (obj/set! props "filter" (dm/fmt "url(#filter_%)" render-id)) + (obj/set! props "filter" (dm/fmt "url(#filter-%)" render-id)) props)) svg-attrs (attrs/get-svg-props shape render-id) @@ -494,11 +494,11 @@ (cond (and (some? shape-blur) (not ^boolean (:hidden shape-blur))) - (obj/set! props "filter" (dm/fmt "url(#filter_blur_%)" render-id)) + (obj/set! props "filter" (dm/fmt "url(#filter-blur-%)" render-id)) (and (empty? shape-fills) (some? (->> shape-shadow (remove :hidden) seq))) - (obj/set! props "filter" (dm/fmt "url(#filter_%)" render-id))))] + (obj/set! props "filter" (dm/fmt "url(#filter-%)" render-id))))] (when (d/not-empty? shape-strokes) diff --git a/frontend/src/app/main/ui/shapes/filters.cljs b/frontend/src/app/main/ui/shapes/filters.cljs index 5593a8b4d9..4da338cb87 100644 --- a/frontend/src/app/main/ui/shapes/filters.cljs +++ b/frontend/src/app/main/ui/shapes/filters.cljs @@ -15,7 +15,7 @@ [rumext.v2 :as mf])) (defn get-filter-id [] - (str "filter_" (uuid/next))) + (dm/str "filter-" (uuid/next))) (defn filter-str [filter-id shape] diff --git a/frontend/src/app/main/ui/shapes/shape.cljs b/frontend/src/app/main/ui/shapes/shape.cljs index 4d017e22ce..488a7dd05e 100644 --- a/frontend/src/app/main/ui/shapes/shape.cljs +++ b/frontend/src/app/main/ui/shapes/shape.cljs @@ -66,7 +66,7 @@ type (dm/get-prop shape :type) render-id (h/use-render-id) - filter-id (dm/str "filter_" render-id) + filter-id (dm/str "filter-" render-id) styles (-> (obj/create) (obj/set! "pointerEvents" pointer-events) (cond-> (and blend-mode (not= blend-mode :normal)) @@ -116,8 +116,8 @@ [:defs [:& defs/svg-defs {:shape shape :render-id render-id}] [:& filters/filters {:shape shape :filter-id filter-id}] - [:& filters/filters {:shape shape-without-blur :filter-id (dm/fmt "filter_shadow_%" render-id)}] - [:& filters/filters {:shape shape-without-shadows :filter-id (dm/fmt "filter_blur_%" render-id)}] + [:& filters/filters {:shape shape-without-blur :filter-id (dm/fmt "filter-shadow-%" render-id)}] + [:& filters/filters {:shape shape-without-shadows :filter-id (dm/fmt "filter-blur-%" render-id)}] [:& fills/fills {:shape shape :render-id render-id}] [:& frame/frame-clip-def {:shape shape :render-id render-id}]] diff --git a/frontend/src/app/main/ui/workspace/viewport/gradients.cljs b/frontend/src/app/main/ui/workspace/viewport/gradients.cljs index 4b86156559..f90343331d 100644 --- a/frontend/src/app/main/ui/workspace/viewport/gradients.cljs +++ b/frontend/src/app/main/ui/workspace/viewport/gradients.cljs @@ -173,13 +173,13 @@ (fn [] (rx/dispose! subs))))) [:g.gradient-handlers [:defs - [:& gradient-line-drop-shadow-filter {:id "gradient_line_drop_shadow" :from-p from-p :to-p to-p :zoom zoom}] - [:& gradient-line-drop-shadow-filter {:id "gradient_width_line_drop_shadow" :from-p from-p :to-p width-p :zoom zoom}] - [:& gradient-square-drop-shadow-filter {:id "gradient_square_from_drop_shadow" :point from-p :zoom zoom}] - [:& gradient-square-drop-shadow-filter {:id "gradient_square_to_drop_shadow" :point to-p :zoom zoom}] - [:& gradient-width-handler-shadow-filter {:id "gradient_width_handler_drop_shadow" :point width-p :zoom zoom}]] + [:& gradient-line-drop-shadow-filter {:id "gradient-line-drop-shadow" :from-p from-p :to-p to-p :zoom zoom}] + [:& gradient-line-drop-shadow-filter {:id "gradient-width-line-drop-shadow" :from-p from-p :to-p width-p :zoom zoom}] + [:& gradient-square-drop-shadow-filter {:id "gradient-square-from-drop-shadow" :point from-p :zoom zoom}] + [:& gradient-square-drop-shadow-filter {:id "gradient-square-to-drop-shadow" :point to-p :zoom zoom}] + [:& gradient-width-handler-shadow-filter {:id "gradient-width-handler-drop-shadow" :point width-p :zoom zoom}]] - [:g {:filter "url(#gradient_line_drop_shadow)"} + [:g {:filter "url(#gradient-line-drop-shadow)"} [:line {:x1 (:x from-p) :y1 (:y from-p) :x2 (:x to-p) @@ -188,7 +188,7 @@ :stroke-width (/ gradient-line-stroke-width zoom)}]] (when width-p - [:g {:filter "url(#gradient_width_line_drop_shadow)"} + [:g {:filter "url(#gradient-width-line-drop-shadow)"} [:line {:x1 (:x from-p) :y1 (:y from-p) :x2 (:x width-p) @@ -197,7 +197,7 @@ :stroke-width (/ gradient-line-stroke-width zoom)}]]) (when width-p - [:g {:filter "url(#gradient_width_handler_drop_shadow)"} + [:g {:filter "url(#gradient-width-handler-drop-shadow)"} [:circle {:data-allow-click-modal "colorpicker" :cx (:x width-p) :cy (:y width-p) @@ -208,7 +208,7 @@ [:& gradient-color-handler {:selected (or (not editing) (= editing 0)) - :filter-id "gradient_square_from_drop_shadow" + :filter-id "gradient-square-from-drop-shadow" :zoom zoom :point from-p :color from-color @@ -219,7 +219,7 @@ [:& gradient-color-handler {:selected (= editing 1) - :filter-id "gradient_square_to_drop_shadow" + :filter-id "gradient-square-to-drop-shadow" :zoom zoom :point to-p :color to-color