3pp-mirror/penpot
1
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-06-26 00:17:02 +02:00
Code Issues Projects Releases Packages Wiki Activity

🐛 Fix uneven layer opacities

Browse source
This commit is contained in:
Alejandro Alonso 2024-03-14 16:18:10 +01:00 • committed by Alonso Torres
parent d8a9e1a2cb
commit a3ca905f37
5 changed files with 8 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

14
frontend/src/app/main/ui/shapes/attrs.cljs
View file

@ -148,17 +148,6 @@
attrs)) attrs))
(defn add-layer-styles!
[props shape]
(let [opacity (:opacity shape)]
(if (some? opacity)
(obj/set! props "opacity" opacity)
props)))
(defn get-layer-styles
[shape]
(add-layer-styles! #js {} shape))
(defn get-svg-props (defn get-svg-props
[shape render-id] [shape render-id]
(let [attrs (get shape :svg-attrs {}) (let [attrs (get shape :svg-attrs {})
@ -195,8 +184,7 @@
style (-> (obj/get props "style") style (-> (obj/get props "style")
(obj/clone) (obj/clone)
(obj/merge! svg-styles) (obj/merge! svg-styles))
(add-layer-styles! shape))
url-fill? (or ^boolean (some? (:fill-image shape)) url-fill? (or ^boolean (some? (:fill-image shape))
^boolean (cfh/image-shape? shape) ^boolean (cfh/image-shape? shape)

3
frontend/src/app/main/ui/shapes/custom_stroke.cljs
View file

@ -476,8 +476,7 @@
svg-attrs (attrs/get-svg-props shape render-id) svg-attrs (attrs/get-svg-props shape render-id)
style (-> (obj/get props "style") style (-> (obj/get props "style")
(obj/clone) (obj/clone))
(attrs/add-layer-styles! shape))
props (mf/spread-props svg-attrs props (mf/spread-props svg-attrs
{:id stroke-id {:id stroke-id

6
frontend/src/app/main/ui/shapes/frame.cljs
View file

@ -69,6 +69,7 @@
y (dm/get-prop shape :y) y (dm/get-prop shape :y)
w (dm/get-prop shape :width) w (dm/get-prop shape :width)
h (dm/get-prop shape :height) h (dm/get-prop shape :height)
opacity (dm/get-prop shape :opacity)
transform (gsh/transform-str shape) transform (gsh/transform-str shape)
show-content? (get shape :show-content) show-content? (get shape :show-content)
@ -92,7 +93,8 @@
;; transparent). It may have been changed to default black ;; transparent). It may have been changed to default black
;; if a shape coming from an imported SVG file is ;; if a shape coming from an imported SVG file is
;; rendered. See main.ui.shapes.attrs/add-style-attrs. ;; rendered. See main.ui.shapes.attrs/add-style-attrs.
:fill "none"} :fill "none"
:opacity opacity}
[:& shape-fills {:shape shape} [:& shape-fills {:shape shape}
(if ^boolean path? (if ^boolean path?
@ -171,7 +173,7 @@
(ctl/sort-layout-children-z-index))] (ctl/sort-layout-children-z-index))]
[:> frame-container props [:> frame-container props
[:g.frame-children {:opacity (:opacity shape)} [:g.frame-children
(for [item childs] (for [item childs]
(let [id (dm/get-prop item :id)] (let [id (dm/get-prop item :id)]
(when (some? id) (when (some? id)

2
frontend/src/app/main/ui/shapes/shape.cljs
View file

@ -70,6 +70,8 @@
filter-id (dm/str "filter-" render-id) filter-id (dm/str "filter-" render-id)
styles (-> (obj/create) styles (-> (obj/create)
(obj/set! "pointerEvents" pointer-events) (obj/set! "pointerEvents" pointer-events)
(cond-> (not (cfh/frame-shape? shape))
(obj/set! "opacity" (:opacity shape)))
(cond-> (and blend-mode (not= blend-mode :normal)) (cond-> (and blend-mode (not= blend-mode :normal))
(obj/set! "mixBlendMode" (d/name blend-mode)))) (obj/set! "mixBlendMode" (d/name blend-mode))))

2
frontend/src/app/main/ui/shapes/text/fo_text.cljs
View file

@ -10,7 +10,6 @@
[app.common.data :as d] [app.common.data :as d]
[app.common.data.macros :as dm] [app.common.data.macros :as dm]
[app.common.geom.shapes :as gsh] [app.common.geom.shapes :as gsh]
[app.main.ui.shapes.attrs :as attrs]
[app.main.ui.shapes.text.styles :as sts] [app.main.ui.shapes.text.styles :as sts]
[app.util.object :as obj] [app.util.object :as obj]
[cuerdas.core :as str] [cuerdas.core :as str]
@ -192,7 +191,6 @@
:transform transform :transform transform
:width (if (#{:auto-width} grow-type) 100000 width) :width (if (#{:auto-width} grow-type) 100000 width)
:height (if (#{:auto-height :auto-width} grow-type) 100000 height) :height (if (#{:auto-height :auto-width} grow-type) 100000 height)
:style (attrs/get-layer-styles shape)
:ref ref} :ref ref}
;; We use a class here because react has a bug that won't use the appropriate selector for ;; We use a class here because react has a bug that won't use the appropriate selector for
;; `background-clip` ;; `background-clip`