mirror of
https://github.com/penpot/penpot.git
synced 2025-04-04 19:11:20 -05:00
🐛 Selected colors doesn't work for shadows
This commit is contained in:
Alejandro Alonso
parent
8ae05ff7b6
commit
18855ef2ef
4 changed files with 53 additions and 16 deletions
|
|
@ -15,17 +15,30 @@
|
|||
|
||||
(s/def ::id uuid?)
|
||||
(s/def ::style #{:drop-shadow :inner-shadow})
|
||||
(s/def ::color ::color/color)
|
||||
(s/def ::offset-x ::us/safe-number)
|
||||
(s/def ::offset-y ::us/safe-number)
|
||||
(s/def ::blur ::us/safe-number)
|
||||
(s/def ::spread ::us/safe-number)
|
||||
(s/def ::hidden boolean?)
|
||||
|
||||
|
||||
(s/def ::color string?)
|
||||
(s/def ::opacity ::us/safe-number)
|
||||
(s/def ::gradient (s/nilable ::color/gradient))
|
||||
(s/def ::file-id (s/nilable uuid?))
|
||||
(s/def ::ref-id (s/nilable uuid?))
|
||||
|
||||
(s/def ::shadow-color
|
||||
(s/keys :opt-un [::color
|
||||
::opacity
|
||||
::gradient
|
||||
::file-id
|
||||
::id]))
|
||||
|
||||
(s/def ::shadow-props
|
||||
(s/keys :req-un [:internal.shadow/id
|
||||
:internal.shadow/style
|
||||
:internal.shadow/color
|
||||
::shadow-color
|
||||
:internal.shadow/offset-x
|
||||
:internal.shadow/offset-y
|
||||
:internal.shadow/blur
|
||||
|
|
|
|||
|
|
@ -281,6 +281,15 @@
|
|||
(d/without-nils))]
|
||||
(assoc-in shape [:strokes index] new-attrs)))))))))
|
||||
|
||||
(defn change-shadow
|
||||
[ids attrs index]
|
||||
(ptk/reify ::change-shadow
|
||||
ptk/WatchEvent
|
||||
(watch [_ _ _]
|
||||
(rx/of (dch/update-shapes ids (fn [shape]
|
||||
(let [new-attrs (merge (get-in shape [:shadow index :color]) attrs)]
|
||||
(assoc-in shape [:shadow index :color] new-attrs))))))))
|
||||
|
||||
(defn add-stroke
|
||||
[ids stroke]
|
||||
(ptk/reify ::add-stroke
|
||||
|
|
@ -420,6 +429,7 @@
|
|||
(rx/map (fn [shape] (case (:prop shape)
|
||||
:fill (change-fill [(:shape-id shape)] new-color (:index shape))
|
||||
:stroke (change-stroke [(:shape-id shape)] new-color (:index shape))
|
||||
:shadow (change-shadow [(:shape-id shape)] new-color (:index shape))
|
||||
:content (dwt/update-text-with-function (:shape-id shape) (partial change-text-color old-color new-color (:index shape))))))))))
|
||||
|
||||
(defn apply-color-from-palette
|
||||
|
|
|
|||
|
|
@ -41,6 +41,18 @@
|
|||
:shape-id (:shape-id stroke)
|
||||
:index (:index stroke)}))
|
||||
|
||||
(defn shadow->color-att
|
||||
[shadow]
|
||||
(let [attrs (d/without-nils {:color (get-in shadow [:color :color])
|
||||
:opacity (get-in shadow [:color :opacity])
|
||||
:id (get-in shadow [:color :id])
|
||||
:file-id (get-in shadow [:color :file-id])
|
||||
:gradient (get-in shadow [:color :gradient])})]
|
||||
{:attrs attrs
|
||||
:prop :shadow
|
||||
:shape-id (:shape-id shadow)
|
||||
:index (:index shadow)}))
|
||||
|
||||
(defn text->color-att
|
||||
[fill]
|
||||
(let [attrs (d/without-nils {:color (:fill-color fill)
|
||||
|
|
@ -69,15 +81,18 @@
|
|||
(reduce
|
||||
(fn [list shape]
|
||||
(let [fill-obj (map-indexed #(assoc %2 :shape-id (:id shape) :index %1) (:fills shape))
|
||||
stroke-obj (map-indexed #(assoc %2 :shape-id (:id shape) :index %1) (:strokes shape))]
|
||||
stroke-obj (map-indexed #(assoc %2 :shape-id (:id shape) :index %1) (:strokes shape))
|
||||
shadow-obj (map-indexed #(assoc %2 :shape-id (:id shape) :index %1) (:shadow shape))]
|
||||
(if (= :text (:type shape))
|
||||
(-> list
|
||||
(into (map stroke->color-att) stroke-obj)
|
||||
(into (map shadow->color-att) shadow-obj)
|
||||
(into (extract-text-colors shape)))
|
||||
|
||||
(-> list
|
||||
(into (map fill->color-att) fill-obj)
|
||||
(into (map stroke->color-att) stroke-obj)))))
|
||||
(into (map stroke->color-att) stroke-obj)
|
||||
(into (map shadow->color-att) shadow-obj)))))
|
||||
[]
|
||||
shapes))
|
||||
|
||||
|
|
@ -117,7 +132,7 @@
|
|||
shapes-by-color (get @grouped-colors* old-color)]
|
||||
(reset! prev-color* new-color)
|
||||
(st/emit! (dc/change-color-in-selected new-color shapes-by-color old-color)))))
|
||||
|
||||
|
||||
on-open (mf/use-fn
|
||||
(fn [color]
|
||||
(reset! prev-color* color)))
|
||||
|
|
|
|||
|
|
@ -57,7 +57,7 @@
|
|||
on-remove-shadow
|
||||
(fn [index]
|
||||
(fn []
|
||||
(st/emit! (dch/update-shapes ids #(update % :shadow remove-shadow-by-index index) ))))
|
||||
(st/emit! (dch/update-shapes ids #(update % :shadow remove-shadow-by-index index)))))
|
||||
|
||||
select-text
|
||||
(fn [ref] (fn [_] (dom/select-text! (mf/ref-val ref))))
|
||||
|
|
@ -78,10 +78,9 @@
|
|||
update-color
|
||||
(fn [index]
|
||||
(fn [color]
|
||||
(let [color (dissoc color :id :file-id :gradient)]
|
||||
(st/emit! (dch/update-shapes
|
||||
ids
|
||||
#(assoc-in % [:shadow index :color] color))))))
|
||||
(st/emit! (dch/update-shapes
|
||||
ids
|
||||
#(assoc-in % [:shadow index :color] color)))))
|
||||
|
||||
detach-color
|
||||
(fn [index]
|
||||
|
|
@ -117,12 +116,12 @@
|
|||
;; :value (:blur value)}]
|
||||
|
||||
[:select.input-select
|
||||
{:default-value (str (:style value))
|
||||
:on-change (fn [event]
|
||||
(let [value (-> event dom/get-target dom/get-value d/read-string)]
|
||||
(st/emit! (dch/update-shapes ids #(assoc-in % [:shadow index :style] value)))))}
|
||||
[:option {:value ":drop-shadow"} (tr "workspace.options.shadow-options.drop-shadow")]
|
||||
[:option {:value ":inner-shadow"} (tr "workspace.options.shadow-options.inner-shadow")]]
|
||||
{:default-value (str (:style value))
|
||||
:on-change (fn [event]
|
||||
(let [value (-> event dom/get-target dom/get-value d/read-string)]
|
||||
(st/emit! (dch/update-shapes ids #(assoc-in % [:shadow index :style] value)))))}
|
||||
[:option {:value ":drop-shadow"} (tr "workspace.options.shadow-options.drop-shadow")]
|
||||
[:option {:value ":inner-shadow"} (tr "workspace.options.shadow-options.inner-shadow")]]
|
||||
|
||||
[:div.element-set-actions
|
||||
[:div.element-set-actions-button {:on-click (toggle-visibility index)}
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue