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

♻️ Switch contextual notification component (#5874)

Browse source
This commit is contained in:
Xaviju 2025-02-17 16:03:13 +01:00 • committed by GitHub
parent c41f86f0a4
commit 91fa39705d
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 11 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

7
frontend/src/app/main/ui/auth/login.cljs
View file

@ -18,6 +18,7 @@
[app.main.ui.components.button-link :as bl] [app.main.ui.components.button-link :as bl]
[app.main.ui.components.forms :as fm] [app.main.ui.components.forms :as fm]
[app.main.ui.components.link :as lk] [app.main.ui.components.link :as lk]
[app.main.ui.ds.notifications.context-notification :refer [context-notification*]]
[app.main.ui.icons :as i] [app.main.ui.icons :as i]
[app.main.ui.notifications.context-notification :refer [context-notification]] [app.main.ui.notifications.context-notification :refer [context-notification]]
[app.util.dom :as dom] [app.util.dom :as dom]
@ -158,10 +159,8 @@
[:* [:*
(when-let [message @error] (when-let [message @error]
[:& context-notification [:> context-notification*
{:level :error {:level :error} message])
:content message
:role "alert"}])
[:& fm/form {:on-submit on-submit [:& fm/form {:on-submit on-submit
:class (stl/css :login-form) :class (stl/css :login-form)

2
frontend/src/app/main/ui/ds/notifications/shared/notification_pill.scss
View file

@ -14,7 +14,7 @@
--notification-bg-color: var(--color-background-primary); --notification-bg-color: var(--color-background-primary);
--notification-fg-color: var(--color-foreground-primary); --notification-fg-color: var(--color-foreground-primary);
--notification-border-color: var(--color-background-quaternary); --notification-border-color: var(--color-background-quaternary);
--notification-padding: var(--sp-l); --notification-padding: var(--sp-m);
--notification-icon-color: var(--color-foreground-secondary); --notification-icon-color: var(--color-foreground-secondary);
--notification-icon-margin: var(--sp-xxs); --notification-icon-margin: var(--sp-xxs);

5
frontend/src/app/main/ui/notifications.cljs
View file

@ -21,7 +21,7 @@
[] []
(let [notification (mf/deref ref:notification) (let [notification (mf/deref ref:notification)
on-close (mf/use-fn #(st/emit! (ntf/hide))) on-close (mf/use-fn #(st/emit! (ntf/hide)))
context? (and (nil? (:timeout notification)) actionable? (and (nil? (:timeout notification))
(nil? (:actions notification))) (nil? (:actions notification)))
inline? (or (= :inline (:type notification)) inline? (or (= :inline (:type notification))
(= :floating (:position notification))) (= :floating (:position notification)))
@ -44,7 +44,8 @@
:links (:links notification) :links (:links notification)
:content (:content notification)}] :content (:content notification)}]
context? ;; This should be substited with the actionable-notification* component
actionable?
[:& context-notification [:& context-notification
{:level (or (:level notification) :info) {:level (or (:level notification) :info)
:links (:links notification) :links (:links notification)

7
frontend/src/app/main/ui/workspace/tokens/form.cljs
View file

@ -19,7 +19,7 @@
[app.main.ui.ds.foundations.assets.icon :as i] [app.main.ui.ds.foundations.assets.icon :as i]
[app.main.ui.ds.foundations.typography.heading :refer [heading*]] [app.main.ui.ds.foundations.typography.heading :refer [heading*]]
[app.main.ui.ds.foundations.typography.text :refer [text*]] [app.main.ui.ds.foundations.typography.text :refer [text*]]
[app.main.ui.notifications.context-notification :refer [context-notification]] [app.main.ui.ds.notifications.context-notification :refer [context-notification*]]
[app.main.ui.workspace.colorpicker :as colorpicker] [app.main.ui.workspace.colorpicker :as colorpicker]
[app.main.ui.workspace.colorpicker.ramp :refer [ramp-selector*]] [app.main.ui.workspace.colorpicker.ramp :refer [ramp-selector*]]
[app.main.ui.workspace.tokens.changes :as wtch] [app.main.ui.workspace.tokens.changes :as wtch]
@ -498,9 +498,8 @@
(when (and warning-name-change? (= action "edit")) (when (and warning-name-change? (= action "edit"))
[:div {:class (stl/css :warning-name-change-notification-wrapper)} [:div {:class (stl/css :warning-name-change-notification-wrapper)}
[:> context-notification [:> context-notification*
{:level :warning {:level :warning :appearance :ghost} (tr "workspace.token.warning-name-change")]])]
:content (tr "workspace.token.warning-name-change")}]])]
[:div {:class (stl/css :input-row)} [:div {:class (stl/css :input-row)}
[:> input-tokens* [:> input-tokens*