@nyaruka/temba-components 0.26.7 → 0.26.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (127) hide show
  1. package/CHANGELOG.md +31 -0
  2. package/demo/index.html +9 -1
  3. package/dist/{5acfdad6.js → cbffa348.js} +515 -64
  4. package/dist/index.js +515 -64
  5. package/dist/static/icons/symbol-defs.svg +48 -5
  6. package/dist/static/img/schemes/email.svg +1 -0
  7. package/dist/static/img/schemes/facebook.svg +1 -0
  8. package/dist/static/img/schemes/instagram.svg +1 -0
  9. package/dist/static/img/schemes/line.svg +1 -0
  10. package/dist/static/img/schemes/messenger.svg +1 -0
  11. package/dist/static/img/schemes/tel.svg +34 -0
  12. package/dist/static/img/schemes/telegram.svg +1 -0
  13. package/dist/static/img/schemes/twitter.svg +1 -0
  14. package/dist/static/img/schemes/viber.svg +1 -0
  15. package/dist/static/img/schemes/vk.svg +1 -0
  16. package/dist/static/img/schemes/whatsapp.svg +1 -0
  17. package/dist/sw.js +1 -1
  18. package/dist/sw.js.map +1 -1
  19. package/dist/templates/components-body.html +1 -1
  20. package/dist/templates/components-head.html +1 -1
  21. package/out-tsc/src/RapidElement.js.map +1 -1
  22. package/out-tsc/src/RefreshElement.js +28 -0
  23. package/out-tsc/src/RefreshElement.js.map +1 -0
  24. package/out-tsc/src/button/Button.js +4 -0
  25. package/out-tsc/src/button/Button.js.map +1 -1
  26. package/out-tsc/src/contacts/ContactBadges.js +97 -0
  27. package/out-tsc/src/contacts/ContactBadges.js.map +1 -0
  28. package/out-tsc/src/contacts/ContactChat.js +5 -13
  29. package/out-tsc/src/contacts/ContactChat.js.map +1 -1
  30. package/out-tsc/src/contacts/ContactFieldEditor.js +211 -0
  31. package/out-tsc/src/contacts/ContactFieldEditor.js.map +1 -0
  32. package/out-tsc/src/contacts/ContactFields.js +163 -0
  33. package/out-tsc/src/contacts/ContactFields.js.map +1 -0
  34. package/out-tsc/src/contacts/ContactGroups.js +39 -0
  35. package/out-tsc/src/contacts/ContactGroups.js.map +1 -0
  36. package/out-tsc/src/contacts/ContactName.js +40 -0
  37. package/out-tsc/src/contacts/ContactName.js.map +1 -0
  38. package/out-tsc/src/contacts/ContactStoreElement.js +44 -0
  39. package/out-tsc/src/contacts/ContactStoreElement.js.map +1 -0
  40. package/out-tsc/src/contacts/ContactUrn.js +38 -0
  41. package/out-tsc/src/contacts/ContactUrn.js.map +1 -0
  42. package/out-tsc/src/contacts/events.js +76 -30
  43. package/out-tsc/src/contacts/events.js.map +1 -1
  44. package/out-tsc/src/contactsearch/ContactSearch.js +1 -1
  45. package/out-tsc/src/contactsearch/ContactSearch.js.map +1 -1
  46. package/out-tsc/src/interfaces.js +1 -0
  47. package/out-tsc/src/interfaces.js.map +1 -1
  48. package/out-tsc/src/label/Label.js +57 -12
  49. package/out-tsc/src/label/Label.js.map +1 -1
  50. package/out-tsc/src/list/TembaMenu.js +8 -6
  51. package/out-tsc/src/list/TembaMenu.js.map +1 -1
  52. package/out-tsc/src/select/Select.js +4 -4
  53. package/out-tsc/src/select/Select.js.map +1 -1
  54. package/out-tsc/src/store/Store.js +113 -3
  55. package/out-tsc/src/store/Store.js.map +1 -1
  56. package/out-tsc/src/store/StoreElement.js +55 -0
  57. package/out-tsc/src/store/StoreElement.js.map +1 -0
  58. package/out-tsc/src/tabpane/Tab.js +14 -1
  59. package/out-tsc/src/tabpane/Tab.js.map +1 -1
  60. package/out-tsc/src/tabpane/TabPane.js +35 -0
  61. package/out-tsc/src/tabpane/TabPane.js.map +1 -1
  62. package/out-tsc/src/textinput/TextInput.js +37 -19
  63. package/out-tsc/src/textinput/TextInput.js.map +1 -1
  64. package/out-tsc/src/vectoricon/VectorIcon.js +28 -15
  65. package/out-tsc/src/vectoricon/VectorIcon.js.map +1 -1
  66. package/out-tsc/temba-modules.js +12 -0
  67. package/out-tsc/temba-modules.js.map +1 -1
  68. package/out-tsc/test/temba-contact-history.test.js +1 -1
  69. package/out-tsc/test/temba-contact-history.test.js.map +1 -1
  70. package/package.json +4 -4
  71. package/rollup.config.js +1 -0
  72. package/screenshots/truth/contacts/history.png +0 -0
  73. package/src/RapidElement.ts +0 -1
  74. package/src/RefreshElement.ts +33 -0
  75. package/src/button/Button.ts +4 -0
  76. package/src/contacts/ContactBadges.ts +104 -0
  77. package/src/contacts/ContactChat.ts +7 -16
  78. package/src/contacts/ContactFieldEditor.ts +215 -0
  79. package/src/contacts/ContactFields.ts +178 -0
  80. package/src/contacts/ContactGroups.ts +41 -0
  81. package/src/contacts/ContactName.ts +37 -0
  82. package/src/contacts/ContactStoreElement.ts +51 -0
  83. package/src/contacts/ContactUrn.ts +38 -0
  84. package/src/contacts/events.ts +83 -30
  85. package/src/contactsearch/ContactSearch.ts +1 -1
  86. package/src/interfaces.ts +5 -1
  87. package/src/label/Label.ts +55 -7
  88. package/src/list/TembaMenu.ts +7 -5
  89. package/src/select/Select.ts +4 -4
  90. package/src/store/Store.ts +147 -3
  91. package/src/store/StoreElement.ts +71 -0
  92. package/src/tabpane/Tab.ts +14 -1
  93. package/src/tabpane/TabPane.ts +36 -0
  94. package/src/textinput/TextInput.ts +50 -29
  95. package/src/vectoricon/VectorIcon.ts +33 -15
  96. package/static/css/temba-components.css +3 -0
  97. package/static/icons/Read Me.txt +1 -1
  98. package/static/icons/SVG/bookmark-filled.svg +5 -0
  99. package/static/icons/SVG/bookmark.svg +1 -1
  100. package/static/icons/SVG/calendar1.svg +5 -0
  101. package/static/icons/SVG/corner-down-left.svg +5 -0
  102. package/static/icons/SVG/external-link1.svg +5 -0
  103. package/static/icons/SVG/globe.svg +5 -0
  104. package/static/icons/SVG/language.svg +5 -0
  105. package/static/icons/SVG/more-horizontal.svg +5 -0
  106. package/static/icons/SVG/refresh-cw.svg +5 -0
  107. package/static/icons/SVG/search.svg +5 -0
  108. package/static/icons/demo-external-svg.html +235 -162
  109. package/static/icons/demo-files/demo.css +6 -3
  110. package/static/icons/demo.html +283 -167
  111. package/static/icons/selection.json +569 -339
  112. package/static/icons/style.css +4 -0
  113. package/static/icons/symbol-defs.svg +48 -5
  114. package/static/img/schemes/email.svg +1 -0
  115. package/static/img/schemes/facebook.svg +1 -0
  116. package/static/img/schemes/instagram.svg +1 -0
  117. package/static/img/schemes/line.svg +1 -0
  118. package/static/img/schemes/messenger.svg +1 -0
  119. package/static/img/schemes/tel.svg +34 -0
  120. package/static/img/schemes/telegram.svg +1 -0
  121. package/static/img/schemes/twitter.svg +1 -0
  122. package/static/img/schemes/viber.svg +1 -0
  123. package/static/img/schemes/vk.svg +1 -0
  124. package/static/img/schemes/whatsapp.svg +1 -0
  125. package/temba-modules.ts +13 -0
  126. package/test/temba-contact-history.test.ts +1 -1
  127. package/test-assets/contacts/history.json +5 -4
