Penpot/penpot
0
Fork 0
mirror of https://github.com/penpot/penpot.git synced 2025-02-15 11:38:24 -05:00
Code Issues Activity

✨ Make measures menu as reusable component.

Browse source
This commit is contained in:
alonso.torres 2020-04-13 10:00:39 +02:00 • committed by Andrey Antukh
parent 5c3499057e
commit 344a7cbebe
2 changed files with 79 additions and 73 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
frontend/src/uxbox/main/ui/workspace/sidebar/options/group.cljs
View file

@ -16,5 +16,6 @@
(mf/defc options
[{:keys [shape] :as props}]
[:div
[:& measures-menu {:shape shape}]])
[:& measures-menu {:options #{:position :rotation}
:shape shape}]])

17
frontend/src/uxbox/main/ui/workspace/sidebar/options/measures.cljs
View file

@ -19,8 +19,9 @@
[uxbox.util.i18n :refer [t] :as i18n]))
(mf/defc measures-menu
[{:keys [shape] :as props}]
(let [locale (i18n/use-locale)
[{:keys [shape options] :as props}]
(let [options (or options #{:size :position :rotation :radius})
locale (i18n/use-locale)
on-size-change
(fn [event attr]
@ -63,6 +64,7 @@
[:div.element-set-content
;; WIDTH & HEIGHT
(when (options :size)
[:div.row-flex
[:span.element-set-subtitle (t locale "workspace.options.size")]
[:div.lock-size {:class (when (:proportion-lock shape) "selected")
@ -87,9 +89,10 @@
:on-change on-height-change
:value (str (-> (:height shape)
(d/coalesce 0)
(math/round)))}]]]
(math/round)))}]]])
;; POSITION
(when (options :position)
[:div.row-flex
[:span.element-set-subtitle (t locale "workspace.options.position")]
[:div.input-element.pixels
@ -107,8 +110,9 @@
:on-change on-pos-y-change
:value (str (-> (:y shape)
(d/coalesce 0)
(math/round)))}]]]
(math/round)))}]]])
(when (options :rotation)
[:div.row-flex
[:span.element-set-subtitle (t locale "workspace.options.rotation")]
[:div.input-element.degrees
@ -130,8 +134,9 @@
:no-validate true
:on-change on-rotation-change
:value (str (-> (:rotation shape)
(d/coalesce 0)))}]]
(d/coalesce 0)))}]])
(when (options :radius)
[:div.row-flex
[:span.element-set-subtitle (t locale "workspace.options.radius")]
[:div.input-element.pixels
@ -142,4 +147,4 @@
:value (str (-> (:rx shape)
(d/coalesce 0)
(math/round)))}]]
[:div.input-element]]]]))
[:div.input-element]])]]))