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

🐛 Hide guides parameters when hiding guides

Browse source
This commit is contained in:
alonso.torres 2023-12-12 15:52:21 +01:00
parent 85c301c26b
commit db3d7af0b8
1 changed files with 97 additions and 96 deletions
Download patch file Download diff file Expand all files Collapse all files

193
frontend/src/app/main/ui/workspace/sidebar/options/menus/frame_grid.cljs
View file

@ -180,108 +180,109 @@
:on-click on-remove} :on-click on-remove}
i/remove-refactor]]] i/remove-refactor]]]
[:& advanced-options {:class (stl/css :grid-advanced-options) (when (:display grid)
:visible? open? [:& advanced-options {:class (stl/css :grid-advanced-options)
:on-close toggle-advanced-options} :visible? open?
;; square :on-close toggle-advanced-options}
(when (= :square type) ;; square
[:div {:class (stl/css :square-row)} (when (= :square type)
[:div {:class (stl/css :advanced-row)} [:div {:class (stl/css :square-row)}
[:& color-row {:color (:color params) [:div {:class (stl/css :advanced-row)}
:title (tr "workspace.options.grid.params.color") [:& color-row {:color (:color params)
:disable-gradient true :title (tr "workspace.options.grid.params.color")
:disable-image true :disable-gradient true
:on-change handle-change-color :disable-image true
:on-detach handle-detach-color}] :on-change handle-change-color
[:button {:class (stl/css-case :show-more-options true :on-detach handle-detach-color}]
:selected show-more-options?) [:button {:class (stl/css-case :show-more-options true
:on-click toggle-more-options} :selected show-more-options?)
i/menu-refactor]] :on-click toggle-more-options}
(when show-more-options? i/menu-refactor]]
[:div {:class (stl/css :second-row)} (when show-more-options?
[:button {:class (stl/css-case :btn-options true [:div {:class (stl/css :second-row)}
:disabled is-default) [:button {:class (stl/css-case :btn-options true
:disabled is-default :disabled is-default)
:on-click handle-use-default} :disabled is-default
[:span (tr "workspace.options.grid.params.use-default")]] :on-click handle-use-default}
[:button {:class (stl/css-case :btn-options true [:span (tr "workspace.options.grid.params.use-default")]]
:disabled is-default) [:button {:class (stl/css-case :btn-options true
:disabled is-default :disabled is-default)
:on-click handle-set-as-default} :disabled is-default
[:span (tr "workspace.options.grid.params.set-default")]]])]) :on-click handle-set-as-default}
[:span (tr "workspace.options.grid.params.set-default")]]])])
(when (or (= :column type) (= :row type)) (when (or (= :column type) (= :row type))
[:div {:class (stl/css :column-row)} [:div {:class (stl/css :column-row)}
[:div {:class (stl/css :advanced-row)} [:div {:class (stl/css :advanced-row)}
[:div {:class (stl/css :orientation-select-wrapper)} [:div {:class (stl/css :orientation-select-wrapper)}
[:& select {:data-mousetrap-dont-stop true ;; makes mousetrap to not stop at this element [:& select {:data-mousetrap-dont-stop true ;; makes mousetrap to not stop at this element
:default-value (:type params) :default-value (:type params)
:class (stl/css :orientation-select) :class (stl/css :orientation-select)
:options [{:value :stretch :label (tr "workspace.options.grid.params.type.stretch")} :options [{:value :stretch :label (tr "workspace.options.grid.params.type.stretch")}
{:value :left :label (if (= type :row) {:value :left :label (if (= type :row)
(tr "workspace.options.grid.params.type.top") (tr "workspace.options.grid.params.type.top")
(tr "workspace.options.grid.params.type.left"))} (tr "workspace.options.grid.params.type.left"))}
{:value :center :label (tr "workspace.options.grid.params.type.center")} {:value :center :label (tr "workspace.options.grid.params.type.center")}
{:value :right :label (if (= type :row) {:value :right :label (if (= type :row)
(tr "workspace.options.grid.params.type.bottom") (tr "workspace.options.grid.params.type.bottom")
(tr "workspace.options.grid.params.type.right"))}] (tr "workspace.options.grid.params.type.right"))}]
:on-change (handle-change :params :type)}]] :on-change (handle-change :params :type)}]]
[:div {:class (stl/css :color-wrapper)} [:div {:class (stl/css :color-wrapper)}
[:& color-row {:color (:color params) [:& color-row {:color (:color params)
:title (tr "workspace.options.grid.params.color") :title (tr "workspace.options.grid.params.color")
:disable-gradient true :disable-gradient true
:disable-image true :disable-image true
:on-change handle-change-color :on-change handle-change-color
:on-detach handle-detach-color}]]] :on-detach handle-detach-color}]]]
[:div {:class (stl/css :advanced-row)} [:div {:class (stl/css :advanced-row)}
[:div {:class (stl/css :height) [:div {:class (stl/css :height)
:title (if (= :row type) :title (if (= :row type)
(tr "workspace.options.grid.params.height") (tr "workspace.options.grid.params.height")
(tr "workspace.options.grid.params.width"))} (tr "workspace.options.grid.params.width"))}
[:span {:class (stl/css :icon-text)} [:span {:class (stl/css :icon-text)}
(if (= :row type) (if (= :row type)
"H" "H"
"W")] "W")]
[:> numeric-input* {:placeholder "Auto" [:> numeric-input* {:placeholder "Auto"
:on-change handle-change-item-length :on-change handle-change-item-length
:nillable true :nillable true
:className (stl/css :numeric-input) :className (stl/css :numeric-input)
:value (or (:item-length params) "")}]] :value (or (:item-length params) "")}]]
[:div {:class (stl/css :gutter) [:div {:class (stl/css :gutter)
:title (tr "workspace.options.grid.params.gutter")} :title (tr "workspace.options.grid.params.gutter")}
[:span {:class (stl/css-case :icon true [:span {:class (stl/css-case :icon true
:rotated (= type :row))} i/gap-horizontal-refactor] :rotated (= type :row))} i/gap-horizontal-refactor]
[:> numeric-input* {:placeholder "0" [:> numeric-input* {:placeholder "0"
:on-change (handle-change :params :gutter) :on-change (handle-change :params :gutter)
:nillable true :nillable true
:className (stl/css :numeric-input) :className (stl/css :numeric-input)
:value (or (:gutter params) 0)}]] :value (or (:gutter params) 0)}]]
[:div {:class (stl/css :margin) [:div {:class (stl/css :margin)
:title (tr "workspace.options.grid.params.margin")} :title (tr "workspace.options.grid.params.margin")}
[:span {:class (stl/css-case :icon true [:span {:class (stl/css-case :icon true
:rotated (= type :column))} i/grid-margin-refactor] :rotated (= type :column))} i/grid-margin-refactor]
[:> numeric-input* {:placeholder "0" [:> numeric-input* {:placeholder "0"
:on-change (handle-change :params :margin) :on-change (handle-change :params :margin)
:nillable true :nillable true
:className (stl/css :numeric-input) :className (stl/css :numeric-input)
:value (or (:margin params) 0)}]] :value (or (:margin params) 0)}]]
[:button {:class (stl/css-case :show-more-options true [:button {:class (stl/css-case :show-more-options true
:selected show-more-options?) :selected show-more-options?)
:on-click toggle-more-options} :on-click toggle-more-options}
i/menu-refactor] i/menu-refactor]
(when show-more-options? (when show-more-options?
[:div {:class (stl/css :more-options)} [:div {:class (stl/css :more-options)}
[:button {:disabled is-default [:button {:disabled is-default
:class (stl/css :option-btn) :class (stl/css :option-btn)
:on-click handle-use-default} (tr "workspace.options.grid.params.use-default")] :on-click handle-use-default} (tr "workspace.options.grid.params.use-default")]
[:button {:disabled is-default [:button {:disabled is-default
:class (stl/css :option-btn) :class (stl/css :option-btn)
:on-click handle-set-as-default} (tr "workspace.options.grid.params.set-default")]])]])]] :on-click handle-set-as-default} (tr "workspace.options.grid.params.set-default")]])]])])]
[:div.grid-option [:div.grid-option
[:div.grid-option-main {:style {:display (when open? "none")}} [:div.grid-option-main {:style {:display (when open? "none")}}