package/static/icons/demo-external-svg.html CHANGED
@@ -14,563 +14,611 @@
14
14
  </div>
15
15
  </header>
16
16
  <div class="clearfix mhl ptl">
17
- <h1 class="mvm mtn fgc1">Grid Size: 24</h1>
17
+ <h1 class="mvm mtn fgc1">Grid Size: 20</h1>
18
18
  <div class="glyph fs1">
19
+ <div class="clearfix pbs">
20
+ <svg class="icon icon-language"><use xlink:href="symbol-defs.svg#icon-language"></use></svg><span class="name"> icon-language</span>
21
+ </div>
22
+ </div>
23
+ </div>
24
+ <div class="clearfix mhl ptl">
25
+ <h1 class="mvm mtn fgc1">Grid Size: 24</h1>
26
+ <div class="glyph fs2">
27
+ <div class="clearfix pbs">
28
+ <svg class="icon icon-bookmark-filled"><use xlink:href="symbol-defs.svg#icon-bookmark-filled"></use></svg><span class="name"> icon-bookmark-filled</span>
29
+ </div>
30
+ </div>
31
+ <div class="glyph fs2">
32
+ <div class="clearfix pbs">
33
+ <svg class="icon icon-bookmark"><use xlink:href="symbol-defs.svg#icon-bookmark"></use></svg><span class="name"> icon-bookmark</span>
34
+ </div>
35
+ </div>
36
+ <div class="glyph fs2">
37
+ <div class="clearfix pbs">
38
+ <svg class="icon icon-calendar"><use xlink:href="symbol-defs.svg#icon-calendar"></use></svg><span class="name"> icon-calendar</span>
39
+ </div>
40
+ </div>
41
+ <div class="glyph fs2">
42
+ <div class="clearfix pbs">
43
+ <svg class="icon icon-corner-down-left"><use xlink:href="symbol-defs.svg#icon-corner-down-left"></use></svg><span class="name"> icon-corner-down-left</span>
44
+ </div>
45
+ </div>
46
+ <div class="glyph fs2">
47
+ <div class="clearfix pbs">
48
+ <svg class="icon icon-external-link"><use xlink:href="symbol-defs.svg#icon-external-link"></use></svg><span class="name"> icon-external-link</span>
49
+ </div>
50
+ </div>
51
+ <div class="glyph fs2">
52
+ <div class="clearfix pbs">
53
+ <svg class="icon icon-globe"><use xlink:href="symbol-defs.svg#icon-globe"></use></svg><span class="name"> icon-globe</span>
54
+ </div>
55
+ </div>
56
+ <div class="glyph fs2">
57
+ <div class="clearfix pbs">
58
+ <svg class="icon icon-more-horizontal"><use xlink:href="symbol-defs.svg#icon-more-horizontal"></use></svg><span class="name"> icon-more-horizontal</span>
59
+ </div>
60
+ </div>
61
+ <div class="glyph fs2">
62
+ <div class="clearfix pbs">
63
+ <svg class="icon icon-refresh-cw"><use xlink:href="symbol-defs.svg#icon-refresh-cw"></use></svg><span class="name"> icon-refresh-cw</span>
64
+ </div>
65
+ </div>
66
+ <div class="glyph fs2">
67
+ <div class="clearfix pbs">
68
+ <svg class="icon icon-search"><use xlink:href="symbol-defs.svg#icon-search"></use></svg><span class="name"> icon-search</span>
69
+ </div>
70
+ </div>
71
+ <div class="glyph fs2">
19
72
  <div class="clearfix pbs">
20
73
  <svg class="icon icon-pause"><use xlink:href="symbol-defs.svg#icon-pause"></use></svg><span class="name"> icon-pause</span>
21
74
  </div>
22
75
  </div>
23
- <div class="glyph fs1">
76
+ <div class="glyph fs2">
24
77
  <div class="clearfix pbs">
25
78
  <svg class="icon icon-play"><use xlink:href="symbol-defs.svg#icon-play"></use></svg><span class="name"> icon-play</span>
26
79
  </div>
27
80
  </div>
28
- <div class="glyph fs1">
81
+ <div class="glyph fs2">
29
82
  <div class="clearfix pbs">
30
83
  <svg class="icon icon-user-x"><use xlink:href="symbol-defs.svg#icon-user-x"></use></svg><span class="name"> icon-user-x</span>
31
84
  </div>
32
85
  </div>
33
- <div class="glyph fs1">
86
+ <div class="glyph fs2">
34
87
  <div class="clearfix pbs">
35
88
  <svg class="icon icon-cloud"><use xlink:href="symbol-defs.svg#icon-cloud"></use></svg><span class="name"> icon-cloud</span>
36
89
  </div>
37
90
  </div>
38
- <div class="glyph fs1">
91
+ <div class="glyph fs2">
39
92
  <div class="clearfix pbs">
40
93
  <svg class="icon icon-codepen"><use xlink:href="symbol-defs.svg#icon-codepen"></use></svg><span class="name"> icon-codepen</span>
41
94
  </div>
42
95
  </div>
43
- <div class="glyph fs1">
96
+ <div class="glyph fs2">
44
97
  <div class="clearfix pbs">
45
98
  <svg class="icon icon-codesandbox"><use xlink:href="symbol-defs.svg#icon-codesandbox"></use></svg><span class="name"> icon-codesandbox</span>
46
99
  </div>
47
100
  </div>
48
- <div class="glyph fs1">
101
+ <div class="glyph fs2">
49
102
  <div class="clearfix pbs">
50
103
  <svg class="icon icon-git-pull-request"><use xlink:href="symbol-defs.svg#icon-git-pull-request"></use></svg><span class="name"> icon-git-pull-request</span>
51
104
  </div>
52
105
  </div>
53
- <div class="glyph fs1">
106
+ <div class="glyph fs2">
54
107
  <div class="clearfix pbs">
55
108
  <svg class="icon icon-grid"><use xlink:href="symbol-defs.svg#icon-grid"></use></svg><span class="name"> icon-grid</span>
56
109
  </div>
57
110
  </div>
58
- <div class="glyph fs1">
111
+ <div class="glyph fs2">
59
112
  <div class="clearfix pbs">
60
113
  <svg class="icon icon-hard-drive"><use xlink:href="symbol-defs.svg#icon-hard-drive"></use></svg><span class="name"> icon-hard-drive</span>
61
114
  </div>
62
115
  </div>
63
- <div class="glyph fs1">
116
+ <div class="glyph fs2">
64
117
  <div class="clearfix pbs">
65
118
  <svg class="icon icon-layout"><use xlink:href="symbol-defs.svg#icon-layout"></use></svg><span class="name"> icon-layout</span>
66
119
  </div>
67
120
  </div>
68
- <div class="glyph fs1">
121
+ <div class="glyph fs2">
69
122
  <div class="clearfix pbs">
70
123
  <svg class="icon icon-list"><use xlink:href="symbol-defs.svg#icon-list"></use></svg><span class="name"> icon-list</span>
71
124
  </div>
72
125
  </div>
73
- <div class="glyph fs1">
126
+ <div class="glyph fs2">
74
127
  <div class="clearfix pbs">
75
128
  <svg class="icon icon-map-pin"><use xlink:href="symbol-defs.svg#icon-map-pin"></use></svg><span class="name"> icon-map-pin</span>
76
129
  </div>
77
130
  </div>
78
- <div class="glyph fs1">
131
+ <div class="glyph fs2">
79
132
  <div class="clearfix pbs">
80
133
  <svg class="icon icon-package"><use xlink:href="symbol-defs.svg#icon-package"></use></svg><span class="name"> icon-package</span>
81
134
  </div>
82
135
  </div>
83
- <div class="glyph fs1">
136
+ <div class="glyph fs2">
84
137
  <div class="clearfix pbs">
85
138
  <svg class="icon icon-bell"><use xlink:href="symbol-defs.svg#icon-bell"></use></svg><span class="name"> icon-bell</span>
86
139
  </div>
87
140
  </div>
