From 5a30c5e584d427b6b017ed9ad23a07fe572bbc8c Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Mon, 25 Mar 2024 09:20:12 +0100 Subject: [PATCH 1/5] :bug: Fix problem with gradient fill text --- frontend/src/app/main/ui/shapes/shape.cljs | 7 +++++-- frontend/src/app/main/ui/shapes/text/svg_text.cljs | 5 +++++ 2 files changed, 10 insertions(+), 2 deletions(-) diff --git a/frontend/src/app/main/ui/shapes/shape.cljs b/frontend/src/app/main/ui/shapes/shape.cljs index 47b32bf52..cbda63671 100644 --- a/frontend/src/app/main/ui/shapes/shape.cljs +++ b/frontend/src/app/main/ui/shapes/shape.cljs @@ -121,7 +121,10 @@ [:& 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)}] - [:& fills/fills {:shape shape :render-id render-id}] - [:& frame/frame-clip-def {:shape shape :render-id render-id}]] + [:& frame/frame-clip-def {:shape shape :render-id render-id}] + + ;; Text fills need to be defined afterwards because they are specified per text-block + (when-not (cfh/text-shape? shape) + [:& fills/fills {:shape shape :render-id render-id}])] children]])) diff --git a/frontend/src/app/main/ui/shapes/text/svg_text.cljs b/frontend/src/app/main/ui/shapes/text/svg_text.cljs index bb5fe3e0c..20c8e8edc 100644 --- a/frontend/src/app/main/ui/shapes/text/svg_text.cljs +++ b/frontend/src/app/main/ui/shapes/text/svg_text.cljs @@ -13,6 +13,7 @@ [app.main.ui.context :as muc] [app.main.ui.shapes.attrs :as attrs] [app.main.ui.shapes.custom-stroke :refer [shape-custom-strokes]] + [app.main.ui.shapes.fills :as fills] [app.main.ui.shapes.gradients :as grad] [app.util.object :as obj] [rumext.v2 :as mf])) @@ -103,5 +104,9 @@ render-id (dm/str render-id "-" index)] [:& (mf/provider muc/render-id) {:key index :value render-id} + ;; Text fills definition. Need to be defined per-text block + [:defs + [:& fills/fills {:shape shape :render-id render-id}]] + [:& shape-custom-strokes {:shape shape :position index :render-id render-id} [:> :text props (:text data)]]]))]])) From d83787d714beaa0d1fc54ffe7ab906ccb5493c1a Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Mon, 25 Mar 2024 09:49:38 +0100 Subject: [PATCH 2/5] :bug: Fix problem with gradients and borders --- frontend/src/app/main/ui/shapes/custom_stroke.cljs | 6 ++++-- frontend/src/app/main/ui/shapes/gradients.cljs | 4 ++-- 2 files changed, 6 insertions(+), 4 deletions(-) diff --git a/frontend/src/app/main/ui/shapes/custom_stroke.cljs b/frontend/src/app/main/ui/shapes/custom_stroke.cljs index 11c430a2d..35d2bd7f0 100644 --- a/frontend/src/app/main/ui/shapes/custom_stroke.cljs +++ b/frontend/src/app/main/ui/shapes/custom_stroke.cljs @@ -209,7 +209,8 @@ props #js {:id (dm/str "stroke-color-gradient-" render-id "-" index) :gradient gradient - :shape shape} + :shape shape + :force-transform (cfh/path-shape? shape)} stroke-image (:stroke-image stroke) uri (when stroke-image (cf/resolve-file-media stroke-image)) @@ -248,7 +249,8 @@ :width (/ w (dm/get-prop selrect :width)) :height (/ h (dm/get-prop selrect :height)) :viewBox "0 0 1 1" - :preserveAspectRatio "xMidYMid slice"} + :preserveAspectRatio "xMidYMid slice" + :patternTransform (when (cfh/path-shape? shape) (gsh/transform-str shape))} [:> :image image-props]]) (cond diff --git a/frontend/src/app/main/ui/shapes/gradients.cljs b/frontend/src/app/main/ui/shapes/gradients.cljs index 1b44a76c3..d2a74a119 100644 --- a/frontend/src/app/main/ui/shapes/gradients.cljs +++ b/frontend/src/app/main/ui/shapes/gradients.cljs @@ -30,9 +30,9 @@ (mf/defc linear-gradient {::mf/wrap-props false} - [{:keys [id gradient shape]}] + [{:keys [id gradient shape force-transform]}] (let [transform (mf/with-memo [shape] - (when (cfh/frame-shape? shape) + (when force-transform (gsh/transform-matrix shape nil (gpt/point 0.5 0.5)))) metadata? (mf/use-ctx ed/include-metadata-ctx) From 588410bbb186112330a2653d29da72adbf6c31b5 Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Mon, 25 Mar 2024 13:12:47 +0100 Subject: [PATCH 3/5] :bug: Fix problem when importing SVG --- frontend/src/app/main/ui/shapes/svg_defs.cljs | 1 + 1 file changed, 1 insertion(+) diff --git a/frontend/src/app/main/ui/shapes/svg_defs.cljs b/frontend/src/app/main/ui/shapes/svg_defs.cljs index c2f0fa2be..f636bf205 100644 --- a/frontend/src/app/main/ui/shapes/svg_defs.cljs +++ b/frontend/src/app/main/ui/shapes/svg_defs.cljs @@ -37,6 +37,7 @@ (= "userSpaceOnUse" (get attrs :gradientUnits "objectBoundingBox"))) transform-pattern? (and (= :pattern tag) + (= "userSpaceOnUse" (get attrs :patternContentUnits "userSpaceOnUse")) (= "userSpaceOnUse" (get attrs :patternUnits "userSpaceOnUse"))) transform-clippath? (and (= :clipPath tag) From ecc61130ec2571ca883506a36827ae72d85fa4ef Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Mon, 25 Mar 2024 15:35:04 +0100 Subject: [PATCH 4/5] :bug: Fix problem when exporting html texts --- .../app/main/ui/shapes/text/html_text.cljs | 9 ++++---- .../src/app/main/ui/shapes/text/styles.cljs | 22 ++++++++++--------- frontend/src/app/util/code_gen/style_css.cljs | 2 +- 3 files changed, 17 insertions(+), 16 deletions(-) diff --git a/frontend/src/app/main/ui/shapes/text/html_text.cljs b/frontend/src/app/main/ui/shapes/text/html_text.cljs index da23426c2..fd3995c38 100644 --- a/frontend/src/app/main/ui/shapes/text/html_text.cljs +++ b/frontend/src/app/main/ui/shapes/text/html_text.cljs @@ -21,10 +21,9 @@ shape (obj/get props "shape") code? (obj/get props "code?") text (:text node) - style (when-not code? - (if (= text "") - (sts/generate-text-styles shape parent) - (sts/generate-text-styles shape node))) + style (if (= text "") + (sts/generate-text-styles shape parent) + (sts/generate-text-styles shape node)) class (when code? (:$id node))] [:span.text-node {:style style :class class} (if (= text "") "\u00A0" text)])) @@ -36,7 +35,7 @@ children (obj/get props "children") shape (obj/get props "shape") code? (obj/get props "code?") - style (when-not code? (sts/generate-root-styles shape node)) + style (sts/generate-root-styles shape node code?) class (when code? (:$id node))] [:div.root.rich-text {:style style diff --git a/frontend/src/app/main/ui/shapes/text/styles.cljs b/frontend/src/app/main/ui/shapes/text/styles.cljs index 534b786e4..c8fbf2053 100644 --- a/frontend/src/app/main/ui/shapes/text/styles.cljs +++ b/frontend/src/app/main/ui/shapes/text/styles.cljs @@ -17,16 +17,18 @@ [cuerdas.core :as str])) (defn generate-root-styles - [{:keys [width height]} node] - (let [valign (:vertical-align node "top") - base #js {:height (fmt/format-pixels height) - :width (fmt/format-pixels width) - :display "flex" - :whiteSpace "break-spaces"}] - (cond-> base - (= valign "top") (obj/set! "alignItems" "flex-start") - (= valign "center") (obj/set! "alignItems" "center") - (= valign "bottom") (obj/set! "alignItems" "flex-end")))) + ([props node] + (generate-root-styles props node false)) + ([{:keys [width height]} node code?] + (let [valign (:vertical-align node "top") + base #js {:height (when-not code? (fmt/format-pixels height)) + :width (when-not code? (fmt/format-pixels width)) + :display "flex" + :whiteSpace "break-spaces"}] + (cond-> base + (= valign "top") (obj/set! "alignItems" "flex-start") + (= valign "center") (obj/set! "alignItems" "center") + (= valign "bottom") (obj/set! "alignItems" "flex-end"))))) (defn generate-paragraph-set-styles [{:keys [grow-type] :as shape}] diff --git a/frontend/src/app/util/code_gen/style_css.cljs b/frontend/src/app/util/code_gen/style_css.cljs index 5f1776044..3a1ace59f 100644 --- a/frontend/src/app/util/code_gen/style_css.cljs +++ b/frontend/src/app/util/code_gen/style_css.cljs @@ -207,7 +207,7 @@ body { (let [properties (case (:type node) (:root "root") - (sts/generate-root-styles shape node) + (sts/generate-root-styles shape node true) (:paragraph-set "paragraph-set") (sts/generate-paragraph-set-styles shape) From 5d200a70d617136ec2146a48bc6ec45415cf54ea Mon Sep 17 00:00:00 2001 From: "alonso.torres" Date: Mon, 25 Mar 2024 16:10:25 +0100 Subject: [PATCH 5/5] :bug: Fix problem with grid edition --- frontend/src/app/main/data/workspace/modifiers.cljs | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/frontend/src/app/main/data/workspace/modifiers.cljs b/frontend/src/app/main/data/workspace/modifiers.cljs index 302f3e6b2..b552bee67 100644 --- a/frontend/src/app/main/data/workspace/modifiers.cljs +++ b/frontend/src/app/main/data/workspace/modifiers.cljs @@ -546,7 +546,10 @@ :layout-padding-type :layout-gap :layout-item-margin - :layout-item-margin-type]}) + :layout-item-margin-type + :layout-grid-cells + :layout-grid-columns + :layout-grid-rows]}) ;; We've applied the text-modifier so we can dissoc the temporary data (fn [state] (update state :workspace-text-modifier #(apply dissoc % ids)))