diff --git a/frontend/resources/images/icons/info.svg b/frontend/resources/images/icons/info.svg new file mode 100644 index 000000000..ff916bf3f --- /dev/null +++ b/frontend/resources/images/icons/info.svg @@ -0,0 +1,3 @@ + + + diff --git a/frontend/src/app/main/ui/ds/colors.scss b/frontend/src/app/main/ui/ds/colors.scss index e7a63c0fa..914b29108 100644 --- a/frontend/src/app/main/ui/ds/colors.scss +++ b/frontend/src/app/main/ui/ds/colors.scss @@ -21,8 +21,7 @@ $orange-500: #fe4811; $orange-950: #440806; $red-200: #ffcada; -$red-500: #ff3277; -$red-700: #c80857; +$red-400: #c80857; $red-950: #500124; $pink-400: #ff6fe0; @@ -71,7 +70,7 @@ $grayish-red: #bfbfbf; --color-background-success: #{$green-200}; --color-accent-warning: #{$orange-500}; --color-background-warning: #{$orange-200}; - --color-accent-error: #{$red-500}; + --color-accent-error: #{$red-400}; --color-background-error: #{$red-200}; --color-accent-info: #{$blue-500}; --color-background-info: #{$blue-200}; @@ -103,7 +102,7 @@ $grayish-red: #bfbfbf; --color-background-success: #{$green-950}; --color-accent-warning: #{$orange-500}; --color-background-warning: #{$orange-950}; - --color-accent-error: #{$red-700}; + --color-accent-error: #{$red-400}; --color-background-error: #{$red-950}; --color-accent-info: #{$blue-500}; --color-background-info: #{$blue-950}; diff --git a/frontend/src/app/main/ui/ds/controls/input.scss b/frontend/src/app/main/ui/ds/controls/input.scss index 1c9d49034..312729c9d 100644 --- a/frontend/src/app/main/ui/ds/controls/input.scss +++ b/frontend/src/app/main/ui/ds/controls/input.scss @@ -57,7 +57,7 @@ } &::selection { - background: var(--color-accent-primary-muted); + background: var(--color-accent-select); } &::placeholder { diff --git a/frontend/src/app/main/ui/ds/foundations/assets/icon.cljs b/frontend/src/app/main/ui/ds/foundations/assets/icon.cljs index b2952e58e..e047e8e92 100644 --- a/frontend/src/app/main/ui/ds/foundations/assets/icon.cljs +++ b/frontend/src/app/main/ui/ds/foundations/assets/icon.cljs @@ -157,6 +157,7 @@ (def ^:icon-id hug-content "hug-content") (def ^:icon-id icon "icon") (def ^:icon-id img "img") +(def ^:icon-id info "info") (def ^:icon-id interaction "interaction") (def ^:icon-id join-nodes "join-nodes") (def ^:icon-id external-link "external-link") diff --git a/frontend/src/app/main/ui/ds/notifications/toast.cljs b/frontend/src/app/main/ui/ds/notifications/toast.cljs index e38d25e28..ef84ac0e1 100644 --- a/frontend/src/app/main/ui/ds/notifications/toast.cljs +++ b/frontend/src/app/main/ui/ds/notifications/toast.cljs @@ -15,7 +15,7 @@ (def levels (set '("info" "warning" "error" "success"))) (def ^:private icons-by-level - {"info" i/help + {"info" i/info "warning" i/msg-neutral "error" i/delete-text "success" i/status-tick})