88
- <div class="glyph fs1">
141
+ <div class="glyph fs2">
89
142
  <div class="clearfix pbs">
90
143
  <svg class="icon icon-book-open"><use xlink:href="symbol-defs.svg#icon-book-open"></use></svg><span class="name"> icon-book-open</span>
91
144
  </div>
92
145
  </div>
93
- <div class="glyph fs1">
146
+ <div class="glyph fs2">
94
147
  <div class="clearfix pbs">
95
148
  <svg class="icon icon-box"><use xlink:href="symbol-defs.svg#icon-box"></use></svg><span class="name"> icon-box</span>
96
149
  </div>
97
150
  </div>
98
- <div class="glyph fs1">
151
+ <div class="glyph fs2">
99
152
  <div class="clearfix pbs">
100
153
  <svg class="icon icon-menu"><use xlink:href="symbol-defs.svg#icon-menu"></use></svg><span class="name"> icon-menu</span>
101
154
  </div>
102
155
  </div>
103
- <div class="glyph fs1">
156
+ <div class="glyph fs2">
104
157
  <div class="clearfix pbs">
105
158
  <svg class="icon icon-plus"><use xlink:href="symbol-defs.svg#icon-plus"></use></svg><span class="name"> icon-plus</span>
106
159
  </div>
107
160
  </div>
108
- <div class="glyph fs1">
161
+ <div class="glyph fs2">
109
162
  <div class="clearfix pbs">
110
163
  <svg class="icon icon-agent"><use xlink:href="symbol-defs.svg#icon-agent"></use></svg><span class="name"> icon-agent</span>
111
164
  </div>
112
165
  </div>
113
- <div class="glyph fs1">
166
+ <div class="glyph fs2">
114
167
  <div class="clearfix pbs">
115
168
  <svg class="icon icon-arrow-down-circle"><use xlink:href="symbol-defs.svg#icon-arrow-down-circle"></use></svg><span class="name"> icon-arrow-down-circle</span>
116
169
  </div>
117
170
  </div>
118
- <div class="glyph fs1">
171
+ <div class="glyph fs2">
119
172
  <div class="clearfix pbs">
120
173
  <svg class="icon icon-arrow-up-circle"><use xlink:href="symbol-defs.svg#icon-arrow-up-circle"></use></svg><span class="name"> icon-arrow-up-circle</span>
121
174
  </div>
122
175
  </div>
123
- <div class="glyph fs1">
124
- <div class="clearfix pbs">
125
- <svg class="icon icon-bookmark"><use xlink:href="symbol-defs.svg#icon-bookmark"></use></svg><span class="name"> icon-bookmark</span>
126
- </div>
127
- </div>
128
- <div class="glyph fs1">
176
+ <div class="glyph fs2">
129
177
  <div class="clearfix pbs">
130
178
  <svg class="icon icon-database"><use xlink:href="symbol-defs.svg#icon-database"></use></svg><span class="name"> icon-database</span>
131
179
  </div>
132
180
  </div>
133
- <div class="glyph fs1">
181
+ <div class="glyph fs2">
134
182
  <div class="clearfix pbs">
135
183
  <svg class="icon icon-download"><use xlink:href="symbol-defs.svg#icon-download"></use></svg><span class="name"> icon-download</span>
136
184
  </div>
137
185
  </div>
138
- <div class="glyph fs1">
186
+ <div class="glyph fs2">
139
187
  <div class="clearfix pbs">
140
188
  <svg class="icon icon-help-circle"><use xlink:href="symbol-defs.svg#icon-help-circle"></use></svg><span class="name"> icon-help-circle</span>
141
189
  </div>
142
190
  </div>
143
- <div class="glyph fs1">
191
+ <div class="glyph fs2">
144
192
  <div class="clearfix pbs">
145
193
  <svg class="icon icon-life-buoy"><use xlink:href="symbol-defs.svg#icon-life-buoy"></use></svg><span class="name"> icon-life-buoy</span>
146
194
  </div>
147
195
  </div>
148
- <div class="glyph fs1">
196
+ <div class="glyph fs2">
149
197
  <div class="clearfix pbs">
150
198
  <svg class="icon icon-log-out"><use xlink:href="symbol-defs.svg#icon-log-out"></use></svg><span class="name"> icon-log-out</span>
151
199
  </div>
152
200
  </div>
153
- <div class="glyph fs1">
201
+ <div class="glyph fs2">
154
202
  <div class="clearfix pbs">
155
203
  <svg class="icon icon-more-vertical"><use xlink:href="symbol-defs.svg#icon-more-vertical"></use></svg><span class="name"> icon-more-vertical</span>
156
204
  </div>
157
205
  </div>
158
- <div class="glyph fs1">
206
+ <div class="glyph fs2">
159
207
  <div class="clearfix pbs">
160
208
  <svg class="icon icon-star"><use xlink:href="symbol-defs.svg#icon-star"></use></svg><span class="name"> icon-star</span>
161
209
  </div>
162
210
  </div>
163
- <div class="glyph fs1">
211
+ <div class="glyph fs2">
164
212
  <div class="clearfix pbs">
165
213
  <svg class="icon icon-upload"><use xlink:href="symbol-defs.svg#icon-upload"></use></svg><span class="name"> icon-upload</span>
166
214
  </div>
167
215
  </div>
168
- <div class="glyph fs1">
216
+ <div class="glyph fs2">
169
217
  <div class="clearfix pbs">
170
218
  <svg class="icon icon-publish"><use xlink:href="symbol-defs.svg#icon-publish"></use></svg><span class="name"> icon-publish</span>
171
219
  </div>
172
220
  </div>
173
- <div class="glyph fs1">
221
+ <div class="glyph fs2">
174
222
  <div class="clearfix pbs">
175
223
  <svg class="icon icon-coffee"><use xlink:href="symbol-defs.svg#icon-coffee"></use></svg><span class="name"> icon-coffee</span>
176
224
  </div>
177
225
  </div>
178
- <div class="glyph fs1">
226
+ <div class="glyph fs2">
179
227
  <div class="clearfix pbs">
180
228
  <svg class="icon icon-frown"><use xlink:href="symbol-defs.svg#icon-frown"></use></svg><span class="name"> icon-frown</span>
181
229
  </div>
182
230
  </div>
183
- <div class="glyph fs1">
231
+ <div class="glyph fs2">
184
232
  <div class="clearfix pbs">
185
233
  <svg class="icon icon-mail"><use xlink:href="symbol-defs.svg#icon-mail"></use></svg><span class="name"> icon-mail</span>
186
234
  </div>
187
235
  </div>
188
- <div class="glyph fs1">
236
+ <div class="glyph fs2">
189
237
  <div class="clearfix pbs">
190
238
  <svg class="icon icon-meh"><use xlink:href="symbol-defs.svg#icon-meh"></use></svg><span class="name"> icon-meh</span>
191
239
  </div>
192
240
  </div>
193
- <div class="glyph fs1">
241
+ <div class="glyph fs2">
194
242
  <div class="clearfix pbs">
195
243
  <svg class="icon icon-dollar-sign"><use xlink:href="symbol-defs.svg#icon-dollar-sign"></use></svg><span class="name"> icon-dollar-sign</span>
196
244
  </div>
197
245
  </div>
198
- <div class="glyph fs1">
246
+ <div class="glyph fs2">
199
247
  <div class="clearfix pbs">
200
248
  <svg class="icon icon-log"><use xlink:href="symbol-defs.svg#icon-log"></use></svg><span class="name"> icon-log</span>
201
249
  </div>
202
250
  </div>
203
- <div class="glyph fs1">
251
+ <div class="glyph fs2">
204
252
  <div class="clearfix pbs">
205
253
  <svg class="icon icon-campaign"><use xlink:href="symbol-defs.svg#icon-campaign"></use></svg><span class="name"> icon-campaign</span>
206
254
  </div>
207
255
  </div>
208
- <div class="glyph fs1">
256
+ <div class="glyph fs2">
209
257
  <div class="clearfix pbs">
210
258
  <svg class="icon icon-contact"><use xlink:href="symbol-defs.svg#icon-contact"></use></svg><span class="name"> icon-contact</span>
211
259
  </div>
212
260
  </div>
213
- <div class="glyph fs1">
261
+ <div class="glyph fs2">
214
262
  <div class="clearfix pbs">
