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

🐛 Fix problem with images patterns repeating

Browse source
This commit is contained in:
alonso.torres 2023-07-06 11:41:05 +02:00
parent 647beec1e8
commit 7a499bfc90
2 changed files with 21 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

25
frontend/src/app/main/ui/shapes/fills.cljs
View file

@ -16,6 +16,8 @@
[app.util.object :as obj]
[rumext.v2 :as mf]))
(def no-repeat-padding 1.05)
(mf/defc fills
{::mf/wrap-props false}
[props]
@ -71,7 +73,10 @@
(let [fill-id (dm/str "fill-" shape-index "-" render-id)]
[:> :pattern (-> (obj/clone pattern-attrs)
(obj/set! "id" fill-id))
(obj/set! "id" fill-id)
(cond-> has-image?
(-> (obj/set! "width" (* width no-repeat-padding))
(obj/set! "height" (* height no-repeat-padding)))))
[:g
(for [[fill-index value] (-> (d/enumerate (:fills shape [])) reverse)]
[:> :rect (-> (attrs/extract-fill-attrs value render-id fill-index type)
@ -80,7 +85,17 @@
(obj/set! "height" height))])
(when has-image?
[:image {:href (or (:data-uri shape) (get embed uri uri))
:preserveAspectRatio "none"
:width width
:height height}])]])])))))
[:g
;; We add this shape to add a padding so the patter won't repeat
;; Issue: https://tree.taiga.io/project/penpot/issue/5583
[:rect {:x 0
:y 0
:width (* width no-repeat-padding)
:height (* height no-repeat-padding)
:fill "none"}]
[:image {:href (or (:data-uri shape) (get embed uri uri))
:preserveAspectRatio "none"
:x 0
:y 0
:width width
:height height}]])]])])))))