-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathassets.js
97 lines (92 loc) · 4.82 KB
/
assets.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
export const styles = `
.widget__container * {
box-sizing: border-box;
}
h3, p, input {
margin: 0;
padding: 0;
}
.widget__container {
width: 400px;
overflow: auto;
position: absolute;
transition: max-height .2s ease;
font-family: Helvetica, Arial ,sans-serif;
border-radius: 10px;
box-sizing: border-box;
}
.widget__icon {
cursor: pointer;
width: 50%;
z-index: 999;
transition: transform .3s ease;
}
.peach-tooltiptext {
width: 100%;
background: #ffffff;
border: 1px solid var(--brandColor);
box-shadow: 0px 2px 9px rgba(0, 0, 0, 0.13);
color: #3a3a3a;
font-size: 14px !important;
line-height: 16.72px;
font-weight: bold;
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
border-radius: 4px;
padding: 5px;
animation: peachTooltip-slideUp 1s ease forwards 1s;
}
.widget__hidden {
transform: scale(0);
}
.button__container {
display: flex;
flex-direction: column;
text-decoration: none;
align-items: center;
border: none;
border-radius: 50%;
cursor: pointer;
}
.widget__container.hidden {
max-height: 0px;
}
.widget__header {
padding: 1rem 2rem 1.5rem;
background-color: #000;
color: #fff;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
text-align: center;
}
.widget__header h3 {
font-size: 24px;
font-weight: 400;
margin-bottom: 8px;
}
@keyframes peachTooltip-slideUp {
from {
margin-bottom: 20px;
opacity: 0;
}
to {
margin-bottom: 0px;
opacity: 1;
}
}
`;
export const MESSAGE_ICON = `
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 175.216 175.552" height="52px">
<defs><linearGradient id="b" x1="85.915" x2="86.535" y1="32.567" y2="137.092" gradientUnits="userSpaceOnUse"><stop offset="0" stop-color="#57d163"/><stop offset="1" stop-color="#23b33a"/></linearGradient><filter id="a" width="1.115" height="1.114" x="-.057" y="-.057" color-interpolation-filters="sRGB"><feGaussianBlur stdDeviation="3.531"/></filter></defs><path fill="#b3b3b3" d="m54.532 138.45 2.235 1.324c9.387 5.571 20.15 8.518 31.126 8.523h.023c33.707 0 61.139-27.426 61.153-61.135.006-16.335-6.349-31.696-17.895-43.251A60.75 60.75 0 0 0 87.94 25.983c-33.733 0-61.166 27.423-61.178 61.13a60.98 60.98 0 0 0 9.349 32.535l1.455 2.312-6.179 22.558zm-40.811 23.544L24.16 123.88c-6.438-11.154-9.825-23.808-9.821-36.772.017-40.556 33.021-73.55 73.578-73.55 19.681.01 38.154 7.669 52.047 21.572s21.537 32.383 21.53 52.037c-.018 40.553-33.027 73.553-73.578 73.553h-.032c-12.313-.005-24.412-3.094-35.159-8.954zm0 0" filter="url(#a)"/><path fill="#fff" d="m12.966 161.238 10.439-38.114a73.42 73.42 0 0 1-9.821-36.772c.017-40.556 33.021-73.55 73.578-73.55 19.681.01 38.154 7.669 52.047 21.572s21.537 32.383 21.53 52.037c-.018 40.553-33.027 73.553-73.578 73.553h-.032c-12.313-.005-24.412-3.094-35.159-8.954z"/><path fill="url(#linearGradient1780)" d="M87.184 25.227c-33.733 0-61.166 27.423-61.178 61.13a60.98 60.98 0 0 0 9.349 32.535l1.455 2.312-6.179 22.559 23.146-6.069 2.235 1.324c9.387 5.571 20.15 8.518 31.126 8.524h.023c33.707 0 61.14-27.426 61.153-61.135a60.75 60.75 0 0 0-17.895-43.251 60.75 60.75 0 0 0-43.235-17.929z"/><path fill="url(#b)" d="M87.184 25.227c-33.733 0-61.166 27.423-61.178 61.13a60.98 60.98 0 0 0 9.349 32.535l1.455 2.313-6.179 22.558 23.146-6.069 2.235 1.324c9.387 5.571 20.15 8.517 31.126 8.523h.023c33.707 0 61.14-27.426 61.153-61.135a60.75 60.75 0 0 0-17.895-43.251 60.75 60.75 0 0 0-43.235-17.928z"/><path fill="#fff" fill-rule="evenodd" d="M68.772 55.603c-1.378-3.061-2.828-3.123-4.137-3.176l-3.524-.043c-1.226 0-3.218.46-4.902 2.3s-6.435 6.287-6.435 15.332 6.588 17.785 7.506 19.013 12.718 20.381 31.405 27.75c15.529 6.124 18.689 4.906 22.061 4.6s10.877-4.447 12.408-8.74 1.532-7.971 1.073-8.74-1.685-1.226-3.525-2.146-10.877-5.367-12.562-5.981-2.91-.919-4.137.921-4.746 5.979-5.819 7.206-2.144 1.381-3.984.462-7.76-2.861-14.784-9.124c-5.465-4.873-9.154-10.891-10.228-12.73s-.114-2.835.808-3.751c.825-.824 1.838-2.147 2.759-3.22s1.224-1.84 1.836-3.065.307-2.301-.153-3.22-4.032-10.011-5.666-13.647"/>
</svg>
`;
export const CLOSE_ICON = `
<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32" fill="#FFFFFF" stroke="#FFFFFF" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-x">
<line x1="18" y1="6" x2="6" y2="18"></line>
<line x1="6" y1="6" x2="18" y2="18"></line>
</svg>
`;