215
263
  <svg class="icon icon-flow"><use xlink:href="symbol-defs.svg#icon-flow"></use></svg><span class="name"> icon-flow</span>
216
264
  </div>
217
265
  </div>
218
- <div class="glyph fs1">
266
+ <div class="glyph fs2">
219
267
  <div class="clearfix pbs">
220
268
  <svg class="icon icon-activity"><use xlink:href="symbol-defs.svg#icon-activity"></use></svg><span class="name"> icon-activity</span>
221
269
  </div>
222
270
  </div>
223
- <div class="glyph fs1">
271
+ <div class="glyph fs2">
224
272
  <div class="clearfix pbs">
225
273
  <svg class="icon icon-alert-circle"><use xlink:href="symbol-defs.svg#icon-alert-circle"></use></svg><span class="name"> icon-alert-circle</span>
226
274
  </div>
227
275
  </div>
228
- <div class="glyph fs1">
276
+ <div class="glyph fs2">
229
277
  <div class="clearfix pbs">
230
278
  <svg class="icon icon-alert-octagon"><use xlink:href="symbol-defs.svg#icon-alert-octagon"></use></svg><span class="name"> icon-alert-octagon</span>
231
279
  </div>
232
280
  </div>
233
- <div class="glyph fs1">
281
+ <div class="glyph fs2">
234
282
  <div class="clearfix pbs">
235
283
  <svg class="icon icon-alert-triangle"><use xlink:href="symbol-defs.svg#icon-alert-triangle"></use></svg><span class="name"> icon-alert-triangle</span>
236
284
  </div>
237
285
  </div>
238
- <div class="glyph fs1">
286
+ <div class="glyph fs2">
239
287
  <div class="clearfix pbs">
240
288
  <svg class="icon icon-archive"><use xlink:href="symbol-defs.svg#icon-archive"></use></svg><span class="name"> icon-archive</span>
241
289
  </div>
242
290
  </div>
243
- <div class="glyph fs1">
291
+ <div class="glyph fs2">
244
292
  <div class="clearfix pbs">
245
293
  <svg class="icon icon-battery"><use xlink:href="symbol-defs.svg#icon-battery"></use></svg><span class="name"> icon-battery</span>
246
294
  </div>
247
295
  </div>
248
- <div class="glyph fs1">
296
+ <div class="glyph fs2">
249
297
  <div class="clearfix pbs">
250
298
  <svg class="icon icon-battery-charging"><use xlink:href="symbol-defs.svg#icon-battery-charging"></use></svg><span class="name"> icon-battery-charging</span>
251
299
  </div>
252
300
  </div>
253
- <div class="glyph fs1">
301
+ <div class="glyph fs2">
254
302
  <div class="clearfix pbs">
255
303
  <svg class="icon icon-book"><use xlink:href="symbol-defs.svg#icon-book"></use></svg><span class="name"> icon-book</span>
256
304
  </div>
257
305
  </div>
258
- <div class="glyph fs1">
306
+ <div class="glyph fs2">
259
307
  <div class="clearfix pbs">
260
308
  <svg class="icon icon-briefcase"><use xlink:href="symbol-defs.svg#icon-briefcase"></use></svg><span class="name"> icon-briefcase</span>
261
309
  </div>
262
310
  </div>
263
- <div class="glyph fs1">
311
+ <div class="glyph fs2">
264
312
  <div class="clearfix pbs">
265
- <svg class="icon icon-calendar"><use xlink:href="symbol-defs.svg#icon-calendar"></use></svg><span class="name"> icon-calendar</span>
313
+ <svg class="icon icon-calendar1"><use xlink:href="symbol-defs.svg#icon-calendar1"></use></svg><span class="name"> icon-calendar1</span>
266
314
  </div>
267
315
  </div>
268
- <div class="glyph fs1">
316
+ <div class="glyph fs2">
269
317
  <div class="clearfix pbs">
270
318
  <svg class="icon icon-camera"><use xlink:href="symbol-defs.svg#icon-camera"></use></svg><span class="name"> icon-camera</span>
271
319
  </div>
272
320
  </div>
273
- <div class="glyph fs1">
321
+ <div class="glyph fs2">
274
322
  <div class="clearfix pbs">
275
323
  <svg class="icon icon-check"><use xlink:href="symbol-defs.svg#icon-check"></use></svg><span class="name"> icon-check</span>
276
324
  </div>
277
325
  </div>
278
- <div class="glyph fs1">
326
+ <div class="glyph fs2">
279
327
  <div class="clearfix pbs">
280
328
  <svg class="icon icon-check-square"><use xlink:href="symbol-defs.svg#icon-check-square"></use></svg><span class="name"> icon-check-square</span>
281
329
  </div>
282
330
  </div>
283
- <div class="glyph fs1">
331
+ <div class="glyph fs2">
284
332
  <div class="clearfix pbs">
285
333
  <svg class="icon icon-chevron-down"><use xlink:href="symbol-defs.svg#icon-chevron-down"></use></svg><span class="name"> icon-chevron-down</span>
286
334
  </div>
287
335
  </div>
288
- <div class="glyph fs1">
336
+ <div class="glyph fs2">
289
337
  <div class="clearfix pbs">
290
338
  <svg class="icon icon-chevron-left"><use xlink:href="symbol-defs.svg#icon-chevron-left"></use></svg><span class="name"> icon-chevron-left</span>
291
339
  </div>
292
340
  </div>
293
- <div class="glyph fs1">
341
+ <div class="glyph fs2">
294
342
  <div class="clearfix pbs">
295
343
  <svg class="icon icon-chevron-right"><use xlink:href="symbol-defs.svg#icon-chevron-right"></use></svg><span class="name"> icon-chevron-right</span>
296
344
  </div>
297
345
  </div>
298
- <div class="glyph fs1">
346
+ <div class="glyph fs2">
299
347
  <div class="clearfix pbs">
300
348
  <svg class="icon icon-chevron-up"><use xlink:href="symbol-defs.svg#icon-chevron-up"></use></svg><span class="name"> icon-chevron-up</span>
301
349
  </div>
302
350
  </div>
303
- <div class="glyph fs1">
351
+ <div class="glyph fs2">
304
352
  <div class="clearfix pbs">
305
353
  <svg class="icon icon-chevrons-down"><use xlink:href="symbol-defs.svg#icon-chevrons-down"></use></svg><span class="name"> icon-chevrons-down</span>
306
354
  </div>
307
355
  </div>
308
- <div class="glyph fs1">
356
+ <div class="glyph fs2">
309
357
  <div class="clearfix pbs">
310
358
  <svg class="icon icon-chevrons-left"><use xlink:href="symbol-defs.svg#icon-chevrons-left"></use></svg><span class="name"> icon-chevrons-left</span>
311
359
  </div>
312
360
  </div>
313
- <div class="glyph fs1">
361
+ <div class="glyph fs2">
314
362
  <div class="clearfix pbs">
315
363
  <svg class="icon icon-chevrons-right"><use xlink:href="symbol-defs.svg#icon-chevrons-right"></use></svg><span class="name"> icon-chevrons-right</span>
316
364
  </div>
317
365
  </div>
318
- <div class="glyph fs1">
366
+ <div class="glyph fs2">
319
367
  <div class="clearfix pbs">
320
368
  <svg class="icon icon-chevrons-up"><use xlink:href="symbol-defs.svg#icon-chevrons-up"></use></svg><span class="name"> icon-chevrons-up</span>
321
369
  </div>
322
370
  </div>
323
- <div class="glyph fs1">
371
+ <div class="glyph fs2">
324
372
  <div class="clearfix pbs">
325
373
  <svg class="icon icon-circle"><use xlink:href="symbol-defs.svg#icon-circle"></use></svg><span class="name"> icon-circle</span>
326
374
  </div>
327
375
  </div>
328
- <div class="glyph fs1">
376
+ <div class="glyph fs2">
329
377
  <div class="clearfix pbs">
330
378
  <svg class="icon icon-clipboard"><use xlink:href="symbol-defs.svg#icon-clipboard"></use></svg><span class="name"> icon-clipboard</span>
331
379
  </div>
332
380
  </div>
