mirror of
https://github.com/penpot/penpot.git
synced 2025-07-29 19:37:25 +02:00
🎉 Newsletter Opt-in options for subscription categories
This commit is contained in:
parent
c43e8bda3c
commit
f921085c72
5 changed files with 80 additions and 37 deletions
|
@ -18,30 +18,43 @@
|
|||
::mf/register-as :onboarding-newsletter-modal}
|
||||
[]
|
||||
(let [message (tr "onboarding.newsletter.acceptance-message")
|
||||
newsletter-updates (mf/use-state false)
|
||||
newsletter-news (mf/use-state false)
|
||||
toggle
|
||||
(mf/use-callback
|
||||
(fn [option]
|
||||
(swap! option not)))
|
||||
|
||||
|
||||
accept
|
||||
(mf/use-callback
|
||||
(mf/deps @newsletter-updates @newsletter-news)
|
||||
(fn []
|
||||
(st/emit! (dm/success message)
|
||||
(modal/show {:type :onboarding-team})
|
||||
(du/update-profile-props {:newsletter-subscribed true}))))
|
||||
|
||||
decline
|
||||
(mf/use-callback
|
||||
(fn []
|
||||
(st/emit! (modal/show {:type :onboarding-team})
|
||||
(du/update-profile-props {:newsletter-subscribed false}))))]
|
||||
(modal/show {:type :onboarding-team})
|
||||
(du/update-profile-props {:newsletter-updates true :newsletter-news true}))))]
|
||||
|
||||
[:div.modal-overlay
|
||||
[:div.modal-container.onboarding.newsletter.animated.fadeInDown
|
||||
[:div.modal-top
|
||||
[:h1.newsletter-title {:data-test "onboarding-newsletter-title"} (tr "onboarding.newsletter.title")]
|
||||
[:p (tr "onboarding.newsletter.desc")]]
|
||||
[:p (tr "onboarding-v2.newsletter.desc")]]
|
||||
[:div.modal-bottom
|
||||
[:p (tr "onboarding.newsletter.privacy1") [:a {:target "_blank" :href "https://penpot.app/privacy.html"} (tr "onboarding.newsletter.policy")]]
|
||||
[:p (tr "onboarding.newsletter.privacy2")]]
|
||||
[:div.newsletter-options
|
||||
[:div.input-checkbox.check-primary
|
||||
[:input {:type "checkbox"
|
||||
:id "newsletter-updates"
|
||||
:on-change #(toggle newsletter-updates)}]
|
||||
[:label {:for "newsletter-updates"} (tr "onboarding-v2.newsletter.updates")]]
|
||||
[:div.input-checkbox.check-primary
|
||||
[:input {:type "checkbox"
|
||||
:id "newsletter-news"
|
||||
:on-change #(toggle newsletter-news)}]
|
||||
[:label {:for "newsletter-news"} (tr "onboarding-v2.newsletter.news")]]]
|
||||
[:p (tr "onboarding-v2.newsletter.privacy1") [:a {:target "_blank" :href "https://penpot.app/privacy.html"} (tr "onboarding.newsletter.policy")]]
|
||||
[:p (tr "onboarding-v2.newsletter.privacy2")]]
|
||||
[:div.modal-footer
|
||||
[:button.btn-secondary {:on-click decline} (tr "onboarding.newsletter.decline")]
|
||||
[:button.btn-primary {:on-click accept} (tr "onboarding.newsletter.accept")]]
|
||||
[:button.btn-primary {:on-click accept} (tr "labels.continue")]]
|
||||
[:img.deco.top {:src "images/deco-newsletter.png" :border "0"}]
|
||||
[:img.deco.newsletter-left {:src "images/deco-news-left.png" :border "0"}]
|
||||
[:img.deco.newsletter-right {:src "images/deco-news-right.png" :border "0"}]]]))
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue