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

✨ Gradients support in shapes

Browse source
This commit is contained in:
alonso.torres 2020-10-09 12:29:35 +02:00
parent 381aef77ee
commit c266f78d1e
14 changed files with 176 additions and 79 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -20,21 +20,36 @@
:dashed "10,10"
nil))
(defn add-border-radius [attrs shape]
(obj/merge! attrs #js {:rx (:rx shape)
:ry (:ry shape)}))
(defn add-fill [attrs shape]
(let [fill-color-gradient-id (str "fill-color-gradient_" (:id shape))]
(if (:fill-color-gradient shape)
(obj/merge! attrs #js {:fill (str/format "url(#%s)" fill-color-gradient-id)})
(obj/merge! attrs #js {:fill (or (:fill-color shape) "transparent")
:fillOpacity (:fill-opacity shape nil)}))))
(defn add-stroke [attrs shape]
(let [stroke-style (:stroke-style shape :none)
stroke-color-gradient-id (str "stroke-color-gradient_" (:id shape))]
(if (not= stroke-style :none)
(if (:stroke-color-gradient shape)
(obj/merge! attrs
#js {:stroke (str/format "url(#%s)" stroke-color-gradient-id)
:strokeWidth (:stroke-width shape 1)
:strokeDasharray (stroke-type->dasharray stroke-style)})
(obj/merge! attrs
#js {:stroke (:stroke-color shape nil)
:strokeWidth (:stroke-width shape 1)
:strokeOpacity (:stroke-opacity shape nil)
:strokeDasharray (stroke-type->dasharray stroke-style)}))))
attrs)
(defn extract-style-attrs
([shape] (extract-style-attrs shape nil))
([shape gradient-id]
(let [stroke-style (:stroke-style shape :none)
attrs #js {:rx (:rx shape nil)
:ry (:ry shape nil)}
attrs (obj/merge! attrs
(if gradient-id
#js {:fill (str/format "url(#%s)" gradient-id)}
#js {:fill (or (:fill-color shape) "transparent")
:fillOpacity (:fill-opacity shape nil)}))]
(when (not= stroke-style :none)
(obj/merge! attrs
#js {:stroke (:stroke-color shape nil)
:strokeWidth (:stroke-width shape 1)
:strokeOpacity (:stroke-opacity shape nil)
:strokeDasharray (stroke-type->dasharray stroke-style)}))
attrs)))
([shape]
(-> (obj/new)
(add-border-radius shape)
(add-fill shape)
(add-stroke shape))))