333
- <div class="glyph fs1">
381
+ <div class="glyph fs2">
334
382
  <div class="clearfix pbs">
335
383
  <svg class="icon icon-clock"><use xlink:href="symbol-defs.svg#icon-clock"></use></svg><span class="name"> icon-clock</span>
336
384
  </div>
337
385
  </div>
338
- <div class="glyph fs1">
386
+ <div class="glyph fs2">
339
387
  <div class="clearfix pbs">
340
388
  <svg class="icon icon-cloud1"><use xlink:href="symbol-defs.svg#icon-cloud1"></use></svg><span class="name"> icon-cloud1</span>
341
389
  </div>
342
390
  </div>
343
- <div class="glyph fs1">
391
+ <div class="glyph fs2">
344
392
  <div class="clearfix pbs">
345
393
  <svg class="icon icon-code"><use xlink:href="symbol-defs.svg#icon-code"></use></svg><span class="name"> icon-code</span>
346
394
  </div>
347
395
  </div>
348
- <div class="glyph fs1">
396
+ <div class="glyph fs2">
349
397
  <div class="clearfix pbs">
350
398
  <svg class="icon icon-copy"><use xlink:href="symbol-defs.svg#icon-copy"></use></svg><span class="name"> icon-copy</span>
351
399
  </div>
352
400
  </div>
353
- <div class="glyph fs1">
401
+ <div class="glyph fs2">
354
402
  <div class="clearfix pbs">
355
403
  <svg class="icon icon-credit-card"><use xlink:href="symbol-defs.svg#icon-credit-card"></use></svg><span class="name"> icon-credit-card</span>
356
404
  </div>
357
405
  </div>
358
- <div class="glyph fs1">
406
+ <div class="glyph fs2">
359
407
  <div class="clearfix pbs">
360
408
  <svg class="icon icon-disc"><use xlink:href="symbol-defs.svg#icon-disc"></use></svg><span class="name"> icon-disc</span>
361
409
  </div>
362
410
  </div>
363
- <div class="glyph fs1">
411
+ <div class="glyph fs2">
364
412
  <div class="clearfix pbs">
365
413
  <svg class="icon icon-edit"><use xlink:href="symbol-defs.svg#icon-edit"></use></svg><span class="name"> icon-edit</span>
366
414
  </div>
367
415
  </div>
368
- <div class="glyph fs1">
416
+ <div class="glyph fs2">
369
417
  <div class="clearfix pbs">
370
418
  <svg class="icon icon-edit-3"><use xlink:href="symbol-defs.svg#icon-edit-3"></use></svg><span class="name"> icon-edit-3</span>
371
419
  </div>
372
420
  </div>
373
- <div class="glyph fs1">
421
+ <div class="glyph fs2">
374
422
  <div class="clearfix pbs">
375
- <svg class="icon icon-external-link"><use xlink:href="symbol-defs.svg#icon-external-link"></use></svg><span class="name"> icon-external-link</span>
423
+ <svg class="icon icon-external-link1"><use xlink:href="symbol-defs.svg#icon-external-link1"></use></svg><span class="name"> icon-external-link1</span>
376
424
  </div>
377
425
  </div>
378
- <div class="glyph fs1">
426
+ <div class="glyph fs2">
379
427
  <div class="clearfix pbs">
380
428
  <svg class="icon icon-flag"><use xlink:href="symbol-defs.svg#icon-flag"></use></svg><span class="name"> icon-flag</span>
381
429
  </div>
382
430
  </div>
383
- <div class="glyph fs1">
431
+ <div class="glyph fs2">
384
432
  <div class="clearfix pbs">
385
433
  <svg class="icon icon-home"><use xlink:href="symbol-defs.svg#icon-home"></use></svg><span class="name"> icon-home</span>
386
434
  </div>
387
435
  </div>
388
- <div class="glyph fs1">
436
+ <div class="glyph fs2">
389
437
  <div class="clearfix pbs">
390
438
  <svg class="icon icon-image"><use xlink:href="symbol-defs.svg#icon-image"></use></svg><span class="name"> icon-image</span>
391
439
  </div>
392
440
  </div>
393
- <div class="glyph fs1">
441
+ <div class="glyph fs2">
394
442
  <div class="clearfix pbs">
395
443
  <svg class="icon icon-inbox"><use xlink:href="symbol-defs.svg#icon-inbox"></use></svg><span class="name"> icon-inbox</span>
396
444
  </div>
397
445
  </div>
398
- <div class="glyph fs1">
446
+ <div class="glyph fs2">
399
447
  <div class="clearfix pbs">
400
448
  <svg class="icon icon-info"><use xlink:href="symbol-defs.svg#icon-info"></use></svg><span class="name"> icon-info</span>
401
449
  </div>
402
450
  </div>
403
- <div class="glyph fs1">
451
+ <div class="glyph fs2">
404
452
  <div class="clearfix pbs">
405
453
  <svg class="icon icon-layers"><use xlink:href="symbol-defs.svg#icon-layers"></use></svg><span class="name"> icon-layers</span>
406
454
  </div>
407
455
  </div>
408
- <div class="glyph fs1">
456
+ <div class="glyph fs2">
409
457
  <div class="clearfix pbs">
410
458
  <svg class="icon icon-loader"><use xlink:href="symbol-defs.svg#icon-loader"></use></svg><span class="name"> icon-loader</span>
411
459
  </div>
412
460
  </div>
413
- <div class="glyph fs1">
461
+ <div class="glyph fs2">
414
462
  <div class="clearfix pbs">
415
463
  <svg class="icon icon-lock"><use xlink:href="symbol-defs.svg#icon-lock"></use></svg><span class="name"> icon-lock</span>
416
464
  </div>
417
465
  </div>
418
- <div class="glyph fs1">
466
+ <div class="glyph fs2">
419
467
  <div class="clearfix pbs">
420
468
  <svg class="icon icon-mail1"><use xlink:href="symbol-defs.svg#icon-mail1"></use></svg><span class="name"> icon-mail1</span>
421
469
  </div>
422
470
  </div>
423
- <div class="glyph fs1">
471
+ <div class="glyph fs2">
424
472
  <div class="clearfix pbs">
425
473
  <svg class="icon icon-message-square"><use xlink:href="symbol-defs.svg#icon-message-square"></use></svg><span class="name"> icon-message-square</span>
426
474
  </div>
427
475
  </div>
428
- <div class="glyph fs1">
476
+ <div class="glyph fs2">
429
477
  <div class="clearfix pbs">
430
478
  <svg class="icon icon-mic"><use xlink:href="symbol-defs.svg#icon-mic"></use></svg><span class="name"> icon-mic</span>
431
479
  </div>
432
480
  </div>
433
- <div class="glyph fs1">
481
+ <div class="glyph fs2">
434
482
  <div class="clearfix pbs">
435
483
  <svg class="icon icon-paperclip"><use xlink:href="symbol-defs.svg#icon-paperclip"></use></svg><span class="name"> icon-paperclip</span>
436
484
  </div>
437
485
  </div>
438
- <div class="glyph fs1">
486
+ <div class="glyph fs2">
439
487
  <div class="clearfix pbs">
440
488
  <svg class="icon icon-phone"><use xlink:href="symbol-defs.svg#icon-phone"></use></svg><span class="name"> icon-phone</span>
441
489
  </div>
442
490
  </div>
443
- <div class="glyph fs1">
491
+ <div class="glyph fs2">
444
492
  <div class="clearfix pbs">
445
493
  <svg class="icon icon-phone-forwarded"><use xlink:href="symbol-defs.svg#icon-phone-forwarded"></use></svg><span class="name"> icon-phone-forwarded</span>
446
494
  </div>
447
495
  </div>
448
- <div class="glyph fs1">
496
+ <div class="glyph fs2">
449
497
  <div class="clearfix pbs">
450
498
  <svg class="icon icon-phone-incoming"><use xlink:href="symbol-defs.svg#icon-phone-incoming"></use></svg><span class="name"> icon-phone-incoming</span>
451
499
  </div>
452
500
  </div>
453
- <div class="glyph fs1">
501
+ <div class="glyph fs2">
454
502
  <div class="clearfix pbs">
455
503
  <svg class="icon icon-phone-missed"><use xlink:href="symbol-defs.svg#icon-phone-missed"></use></svg><span class="name"> icon-phone-missed</span>
