mirror of
https://github.com/penpot/penpot.git
synced 2025-05-08 08:05:53 +02:00
✨ Add help button to flex options
This commit is contained in:
parent
23b5eeaf68
commit
d3b71889ae
3 changed files with 19 additions and 2 deletions
|
@ -102,6 +102,7 @@
|
||||||
|
|
||||||
(def terms-of-service-uri (obj/get global "penpotTermsOfServiceURI" "https://penpot.app/terms"))
|
(def terms-of-service-uri (obj/get global "penpotTermsOfServiceURI" "https://penpot.app/terms"))
|
||||||
(def privacy-policy-uri (obj/get global "penpotPrivacyPolicyURI" "https://penpot.app/privacy"))
|
(def privacy-policy-uri (obj/get global "penpotPrivacyPolicyURI" "https://penpot.app/privacy"))
|
||||||
|
(def flex-help-uri (obj/get global "penpotGridHelpURI" "https://help.penpot.app/user-guide/flexible-layouts/"))
|
||||||
(def grid-help-uri (obj/get global "penpotGridHelpURI" "https://help.penpot.app/user-guide/flexible-layouts/"))
|
(def grid-help-uri (obj/get global "penpotGridHelpURI" "https://help.penpot.app/user-guide/flexible-layouts/"))
|
||||||
|
|
||||||
(defn- normalize-uri
|
(defn- normalize-uri
|
||||||
|
|
|
@ -1356,6 +1356,11 @@
|
||||||
(fn []
|
(fn []
|
||||||
(reset! show-layout-dropdown* false)))
|
(reset! show-layout-dropdown* false)))
|
||||||
|
|
||||||
|
handle-open-flex-help
|
||||||
|
(mf/use-callback
|
||||||
|
(fn []
|
||||||
|
(st/emit! (dom/open-new-window cf/flex-help-uri))))
|
||||||
|
|
||||||
handle-open-grid-help
|
handle-open-grid-help
|
||||||
(mf/use-callback
|
(mf/use-callback
|
||||||
(fn []
|
(fn []
|
||||||
|
@ -1413,10 +1418,13 @@
|
||||||
[:& wrap-row {:wrap-type wrap-type
|
[:& wrap-row {:wrap-type wrap-type
|
||||||
:on-click toggle-wrap-refactor}]]
|
:on-click toggle-wrap-refactor}]]
|
||||||
|
|
||||||
[:div {:class (stl/css :second-row)}
|
[:div {:class (stl/css :second-row :help-button-wrapper)}
|
||||||
[:& justify-content-row {:is-col? is-col?
|
[:& justify-content-row {:is-col? is-col?
|
||||||
:justify-content justify-content
|
:justify-content justify-content
|
||||||
:on-change set-justify-content-refactor}]]
|
:on-change set-justify-content-refactor}]
|
||||||
|
|
||||||
|
[:button {:on-click handle-open-flex-help
|
||||||
|
:class (stl/css :help-button)} i/help-refactor]]
|
||||||
(when (= :wrap wrap-type)
|
(when (= :wrap wrap-type)
|
||||||
[:div {:class (stl/css :third-row)}
|
[:div {:class (stl/css :third-row)}
|
||||||
[:& align-content-row {:is-col? is-col?
|
[:& align-content-row {:is-col? is-col?
|
||||||
|
|
|
@ -65,6 +65,14 @@
|
||||||
.forth-row {
|
.forth-row {
|
||||||
@include flexColumn;
|
@include flexColumn;
|
||||||
}
|
}
|
||||||
|
.help-button-wrapper {
|
||||||
|
position: relative;
|
||||||
|
.help-button {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Add table
Reference in a new issue