(core) Adding colors to toast notification

Summary:
Styling toast notification. Adding colors and icons.
In Grist, changed the default style for errors (will be shown in red), and a style for
Linked copied to clipboard (will be shown in Green).
All other colors are not used currently, left for another diff.

Test Plan: manual

Reviewers: georgegevoian

Reviewed By: georgegevoian

Differential Revision: https://phab.getgrist.com/D3053
This commit is contained in:
Jarosław Sadziński
2021-10-01 21:38:58 +02:00
parent 43a62e7254
commit 40ddb57dfc
12 changed files with 203 additions and 22 deletions

View File

@@ -0,0 +1,18 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="svg8"
version="1.1"
viewBox="0 0 16 16"
height="16px"
width="16px">
<defs
id="defs821" />
<title
id="title895">Icons / UI / InfoSolid</title>
<path
style="clip-rule:evenodd;fill-rule:evenodd"
id="path816"
d="M 16,8 A 8,8 0 1 1 0,8 8,8 0 0 1 16,8 Z M 9,4 A 1,1 0 1 1 7,4 1,1 0 0 1 9,4 Z M 7,7 a 1,1 0 0 0 0,2 v 3 a 1,1 0 0 0 1,1 H 9 A 1,1 0 1 0 9,11 V 8 A 1,1 0 0 0 8,7 Z" />
</svg>

After

Width:  |  Height:  |  Size: 572 B

View File

@@ -0,0 +1,20 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
width="16px"
height="16px"
viewBox="0 0 16 16"
version="1.1"
id="svg8">
<title
id="title895">Icons / UI / TickSolid</title>
<g
transform="matrix(0.13020727,0,0,0.13020727,2.27565e-7,1.3043306e-4)"
id="g4">
<path
id="path2"
d="m 61.44,0 c 33.933,0 61.441,27.507 61.441,61.439 0,33.933 -27.508,61.44 -61.441,61.44 C 27.508,122.88 0,95.372 0,61.439 0,27.507 27.508,0 61.44,0 Z M 34.106,67.678 34.091,67.664 c -0.785,-0.718 -1.207,-1.685 -1.256,-2.669 -0.049,-0.982 0.275,-1.985 0.984,-2.777 0.01,-0.011 0.019,-0.021 0.029,-0.031 0.717,-0.784 1.684,-1.207 2.668,-1.256 0.989,-0.049 1.998,0.28 2.792,0.998 L 52.264,73.677 83.353,41.118 v 0 c 0.74,-0.776 1.723,-1.18 2.719,-1.204 0.992,-0.025 1.994,0.329 2.771,1.067 v 10e-4 c 0.777,0.739 1.18,1.724 1.205,2.718 0.025,0.993 -0.33,1.997 -1.068,2.773 L 55.279,81.769 c -0.023,0.024 -0.048,0.047 -0.073,0.067 -0.715,0.715 -1.649,1.095 -2.598,1.13 -0.974,0.037 -1.963,-0.293 -2.744,-1 L 34.118,67.688 Z"
style="clip-rule:evenodd;fill-rule:evenodd" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@@ -0,0 +1,20 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
id="svg8"
version="1.1"
viewBox="0 0 16 16"
height="16px"
width="16px">
<title
id="title895">Icons / UI / Warning</title>
<g
id="g4"
transform="matrix(0.13020927,0,0,0.13020927,-3.3723964e-5,1.6645866)">
<path
id="path2"
d="m 65.45,1.972 55.594,87.323 c 1.673,2.63 3.117,8.016 0,8.016 H 1.837 c -3.118,0 -1.676,-5.386 0,-8.016 L 57.431,1.972 c 1.675,-2.63 6.343,-2.628 8.019,0 z m -8.872,72.174 h 9.682 v 8.561 h -9.682 z m 9.676,-5.929 H 56.58 C 55.616,56.461 53.598,49.001 53.598,37.262 c 0,-4.331 3.51,-7.842 7.841,-7.842 4.332,0 7.842,3.511 7.842,7.842 10e-4,11.734 -2.045,19.209 -3.027,30.955 z"
style="clip-rule:evenodd;fill-rule:evenodd" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 861 B