456
504
  </div>
457
505
  </div>
458
- <div class="glyph fs1">
506
+ <div class="glyph fs2">
459
507
  <div class="clearfix pbs">
460
508
  <svg class="icon icon-phone-outgoing"><use xlink:href="symbol-defs.svg#icon-phone-outgoing"></use></svg><span class="name"> icon-phone-outgoing</span>
461
509
  </div>
462
510
  </div>
463
- <div class="glyph fs1">
511
+ <div class="glyph fs2">
464
512
  <div class="clearfix pbs">
465
513
  <svg class="icon icon-radio"><use xlink:href="symbol-defs.svg#icon-radio"></use></svg><span class="name"> icon-radio</span>
466
514
  </div>
467
515
  </div>
468
- <div class="glyph fs1">
516
+ <div class="glyph fs2">
469
517
  <div class="clearfix pbs">
470
518
  <svg class="icon icon-repeat"><use xlink:href="symbol-defs.svg#icon-repeat"></use></svg><span class="name"> icon-repeat</span>
471
519
  </div>
472
520
  </div>
473
- <div class="glyph fs1">
521
+ <div class="glyph fs2">
474
522
  <div class="clearfix pbs">
475
523
  <svg class="icon icon-send"><use xlink:href="symbol-defs.svg#icon-send"></use></svg><span class="name"> icon-send</span>
476
524
  </div>
477
525
  </div>
478
- <div class="glyph fs1">
526
+ <div class="glyph fs2">
479
527
  <div class="clearfix pbs">
480
528
  <svg class="icon icon-settings"><use xlink:href="symbol-defs.svg#icon-settings"></use></svg><span class="name"> icon-settings</span>
481
529
  </div>
482
530
  </div>
483
- <div class="glyph fs1">
531
+ <div class="glyph fs2">
484
532
  <div class="clearfix pbs">
485
533
  <svg class="icon icon-shield"><use xlink:href="symbol-defs.svg#icon-shield"></use></svg><span class="name"> icon-shield</span>
486
534
  </div>
487
535
  </div>
488
- <div class="glyph fs1">
536
+ <div class="glyph fs2">
489
537
  <div class="clearfix pbs">
490
538
  <svg class="icon icon-shield-off"><use xlink:href="symbol-defs.svg#icon-shield-off"></use></svg><span class="name"> icon-shield-off</span>
491
539
  </div>
492
540
  </div>
493
- <div class="glyph fs1">
541
+ <div class="glyph fs2">
494
542
  <div class="clearfix pbs">
495
543
  <svg class="icon icon-sidebar"><use xlink:href="symbol-defs.svg#icon-sidebar"></use></svg><span class="name"> icon-sidebar</span>
496
544
  </div>
497
545
  </div>
498
- <div class="glyph fs1">
546
+ <div class="glyph fs2">
499
547
  <div class="clearfix pbs">
500
548
  <svg class="icon icon-slash"><use xlink:href="symbol-defs.svg#icon-slash"></use></svg><span class="name"> icon-slash</span>
501
549
  </div>
502
550
  </div>
503
- <div class="glyph fs1">
551
+ <div class="glyph fs2">
504
552
  <div class="clearfix pbs">
505
553
  <svg class="icon icon-sliders"><use xlink:href="symbol-defs.svg#icon-sliders"></use></svg><span class="name"> icon-sliders</span>
506
554
  </div>
507
555
  </div>
508
- <div class="glyph fs1">
556
+ <div class="glyph fs2">
509
557
  <div class="clearfix pbs">
510
558
  <svg class="icon icon-smartphone"><use xlink:href="symbol-defs.svg#icon-smartphone"></use></svg><span class="name"> icon-smartphone</span>
511
559
  </div>
512
560
  </div>
513
- <div class="glyph fs1">
561
+ <div class="glyph fs2">
514
562
  <div class="clearfix pbs">
515
563
  <svg class="icon icon-square"><use xlink:href="symbol-defs.svg#icon-square"></use></svg><span class="name"> icon-square</span>
516
564
  </div>
517
565
  </div>
518
- <div class="glyph fs1">
566
+ <div class="glyph fs2">
519
567
  <div class="clearfix pbs">
520
568
  <svg class="icon icon-tag"><use xlink:href="symbol-defs.svg#icon-tag"></use></svg><span class="name"> icon-tag</span>
521
569
  </div>
522
570
  </div>
523
- <div class="glyph fs1">
571
+ <div class="glyph fs2">
524
572
  <div class="clearfix pbs">
525
573
  <svg class="icon icon-tool"><use xlink:href="symbol-defs.svg#icon-tool"></use></svg><span class="name"> icon-tool</span>
526
574
  </div>
527
575
  </div>
528
- <div class="glyph fs1">
576
+ <div class="glyph fs2">
529
577
  <div class="clearfix pbs">
530
578
  <svg class="icon icon-trash"><use xlink:href="symbol-defs.svg#icon-trash"></use></svg><span class="name"> icon-trash</span>
531
579
  </div>
532
580
  </div>
533
- <div class="glyph fs1">
581
+ <div class="glyph fs2">
534
582
  <div class="clearfix pbs">
535
583
  <svg class="icon icon-trash-2"><use xlink:href="symbol-defs.svg#icon-trash-2"></use></svg><span class="name"> icon-trash-2</span>
536
584
  </div>
537
585
  </div>
538
- <div class="glyph fs1">
586
+ <div class="glyph fs2">
539
587
  <div class="clearfix pbs">
540
588
  <svg class="icon icon-user"><use xlink:href="symbol-defs.svg#icon-user"></use></svg><span class="name"> icon-user</span>
541
589
  </div>
542
590
  </div>
543
- <div class="glyph fs1">
591
+ <div class="glyph fs2">
544
592
  <div class="clearfix pbs">
545
593
  <svg class="icon icon-users"><use xlink:href="symbol-defs.svg#icon-users"></use></svg><span class="name"> icon-users</span>
546
594
  </div>
547
595
  </div>
548
- <div class="glyph fs1">
596
+ <div class="glyph fs2">
549
597
  <div class="clearfix pbs">
550
598
  <svg class="icon icon-speaker"><use xlink:href="symbol-defs.svg#icon-speaker"></use></svg><span class="name"> icon-speaker</span>
551
599
  </div>
552
600
  </div>
553
- <div class="glyph fs1">
601
+ <div class="glyph fs2">
554
602
  <div class="clearfix pbs">
555
603
  <svg class="icon icon-x"><use xlink:href="symbol-defs.svg#icon-x"></use></svg><span class="name"> icon-x</span>
556
604
  </div>
557
605
  </div>
558
- <div class="glyph fs1">
606
+ <div class="glyph fs2">
559
607
  <div class="clearfix pbs">
560
608
  <svg class="icon icon-x-octagon"><use xlink:href="symbol-defs.svg#icon-x-octagon"></use></svg><span class="name"> icon-x-octagon</span>
561
609
  </div>
562
610
  </div>
563
- <div class="glyph fs1">
611
+ <div class="glyph fs2">
564
612
  <div class="clearfix pbs">
565
613
  <svg class="icon icon-zap"><use xlink:href="symbol-defs.svg#icon-zap"></use></svg><span class="name"> icon-zap</span>
566
614
  </div>
567
615
  </div>
568
- <div class="glyph fs1">
616
+ <div class="glyph fs2">
569
617
  <div class="clearfix pbs">
570
618
  <svg class="icon icon-contact-cal"><use xlink:href="symbol-defs.svg#icon-contact-cal"></use></svg><span class="name"> icon-contact-cal</span>
571
619
  </div>
572
620
  </div>
573
- <div class="glyph fs1">
621
+ <div class="glyph fs2">
574
622
  <div class="clearfix pbs">
575
623
  <svg class="icon icon-send-mobile"><use xlink:href="symbol-defs.svg#icon-send-mobile"></use></svg><span class="name"> icon-send-mobile</span>
576
624
  </div>
@@ -578,40 +626,65 @@
578
626
  </div>
579
627
  <div class="clearfix mhl ptl">
580
628
  <h1 class="mvm mtn fgc1">Grid Size: 0</h1>
581
- <div class="glyph fs2">
629
+ <div class="glyph fs3">
582
630
  <div class="clearfix pbs">
583
631
  <svg class="icon icon-zapier"><use xlink:href="symbol-defs.svg#icon-zapier"></use></svg><span class="name"> icon-zapier</span>
584
632
  </div>
585
633
  </div>
634
+ <div class="glyph fs3">
635
+ <div class="clearfix pbs">
636
+ <svg class="icon icon-users1"><use xlink:href="symbol-defs.svg#icon-users1"></use></svg><span class="name"> icon-users1</span>
637
+ </div>
638
+ </div>
639
+ <div class="glyph fs3">
640
+ <div class="clearfix pbs">
641
+ <svg class="icon icon-lock2"><use xlink:href="symbol-defs.svg#icon-lock2"></use></svg><span class="name"> icon-lock2</span>
642
+ </div>
643
+ </div>
644
+ <div class="glyph fs3">
645
+ <div class="clearfix pbs">
646
+ <svg class="icon icon-atom"><use xlink:href="symbol-defs.svg#icon-atom"></use></svg><span class="name"> icon-atom</span>
647
+ </div>
648
+ </div>
649
+ <div class="glyph fs3">
650
+ <div class="clearfix pbs">
651
+ <svg class="icon icon-paperplane"><use xlink:href="symbol-defs.svg#icon-paperplane"></use></svg><span class="name"> icon-paperplane</span>
652
+ </div>
653
+ </div>
654
+ <div class="glyph fs3">
655
+ <div class="clearfix pbs">
656
+ <svg class="icon icon-cancel"><use xlink:href="symbol-defs.svg#icon-cancel"></use></svg><span class="name"> icon-cancel</span>
657
+ </div>
658
+ </div>
586
659
  </div>
587
660
  <div class="clearfix mhl ptl">
588
661
  <h1 class="mvm mtn fgc1">Grid Size: 16</h1>
589
- <div class="glyph fs3">
662
+ <div class="glyph fs4">
590
663
  <div class="clearfix pbs">
591
664
  <svg class="icon icon-channel"><use xlink:href="symbol-defs.svg#icon-channel"></use></svg><span class="name"> icon-channel</span>
592
665
  </div>
593
666
  </div>
594
- <div class="glyph fs3">
667
+ <div class="glyph fs4">
595
668
  <div class="clearfix pbs">
596
669
  <svg class="icon icon-users1"><use xlink:href="symbol-defs.svg#icon-users1"></use></svg><span class="name"> icon-users1</span>
597
670
  </div>
598
671
  </div>
599
- <div class="glyph fs3">
672
+ <div class="glyph fs4">
600
673
  <div class="clearfix pbs">
601
674
  <svg class="icon icon-lock2"><use xlink:href="symbol-defs.svg#icon-lock2"></use></svg><span class="name"> icon-lock2</span>
602
675
  </div>
603
676
  </div>
604
- <div class="glyph fs3">
677
+ <div class="glyph fs4">
605
678
  <div class="clearfix pbs">
606
679
  <svg class="icon icon-atom"><use xlink:href="symbol-defs.svg#icon-atom"></use></svg><span class="name"> icon-atom</span>
607
680
  </div>
608
681
  </div>
609
- <div class="glyph fs3">
682
+ <div class="glyph fs4">
610
683
  <div class="clearfix pbs">
611
684
  <svg class="icon icon-paperplane"><use xlink:href="symbol-defs.svg#icon-paperplane"></use></svg><span class="name"> icon-paperplane</span>
612
685
  </div>
613
686
  </div>
614
- <div class="glyph fs3">
687
+ <div class="glyph fs4">
615
688
  <div class="clearfix pbs">
616
689
  <svg class="icon icon-cancel"><use xlink:href="symbol-defs.svg#icon-cancel"></use></svg><span class="name"> icon-cancel</span>
617
690
  </div>
@@ -619,187 +692,187 @@
619
692
  </div>
620
693
  <div class="clearfix mhl ptl">
621
694
  <h1 class="mvm mtn fgc1">Grid Size: 32</h1>
622
- <div class="glyph fs4">
695
+ <div class="glyph fs5">
623
696
  <div class="clearfix pbs">
624
697
  <svg class="icon icon-cord"><use xlink:href="symbol-defs.svg#icon-cord"></use></svg><span class="name"> icon-cord</span>
625
698
  </div>
626
699
  </div>
627
- <div class="glyph fs4">
700
+ <div class="glyph fs5">
628
701
  <div class="clearfix pbs">
629
702
  <svg class="icon icon-bothub"><use xlink:href="symbol-defs.svg#icon-bothub"></use></svg><span class="name"> icon-bothub</span>
630
703
  </div>
631
704
  </div>
632
- <div class="glyph fs4">
705
+ <div class="glyph fs5">
633
706
  <div class="clearfix pbs">
634
707
  <svg class="icon icon-channel-android"><use xlink:href="symbol-defs.svg#icon-channel-android"></use></svg><span class="name"> icon-channel-android</span>
635
708
  </div>
636
709
  </div>
637
- <div class="glyph fs4">
710
+ <div class="glyph fs5">
638
711
  <div class="clearfix pbs">
639
712
  <svg class="icon icon-channel-kannel"><use xlink:href="symbol-defs.svg#icon-channel-kannel"></use></svg><span class="name"> icon-channel-kannel</span>
640
713
  </div>
641
714
  </div>
642
- <div class="glyph fs4">
715
+ <div class="glyph fs5">
643
716
  <div class="clearfix pbs">
644
717
  <svg class="icon icon-channel-plivo"><use xlink:href="symbol-defs.svg#icon-channel-plivo"></use></svg><span class="name"> icon-channel-plivo</span>
645
718
  </div>
646
719
  </div>
647
- <div class="glyph fs4">
720
+ <div class="glyph fs5">
648
721
  <div class="clearfix pbs">
649
722
  <svg class="icon icon-channel-twilio"><use xlink:href="symbol-defs.svg#icon-channel-twilio"></use></svg><span class="name"> icon-channel-twilio</span>
650
723
  </div>
651
724
  </div>
652
- <div class="glyph fs4">
725
+ <div class="glyph fs5">
653
726
  <div class="clearfix pbs">
654
727
  <svg class="icon icon-chatbase"><use xlink:href="symbol-defs.svg#icon-chatbase"></use></svg><span class="name"> icon-chatbase</span>
655
728
  </div>
656
729
  </div>
657
- <div class="glyph fs4">
730
+ <div class="glyph fs5">
658
731
  <div class="clearfix pbs">
659
732
  <svg class="icon icon-clickatell"><use xlink:href="symbol-defs.svg#icon-clickatell"></use></svg><span class="name"> icon-clickatell</span>
660
733
  </div>
661
734
  </div>
662
- <div class="glyph fs4">
735
+ <div class="glyph fs5">
663
736
  <div class="clearfix pbs">
664
737
  <svg class="icon icon-clickatell-inverted"><use xlink:href="symbol-defs.svg#icon-clickatell-inverted"></use></svg><span class="name"> icon-clickatell-inverted</span>
665
738
  </div>
666
739
  </div>
667
- <div class="glyph fs4">
740
+ <div class="glyph fs5">
668
741
  <div class="clearfix pbs">
669
742
  <svg class="icon icon-dtone"><use xlink:href="symbol-defs.svg#icon-dtone"></use></svg><span class="name"> icon-dtone</span>
670
743
  </div>
671
744
  </div>
672
- <div class="glyph fs4">
745
+ <div class="glyph fs5">
673
746
  <div class="clearfix pbs">
674
747
  <svg class="icon icon-facebook-official"><use xlink:href="symbol-defs.svg#icon-facebook-official"></use></svg><span class="name"> icon-facebook-official</span>
675
748
  </div>
676
749
  </div>
677
- <div class="glyph fs4">
750
+ <div class="glyph fs5">
678
751
  <div class="clearfix pbs">
679
752
  <svg class="icon icon-freshchat"><use xlink:href="symbol-defs.svg#icon-freshchat"></use></svg><span class="name"> icon-freshchat</span>
680
753
  </div>
681
754
  </div>
682
- <div class="glyph fs4">
755
+ <div class="glyph fs5">
683
756
  <div class="clearfix pbs">
684
757
  <svg class="icon icon-github"><use xlink:href="symbol-defs.svg#icon-github"></use></svg><span class="name"> icon-github</span>
685
758
  </div>
686
759
  </div>
687
- <div class="glyph fs4">
760
+ <div class="glyph fs5">
688
761
  <div class="clearfix pbs">
689
762
  <svg class="icon icon-google-plus"><use xlink:href="symbol-defs.svg#icon-google-plus"></use></svg><span class="name"> icon-google-plus</span>
690
763
  </div>
691
764
  </div>
692
- <div class="glyph fs4">
765
+ <div class="glyph fs5">
693
766
  <div class="clearfix pbs">
694
767
  <svg class="icon icon-jiochat"><use xlink:href="symbol-defs.svg#icon-jiochat"></use></svg><span class="name"> icon-jiochat</span>
695
768
  </div>
696
769
  </div>
697
- <div class="glyph fs4">
770
+ <div class="glyph fs5">
698
771
  <div class="clearfix pbs">
699
772
  <svg class="icon icon-junebug"><use xlink:href="symbol-defs.svg#icon-junebug"></use></svg><span class="name"> icon-junebug</span>
700
773
  </div>
701
774
  </div>
702
- <div class="glyph fs4">
775
+ <div class="glyph fs5">
703
776
  <div class="clearfix pbs">
704
777
  <svg class="icon icon-line"><use xlink:href="symbol-defs.svg#icon-line"></use></svg><span class="name"> icon-line</span>
705
778
  </div>
706
779
  </div>
707
- <div class="glyph fs4">
780
+ <div class="glyph fs5">
708
781
  <div class="clearfix pbs">
709
782
  <svg class="icon icon-luis"><use xlink:href="symbol-defs.svg#icon-luis"></use></svg><span class="name"> icon-luis</span>
710
783
  </div>
711
784
  </div>
712
- <div class="glyph fs4">
785
+ <div class="glyph fs5">
713
786
  <div class="clearfix pbs">
714
787
  <svg class="icon icon-mtarget"><use xlink:href="symbol-defs.svg#icon-mtarget"></use></svg><span class="name"> icon-mtarget</span>
715
788
  </div>
716
789
  </div>
717
- <div class="glyph fs4">
790
+ <div class="glyph fs5">
718
791
  <div class="clearfix pbs">
719
792
  <svg class="icon icon-plivo"><use xlink:href="symbol-defs.svg#icon-plivo"></use></svg><span class="name"> icon-plivo</span>
720
793
  </div>
721
794
  </div>
722
- <div class="glyph fs4">
795
+ <div class="glyph fs5">
723
796
  <div class="clearfix pbs">
724
797
  <svg class="icon icon-plivo-inverted"><use xlink:href="symbol-defs.svg#icon-plivo-inverted"></use></svg><span class="name"> icon-plivo-inverted</span>
725
798
  </div>
726
799
  </div>
727
- <div class="glyph fs4">
800
+ <div class="glyph fs5">
728
801
  <div class="clearfix pbs">
729
802
  <svg class="icon icon-prometheus"><use xlink:href="symbol-defs.svg#icon-prometheus"></use></svg><span class="name"> icon-prometheus</span>
730
803
  </div>
731
804
  </div>
732
- <div class="glyph fs4">
805
+ <div class="glyph fs5">
733
806
  <div class="clearfix pbs">
734
807
  <svg class="icon icon-rocketchat"><use xlink:href="symbol-defs.svg#icon-rocketchat"></use></svg><span class="name"> icon-rocketchat</span>
735
808
  </div>
736
809
  </div>
737
- <div class="glyph fs4">
810
+ <div class="glyph fs5">
738
811
  <div class="clearfix pbs">
739
812
  <svg class="icon icon-signalwire"><use xlink:href="symbol-defs.svg#icon-signalwire"></use></svg><span class="name"> icon-signalwire</span>
740
813
  </div>
741
814
  </div>
742
- <div class="glyph fs4">
815
+ <div class="glyph fs5">
743
816
  <div class="clearfix pbs">
744
817
  <svg class="icon icon-telegram"><use xlink:href="symbol-defs.svg#icon-telegram"></use></svg><span class="name"> icon-telegram</span>
745
818
  </div>
746
819
  </div>
747
- <div class="glyph fs4">
820
+ <div class="glyph fs5">
748
821
  <div class="clearfix pbs">
749
822
  <svg class="icon icon-thinq"><use xlink:href="symbol-defs.svg#icon-thinq"></use></svg><span class="name"> icon-thinq</span>
750
823
  </div>
751
824
  </div>
752
- <div class="glyph fs4">
825
+ <div class="glyph fs5">
753
826
  <div class="clearfix pbs">
754
827
  <svg class="icon icon-twilio_inverted"><use xlink:href="symbol-defs.svg#icon-twilio_inverted"></use></svg><span class="name"> icon-twilio_inverted</span>
755
828
  </div>
756
829
  </div>
757
- <div class="glyph fs4">
830
+ <div class="glyph fs5">
758
831
  <div class="clearfix pbs">
759
832
  <svg class="icon icon-twilio_original"><use xlink:href="symbol-defs.svg#icon-twilio_original"></use></svg><span class="name"> icon-twilio_original</span>
760
833
  </div>
761
834
  </div>
762
- <div class="glyph fs4">
835
+ <div class="glyph fs5">
763
836
  <div class="clearfix pbs">
764
837
  <svg class="icon icon-twitter"><use xlink:href="symbol-defs.svg#icon-twitter"></use></svg><span class="name"> icon-twitter</span>
765
838
  </div>
766
839
  </div>
767
- <div class="glyph fs4">
840
+ <div class="glyph fs5">
768
841
  <div class="clearfix pbs">
769
842
  <svg class="icon icon-viber"><use xlink:href="symbol-defs.svg#icon-viber"></use></svg><span class="name"> icon-viber</span>
770
843
  </div>
771
844
  </div>
772
- <div class="glyph fs4">
845
+ <div class="glyph fs5">
773
846
  <div class="clearfix pbs">
774
847
  <svg class="icon icon-vk"><use xlink:href="symbol-defs.svg#icon-vk"></use></svg><span class="name"> icon-vk</span>
775
848
  </div>
776
849
  </div>
777
- <div class="glyph fs4">
850
+ <div class="glyph fs5">
778
851
  <div class="clearfix pbs">
779
852
  <svg class="icon icon-wechat"><use xlink:href="symbol-defs.svg#icon-wechat"></use></svg><span class="name"> icon-wechat</span>
780
853
  </div>
781
854
  </div>
782
- <div class="glyph fs4">
855
+ <div class="glyph fs5">
783
856
  <div class="clearfix pbs">
784
857
  <svg class="icon icon-whatsapp"><use xlink:href="symbol-defs.svg#icon-whatsapp"></use></svg><span class="name"> icon-whatsapp</span>
785
858
  </div>
786
859
  </div>
787
- <div class="glyph fs4">
860
+ <div class="glyph fs5">
788
861
  <div class="clearfix pbs">
789
862
  <svg class="icon icon-wit"><use xlink:href="symbol-defs.svg#icon-wit"></use></svg><span class="name"> icon-wit</span>
790
863
  </div>
791
864
  </div>
792
- <div class="glyph fs4">
865
+ <div class="glyph fs5">
793
866
  <div class="clearfix pbs">
794
867
  <svg class="icon icon-zendesk"><use xlink:href="symbol-defs.svg#icon-zendesk"></use></svg><span class="name"> icon-zendesk</span>
795
868
  </div>
796
869
  </div>
797
- <div class="glyph fs4">
870
+ <div class="glyph fs5">
798
871
  <div class="clearfix pbs">
799
872
  <svg class="icon icon-vonage"><use xlink:href="symbol-defs.svg#icon-vonage"></use></svg><span class="name"> icon-vonage</span>
800
873
  </div>
801
874
  </div>
802
- <div class="glyph fs4">
875
+ <div class="glyph fs5">
803
876
  <div class="clearfix pbs">
804
877
  <svg class="icon icon-megaphone"><use xlink:href="symbol-defs.svg#icon-megaphone"></use></svg><span class="name"> icon-megaphone</span>
805
878
  </div>