@nyaruka/temba-components 0.25.2 → 0.26.2

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 (186) hide show
  1. package/.github/workflows/build.yml +1 -1
  2. package/CHANGELOG.md +33 -0
  3. package/demo/index.html +60 -1
  4. package/dist/4f80c187.js +4277 -0
  5. package/dist/index.js +3957 -36
  6. package/dist/static/icons/symbol-defs.svg +29 -20
  7. package/dist/sw.js +1 -1
  8. package/dist/sw.js.map +1 -1
  9. package/dist/templates/components-body.html +1 -1
  10. package/dist/templates/components-head.html +1 -1
  11. package/out-tsc/src/FormElement.js +1 -1
  12. package/out-tsc/src/FormElement.js.map +1 -1
  13. package/out-tsc/src/RapidElement.js +1 -1
  14. package/out-tsc/src/RapidElement.js.map +1 -1
  15. package/out-tsc/src/alert/Alert.js +3 -3
  16. package/out-tsc/src/alert/Alert.js.map +1 -1
  17. package/out-tsc/src/aliaseditor/AliasEditor.js +3 -3
  18. package/out-tsc/src/aliaseditor/AliasEditor.js.map +1 -1
  19. package/out-tsc/src/anchor/Anchor.js +2 -1
  20. package/out-tsc/src/anchor/Anchor.js.map +1 -1
  21. package/out-tsc/src/button/Button.js +2 -1
  22. package/out-tsc/src/button/Button.js.map +1 -1
  23. package/out-tsc/src/charcount/CharCount.js +2 -1
  24. package/out-tsc/src/charcount/CharCount.js.map +1 -1
  25. package/out-tsc/src/checkbox/Checkbox.js +3 -1
  26. package/out-tsc/src/checkbox/Checkbox.js.map +1 -1
  27. package/out-tsc/src/completion/Completion.js +2 -1
  28. package/out-tsc/src/completion/Completion.js.map +1 -1
  29. package/out-tsc/src/completion/helpers.js +27 -4
  30. package/out-tsc/src/completion/helpers.js.map +1 -1
  31. package/out-tsc/src/contacts/ContactChat.js +101 -86
  32. package/out-tsc/src/contacts/ContactChat.js.map +1 -1
  33. package/out-tsc/src/contacts/ContactDetails.js +2 -1
  34. package/out-tsc/src/contacts/ContactDetails.js.map +1 -1
  35. package/out-tsc/src/contacts/ContactHistory.js +32 -37
  36. package/out-tsc/src/contacts/ContactHistory.js.map +1 -1
  37. package/out-tsc/src/contacts/events.js +62 -76
  38. package/out-tsc/src/contacts/events.js.map +1 -1
  39. package/out-tsc/src/contactsearch/ContactSearch.js +2 -1
  40. package/out-tsc/src/contactsearch/ContactSearch.js.map +1 -1
  41. package/out-tsc/src/datepicker/DatePicker.js +2 -1
  42. package/out-tsc/src/datepicker/DatePicker.js.map +1 -1
  43. package/out-tsc/src/dialog/Dialog.js +2 -2
  44. package/out-tsc/src/dialog/Dialog.js.map +1 -1
  45. package/out-tsc/src/dialog/Modax.js +3 -6
  46. package/out-tsc/src/dialog/Modax.js.map +1 -1
  47. package/out-tsc/src/dropdown/Dropdown.js +133 -0
  48. package/out-tsc/src/dropdown/Dropdown.js.map +1 -0
  49. package/out-tsc/src/formfield/FormField.js +2 -1
  50. package/out-tsc/src/formfield/FormField.js.map +1 -1
  51. package/out-tsc/src/label/Label.js +2 -1
  52. package/out-tsc/src/label/Label.js.map +1 -1
  53. package/out-tsc/src/leafletmap/LeafletMap.js +2 -1
  54. package/out-tsc/src/leafletmap/LeafletMap.js.map +1 -1
  55. package/out-tsc/src/list/TembaList.js +7 -5
  56. package/out-tsc/src/list/TembaList.js.map +1 -1
  57. package/out-tsc/src/list/TembaMenu.js +112 -97
  58. package/out-tsc/src/list/TembaMenu.js.map +1 -1
  59. package/out-tsc/src/list/TicketList.js +2 -1
  60. package/out-tsc/src/list/TicketList.js.map +1 -1
  61. package/out-tsc/src/loading/Loading.js +2 -1
  62. package/out-tsc/src/loading/Loading.js.map +1 -1
  63. package/out-tsc/src/omnibox/Omnibox.js +2 -1
  64. package/out-tsc/src/omnibox/Omnibox.js.map +1 -1
  65. package/out-tsc/src/options/Options.js +3 -2
  66. package/out-tsc/src/options/Options.js.map +1 -1
  67. package/out-tsc/src/remote/Remote.js +2 -1
  68. package/out-tsc/src/remote/Remote.js.map +1 -1
  69. package/out-tsc/src/select/Select.js +8 -10
  70. package/out-tsc/src/select/Select.js.map +1 -1
  71. package/out-tsc/src/shadowless/Shadowless.js +2 -2
  72. package/out-tsc/src/shadowless/Shadowless.js.map +1 -1
  73. package/out-tsc/src/store/Store.js +2 -1
  74. package/out-tsc/src/store/Store.js.map +1 -1
  75. package/out-tsc/src/tabpane/Tab.js +46 -0
  76. package/out-tsc/src/tabpane/Tab.js.map +1 -0
  77. package/out-tsc/src/tabpane/TabPane.js +109 -0
  78. package/out-tsc/src/tabpane/TabPane.js.map +1 -0
  79. package/out-tsc/src/textinput/TextInput.js +3 -2
  80. package/out-tsc/src/textinput/TextInput.js.map +1 -1
  81. package/out-tsc/src/tip/Tip.js +2 -2
  82. package/out-tsc/src/tip/Tip.js.map +1 -1
  83. package/out-tsc/src/vectoricon/VectorIcon.js +18 -6
  84. package/out-tsc/src/vectoricon/VectorIcon.js.map +1 -1
  85. package/out-tsc/temba-modules.js +6 -0
  86. package/out-tsc/temba-modules.js.map +1 -1
  87. package/out-tsc/test/temba-contact-history.test.js +9 -6
  88. package/out-tsc/test/temba-contact-history.test.js.map +1 -1
  89. package/out-tsc/test/temba-dialog.test.js +3 -3
  90. package/out-tsc/test/temba-dialog.test.js.map +1 -1
  91. package/package.json +10 -9
  92. package/screenshots/truth/alert/error.png +0 -0
  93. package/screenshots/truth/alert/info.png +0 -0
  94. package/screenshots/truth/alert/warning.png +0 -0
  95. package/screenshots/truth/contacts/history-expanded.png +0 -0
  96. package/screenshots/truth/contacts/history.png +0 -0
  97. package/screenshots/truth/counter/summary.png +0 -0
  98. package/screenshots/truth/counter/unicode-variables.png +0 -0
  99. package/screenshots/truth/counter/unicode.png +0 -0
  100. package/screenshots/truth/dialog/focused.png +0 -0
  101. package/screenshots/truth/list/items-selected.png +0 -0
  102. package/screenshots/truth/list/items-updated.png +0 -0
  103. package/screenshots/truth/list/items.png +0 -0
  104. package/screenshots/truth/list/menu-root.png +0 -0
  105. package/screenshots/truth/list/menu-submenu.png +0 -0
  106. package/screenshots/truth/modax/form.png +0 -0
  107. package/screenshots/truth/modax/simple.png +0 -0
  108. package/screenshots/truth/options/block.png +0 -0
  109. package/screenshots/truth/select/embedded.png +0 -0
  110. package/screenshots/truth/select/expression-selected.png +0 -0
  111. package/screenshots/truth/select/expressions.png +0 -0
  112. package/screenshots/truth/select/functions.png +0 -0
  113. package/screenshots/truth/select/local-options.png +0 -0
  114. package/screenshots/truth/select/remote-options.png +0 -0
  115. package/screenshots/truth/select/search-enabled.png +0 -0
  116. package/screenshots/truth/select/search-selected-focus.png +0 -0
  117. package/screenshots/truth/select/search-selected.png +0 -0
  118. package/screenshots/truth/select/search-with-selected.png +0 -0
  119. package/screenshots/truth/select/searching.png +0 -0
  120. package/screenshots/truth/select/selected-multi.png +0 -0
  121. package/screenshots/truth/select/selected-single.png +0 -0
  122. package/screenshots/truth/select/selection-clearable.png +0 -0
  123. package/screenshots/truth/select/with-placeholder.png +0 -0
  124. package/screenshots/truth/select/without-placeholder.png +0 -0
  125. package/screenshots/truth/textinput/date-initialized.png +0 -0
  126. package/screenshots/truth/textinput/input-focused.png +0 -0
  127. package/screenshots/truth/textinput/textarea-focused.png +0 -0
  128. package/screenshots/truth/tip/bottom.png +0 -0
  129. package/screenshots/truth/tip/left.png +0 -0
  130. package/screenshots/truth/tip/right.png +0 -0
  131. package/screenshots/truth/tip/top.png +0 -0
  132. package/src/FormElement.ts +1 -1
  133. package/src/RapidElement.ts +1 -1
  134. package/src/alert/Alert.ts +3 -3
  135. package/src/aliaseditor/AliasEditor.ts +4 -3
  136. package/src/anchor/Anchor.ts +2 -1
  137. package/src/button/Button.ts +3 -1
  138. package/src/charcount/CharCount.ts +2 -1
  139. package/src/checkbox/Checkbox.ts +3 -1
  140. package/src/completion/Completion.ts +2 -1
  141. package/src/completion/helpers.ts +30 -4
  142. package/src/contacts/ContactChat.ts +115 -95
  143. package/src/contacts/ContactDetails.ts +2 -1
  144. package/src/contacts/ContactHistory.ts +64 -67
  145. package/src/contacts/events.ts +62 -77
  146. package/src/contactsearch/ContactSearch.ts +2 -1
  147. package/src/datepicker/DatePicker.ts +2 -7
  148. package/src/dialog/Dialog.ts +2 -2
  149. package/src/dialog/Modax.ts +4 -6
  150. package/src/dropdown/Dropdown.ts +136 -0
  151. package/src/formfield/FormField.ts +2 -1
  152. package/src/label/Label.ts +2 -8
  153. package/src/leafletmap/LeafletMap.ts +2 -2
  154. package/src/list/TembaList.ts +8 -5
  155. package/src/list/TembaMenu.ts +125 -103
  156. package/src/list/TicketList.ts +2 -1
  157. package/src/loading/Loading.ts +2 -1
  158. package/src/omnibox/Omnibox.ts +2 -1
  159. package/src/options/Options.ts +3 -2
  160. package/src/remote/Remote.ts +2 -7
  161. package/src/select/Select.ts +11 -10
  162. package/src/shadowless/Shadowless.ts +2 -2
  163. package/src/store/Store.ts +2 -1
  164. package/src/tabpane/Tab.ts +42 -0
  165. package/src/tabpane/TabPane.ts +113 -0
  166. package/src/textinput/TextInput.ts +3 -2
  167. package/src/tip/Tip.ts +2 -2
  168. package/src/vectoricon/VectorIcon.ts +18 -6
  169. package/static/css/temba-components.css +11 -0
  170. package/static/icons/Read Me.txt +1 -1
  171. package/static/icons/SVG/pause.svg +5 -0
  172. package/static/icons/SVG/play.svg +5 -0
  173. package/static/icons/SVG/{upload-cloud.svg → publish.svg} +1 -1
  174. package/static/icons/SVG/user-x.svg +5 -0
  175. package/static/icons/demo-external-svg.html +157 -142
  176. package/static/icons/demo-files/demo.css +3 -3
  177. package/static/icons/demo.html +186 -162
  178. package/static/icons/selection.json +390 -318
  179. package/static/icons/symbol-defs.svg +29 -20
  180. package/temba-modules.ts +6 -0
  181. package/test/temba-contact-history.test.ts +10 -6
  182. package/test/temba-dialog.test.ts +5 -6
  183. package/test-assets/modax/form.html +1 -1
  184. package/test-assets/style.css +7 -0
  185. package/web-test-runner.config.mjs +130 -117
  186. package/dist/56e0e480.js +0 -356
package/static/icons/demo-external-svg.html CHANGED
@@ -14,593 +14,608 @@
14
14
  </div>
15
15
  </header>
16
16
  <div class="clearfix mhl ptl">
17
- <h1 class="mvm mtn fgc1">Grid Size: 0</h1>
17
+ <h1 class="mvm mtn fgc1">Grid Size: 24</h1>
18
18
  <div class="glyph fs1">
19
19
  <div class="clearfix pbs">
20
- <svg class="icon icon-zapier"><use xlink:href="symbol-defs.svg#icon-zapier"></use></svg><span class="name"> icon-zapier</span>
20
+ <svg class="icon icon-pause"><use xlink:href="symbol-defs.svg#icon-pause"></use></svg><span class="name"> icon-pause</span>
21
21
  </div>
22
22
  </div>
23
- </div>
24
- <div class="clearfix mhl ptl">
25
- <h1 class="mvm mtn fgc1">Grid Size: 16</h1>
26
- <div class="glyph fs2">
27
- <div class="clearfix pbs">
28
- <svg class="icon icon-channel"><use xlink:href="symbol-defs.svg#icon-channel"></use></svg><span class="name"> icon-channel</span>
29
- </div>
30
- </div>
31
- <div class="glyph fs2">
32
- <div class="clearfix pbs">
33
- <svg class="icon icon-users1"><use xlink:href="symbol-defs.svg#icon-users1"></use></svg><span class="name"> icon-users1</span>
34
- </div>
35
- </div>
36
- <div class="glyph fs2">
37
- <div class="clearfix pbs">
38
- <svg class="icon icon-lock2"><use xlink:href="symbol-defs.svg#icon-lock2"></use></svg><span class="name"> icon-lock2</span>
39
- </div>
40
- </div>
41
- <div class="glyph fs2">
42
- <div class="clearfix pbs">
43
- <svg class="icon icon-atom"><use xlink:href="symbol-defs.svg#icon-atom"></use></svg><span class="name"> icon-atom</span>
44
- </div>
45
- </div>
46
- <div class="glyph fs2">
23
+ <div class="glyph fs1">
47
24
  <div class="clearfix pbs">
48
- <svg class="icon icon-paperplane"><use xlink:href="symbol-defs.svg#icon-paperplane"></use></svg><span class="name"> icon-paperplane</span>
25
+ <svg class="icon icon-play"><use xlink:href="symbol-defs.svg#icon-play"></use></svg><span class="name"> icon-play</span>
49
26
  </div>
50
27
  </div>
51
- <div class="glyph fs2">
28
+ <div class="glyph fs1">
52
29
  <div class="clearfix pbs">
53
- <svg class="icon icon-cancel"><use xlink:href="symbol-defs.svg#icon-cancel"></use></svg><span class="name"> icon-cancel</span>
30
+ <svg class="icon icon-user-x"><use xlink:href="symbol-defs.svg#icon-user-x"></use></svg><span class="name"> icon-user-x</span>
54
31
  </div>
55
32
  </div>
56
- </div>
57
- <div class="clearfix mhl ptl">
58
- <h1 class="mvm mtn fgc1">Grid Size: 24</h1>
59
- <div class="glyph fs3">
33
+ <div class="glyph fs1">
60
34
  <div class="clearfix pbs">
61
35
  <svg class="icon icon-cloud"><use xlink:href="symbol-defs.svg#icon-cloud"></use></svg><span class="name"> icon-cloud</span>
62
36
  </div>
63
37
  </div>
64
- <div class="glyph fs3">
38
+ <div class="glyph fs1">
65
39
  <div class="clearfix pbs">
66
40
  <svg class="icon icon-codepen"><use xlink:href="symbol-defs.svg#icon-codepen"></use></svg><span class="name"> icon-codepen</span>
67
41
  </div>
68
42
  </div>
69
- <div class="glyph fs3">
43
+ <div class="glyph fs1">
70
44
  <div class="clearfix pbs">
71
45
  <svg class="icon icon-codesandbox"><use xlink:href="symbol-defs.svg#icon-codesandbox"></use></svg><span class="name"> icon-codesandbox</span>
72
46
  </div>
73
47
  </div>
74
- <div class="glyph fs3">
48
+ <div class="glyph fs1">
75
49
  <div class="clearfix pbs">
76
50
  <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>
77
51
  </div>
78
52
  </div>
79
- <div class="glyph fs3">
53
+ <div class="glyph fs1">
80
54
  <div class="clearfix pbs">
81
55
  <svg class="icon icon-grid"><use xlink:href="symbol-defs.svg#icon-grid"></use></svg><span class="name"> icon-grid</span>
82
56
  </div>
83
57
  </div>
84
- <div class="glyph fs3">
58
+ <div class="glyph fs1">
85
59
  <div class="clearfix pbs">
86
60
  <svg class="icon icon-hard-drive"><use xlink:href="symbol-defs.svg#icon-hard-drive"></use></svg><span class="name"> icon-hard-drive</span>
87
61
  </div>
88
62
  </div>
89
- <div class="glyph fs3">
63
+ <div class="glyph fs1">
90
64
  <div class="clearfix pbs">
91
65
  <svg class="icon icon-layout"><use xlink:href="symbol-defs.svg#icon-layout"></use></svg><span class="name"> icon-layout</span>
92
66
  </div>
93
67
  </div>
94
- <div class="glyph fs3">
68
+ <div class="glyph fs1">
95
69
  <div class="clearfix pbs">
96
70
  <svg class="icon icon-list"><use xlink:href="symbol-defs.svg#icon-list"></use></svg><span class="name"> icon-list</span>
97
71
  </div>
98
72
  </div>
99
- <div class="glyph fs3">
73
+ <div class="glyph fs1">
100
74
  <div class="clearfix pbs">
101
75
  <svg class="icon icon-map-pin"><use xlink:href="symbol-defs.svg#icon-map-pin"></use></svg><span class="name"> icon-map-pin</span>
102
76
  </div>
103
77
  </div>
104
- <div class="glyph fs3">
78
+ <div class="glyph fs1">
105
79
  <div class="clearfix pbs">
106
80
  <svg class="icon icon-package"><use xlink:href="symbol-defs.svg#icon-package"></use></svg><span class="name"> icon-package</span>
107
81
  </div>
108
82
  </div>
109
- <div class="glyph fs3">
83
+ <div class="glyph fs1">
110
84
  <div class="clearfix pbs">
111
85
  <svg class="icon icon-bell"><use xlink:href="symbol-defs.svg#icon-bell"></use></svg><span class="name"> icon-bell</span>
112
86
  </div>
113
87
  </div>
114
- <div class="glyph fs3">
88
+ <div class="glyph fs1">
115
89
  <div class="clearfix pbs">
116
90
  <svg class="icon icon-book-open"><use xlink:href="symbol-defs.svg#icon-book-open"></use></svg><span class="name"> icon-book-open</span>
117
91
  </div>
118
92
  </div>
119
- <div class="glyph fs3">
93
+ <div class="glyph fs1">
120
94
  <div class="clearfix pbs">
121
95
  <svg class="icon icon-box"><use xlink:href="symbol-defs.svg#icon-box"></use></svg><span class="name"> icon-box</span>
122
96
  </div>
123
97
  </div>
124
- <div class="glyph fs3">
98
+ <div class="glyph fs1">
125
99
  <div class="clearfix pbs">
126
100
  <svg class="icon icon-menu"><use xlink:href="symbol-defs.svg#icon-menu"></use></svg><span class="name"> icon-menu</span>
127
101
  </div>
128
102
  </div>
129
- <div class="glyph fs3">
103
+ <div class="glyph fs1">
130
104
  <div class="clearfix pbs">
131
105
  <svg class="icon icon-plus"><use xlink:href="symbol-defs.svg#icon-plus"></use></svg><span class="name"> icon-plus</span>
132
106
  </div>
133
107
  </div>
134
- <div class="glyph fs3">
108
+ <div class="glyph fs1">
135
109
  <div class="clearfix pbs">
136
110
  <svg class="icon icon-agent"><use xlink:href="symbol-defs.svg#icon-agent"></use></svg><span class="name"> icon-agent</span>
137
111
  </div>
138
112
  </div>
139
- <div class="glyph fs3">
113
+ <div class="glyph fs1">
140
114
  <div class="clearfix pbs">
141
115
  <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>
142
116
  </div>
143
117
  </div>
144
- <div class="glyph fs3">
118
+ <div class="glyph fs1">
145
119
  <div class="clearfix pbs">
146
120
  <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>
147
121
  </div>
148
122
  </div>
149
- <div class="glyph fs3">
123
+ <div class="glyph fs1">
150
124
  <div class="clearfix pbs">
151
125
  <svg class="icon icon-bookmark"><use xlink:href="symbol-defs.svg#icon-bookmark"></use></svg><span class="name"> icon-bookmark</span>
152
126
  </div>
153
127
  </div>
154
- <div class="glyph fs3">
128
+ <div class="glyph fs1">
155
129
  <div class="clearfix pbs">
156
130
  <svg class="icon icon-database"><use xlink:href="symbol-defs.svg#icon-database"></use></svg><span class="name"> icon-database</span>
157
131
  </div>
158
132
  </div>
159
- <div class="glyph fs3">
133
+ <div class="glyph fs1">
160
134
  <div class="clearfix pbs">
161
135
  <svg class="icon icon-download"><use xlink:href="symbol-defs.svg#icon-download"></use></svg><span class="name"> icon-download</span>
162
136
  </div>
163
137
  </div>
164
- <div class="glyph fs3">
138
+ <div class="glyph fs1">
165
139
  <div class="clearfix pbs">
166
140
  <svg class="icon icon-help-circle"><use xlink:href="symbol-defs.svg#icon-help-circle"></use></svg><span class="name"> icon-help-circle</span>
167
141
  </div>
168
142
  </div>
169
- <div class="glyph fs3">
143
+ <div class="glyph fs1">
170
144
  <div class="clearfix pbs">
171
145
  <svg class="icon icon-life-buoy"><use xlink:href="symbol-defs.svg#icon-life-buoy"></use></svg><span class="name"> icon-life-buoy</span>
172
146
  </div>
173
147
  </div>
174
- <div class="glyph fs3">
148
+ <div class="glyph fs1">
175
149
  <div class="clearfix pbs">
176
150
  <svg class="icon icon-log-out"><use xlink:href="symbol-defs.svg#icon-log-out"></use></svg><span class="name"> icon-log-out</span>
177
151
  </div>
178
152
  </div>
179
- <div class="glyph fs3">
153
+ <div class="glyph fs1">
180
154
  <div class="clearfix pbs">
181
155
  <svg class="icon icon-more-vertical"><use xlink:href="symbol-defs.svg#icon-more-vertical"></use></svg><span class="name"> icon-more-vertical</span>
182
156
  </div>
183
157
  </div>
184
- <div class="glyph fs3">
158
+ <div class="glyph fs1">
185
159
  <div class="clearfix pbs">
186
160
  <svg class="icon icon-star"><use xlink:href="symbol-defs.svg#icon-star"></use></svg><span class="name"> icon-star</span>
187
161
  </div>
188
162
  </div>
189
- <div class="glyph fs3">
163
+ <div class="glyph fs1">
190
164
  <div class="clearfix pbs">
191
165
  <svg class="icon icon-upload"><use xlink:href="symbol-defs.svg#icon-upload"></use></svg><span class="name"> icon-upload</span>
192
166
  </div>
193
167
  </div>
194
- <div class="glyph fs3">
168
+ <div class="glyph fs1">
195
169
  <div class="clearfix pbs">
196
- <svg class="icon icon-upload-cloud"><use xlink:href="symbol-defs.svg#icon-upload-cloud"></use></svg><span class="name"> icon-upload-cloud</span>
170
+ <svg class="icon icon-publish"><use xlink:href="symbol-defs.svg#icon-publish"></use></svg><span class="name"> icon-publish</span>
197
171
  </div>
198
172
  </div>
199
- <div class="glyph fs3">
173
+ <div class="glyph fs1">
200
174
  <div class="clearfix pbs">
201
175
  <svg class="icon icon-coffee"><use xlink:href="symbol-defs.svg#icon-coffee"></use></svg><span class="name"> icon-coffee</span>
202
176
  </div>
203
177
  </div>
204
- <div class="glyph fs3">
178
+ <div class="glyph fs1">
205
179
  <div class="clearfix pbs">
206
180
  <svg class="icon icon-frown"><use xlink:href="symbol-defs.svg#icon-frown"></use></svg><span class="name"> icon-frown</span>
207
181
  </div>
208
182
  </div>
209
- <div class="glyph fs3">
183
+ <div class="glyph fs1">
210
184
  <div class="clearfix pbs">
211
185
  <svg class="icon icon-mail"><use xlink:href="symbol-defs.svg#icon-mail"></use></svg><span class="name"> icon-mail</span>
212
186
  </div>
213
187
  </div>
214
- <div class="glyph fs3">
188
+ <div class="glyph fs1">
215
189
  <div class="clearfix pbs">
216
190
  <svg class="icon icon-meh"><use xlink:href="symbol-defs.svg#icon-meh"></use></svg><span class="name"> icon-meh</span>
217
191
  </div>
218
192
  </div>
219
- <div class="glyph fs3">
193
+ <div class="glyph fs1">
220
194
  <div class="clearfix pbs">
221
195
  <svg class="icon icon-dollar-sign"><use xlink:href="symbol-defs.svg#icon-dollar-sign"></use></svg><span class="name"> icon-dollar-sign</span>
222
196
  </div>
223
197
  </div>
224
- <div class="glyph fs3">
198
+ <div class="glyph fs1">
225
199
  <div class="clearfix pbs">
226
200
  <svg class="icon icon-log"><use xlink:href="symbol-defs.svg#icon-log"></use></svg><span class="name"> icon-log</span>
227
201
  </div>
228
202
  </div>
229
- <div class="glyph fs3">
203
+ <div class="glyph fs1">
230
204
  <div class="clearfix pbs">
231
205
  <svg class="icon icon-campaign"><use xlink:href="symbol-defs.svg#icon-campaign"></use></svg><span class="name"> icon-campaign</span>
232
206
  </div>
233
207
  </div>
234
- <div class="glyph fs3">
208
+ <div class="glyph fs1">
235
209
  <div class="clearfix pbs">
236
210
  <svg class="icon icon-contact"><use xlink:href="symbol-defs.svg#icon-contact"></use></svg><span class="name"> icon-contact</span>
237
211
  </div>
238
212
  </div>
239
- <div class="glyph fs3">
213
+ <div class="glyph fs1">
240
214
  <div class="clearfix pbs">
241
215
  <svg class="icon icon-flow"><use xlink:href="symbol-defs.svg#icon-flow"></use></svg><span class="name"> icon-flow</span>
242
216
  </div>
243
217
  </div>
244
- <div class="glyph fs3">
218
+ <div class="glyph fs1">
245
219
  <div class="clearfix pbs">
246
220
  <svg class="icon icon-activity"><use xlink:href="symbol-defs.svg#icon-activity"></use></svg><span class="name"> icon-activity</span>
247
221
  </div>
248
222
  </div>
249
- <div class="glyph fs3">
223
+ <div class="glyph fs1">
250
224
  <div class="clearfix pbs">
251
225
  <svg class="icon icon-alert-circle"><use xlink:href="symbol-defs.svg#icon-alert-circle"></use></svg><span class="name"> icon-alert-circle</span>
252
226
  </div>
253
227
  </div>
254
- <div class="glyph fs3">
228
+ <div class="glyph fs1">
255
229
  <div class="clearfix pbs">
256
230
  <svg class="icon icon-alert-octagon"><use xlink:href="symbol-defs.svg#icon-alert-octagon"></use></svg><span class="name"> icon-alert-octagon</span>
257
231
  </div>
258
232
  </div>
259
- <div class="glyph fs3">
233
+ <div class="glyph fs1">
260
234
  <div class="clearfix pbs">
261
235
  <svg class="icon icon-alert-triangle"><use xlink:href="symbol-defs.svg#icon-alert-triangle"></use></svg><span class="name"> icon-alert-triangle</span>
262
236
  </div>
263
237
  </div>
264
- <div class="glyph fs3">
238
+ <div class="glyph fs1">
265
239
  <div class="clearfix pbs">
266
240
  <svg class="icon icon-archive"><use xlink:href="symbol-defs.svg#icon-archive"></use></svg><span class="name"> icon-archive</span>
267
241
  </div>
268
242
  </div>
269
- <div class="glyph fs3">
243
+ <div class="glyph fs1">
270
244
  <div class="clearfix pbs">
271
245
  <svg class="icon icon-battery"><use xlink:href="symbol-defs.svg#icon-battery"></use></svg><span class="name"> icon-battery</span>
272
246
  </div>
273
247
  </div>
274
- <div class="glyph fs3">
248
+ <div class="glyph fs1">
275
249
  <div class="clearfix pbs">
276
250
  <svg class="icon icon-battery-charging"><use xlink:href="symbol-defs.svg#icon-battery-charging"></use></svg><span class="name"> icon-battery-charging</span>
277
251
  </div>
278
252
  </div>
279
- <div class="glyph fs3">
253
+ <div class="glyph fs1">
280
254
  <div class="clearfix pbs">
281
255
  <svg class="icon icon-book"><use xlink:href="symbol-defs.svg#icon-book"></use></svg><span class="name"> icon-book</span>
282
256
  </div>
283
257
  </div>
284
- <div class="glyph fs3">
258
+ <div class="glyph fs1">
285
259
  <div class="clearfix pbs">
286
260
  <svg class="icon icon-briefcase"><use xlink:href="symbol-defs.svg#icon-briefcase"></use></svg><span class="name"> icon-briefcase</span>
287
261
  </div>
288
262
  </div>
289
- <div class="glyph fs3">
263
+ <div class="glyph fs1">
290
264
  <div class="clearfix pbs">
291
265
  <svg class="icon icon-calendar"><use xlink:href="symbol-defs.svg#icon-calendar"></use></svg><span class="name"> icon-calendar</span>
292
266
  </div>
293
267
  </div>
294
- <div class="glyph fs3">
268
+ <div class="glyph fs1">
295
269
  <div class="clearfix pbs">
296
270
  <svg class="icon icon-camera"><use xlink:href="symbol-defs.svg#icon-camera"></use></svg><span class="name"> icon-camera</span>
297
271
  </div>
298
272
  </div>
299
- <div class="glyph fs3">
273
+ <div class="glyph fs1">
300
274
  <div class="clearfix pbs">
301
275
  <svg class="icon icon-check"><use xlink:href="symbol-defs.svg#icon-check"></use></svg><span class="name"> icon-check</span>
302
276
  </div>
303
277
  </div>
304
- <div class="glyph fs3">
278
+ <div class="glyph fs1">
305
279
  <div class="clearfix pbs">
306
280
  <svg class="icon icon-check-square"><use xlink:href="symbol-defs.svg#icon-check-square"></use></svg><span class="name"> icon-check-square</span>
307
281
  </div>
308
282
  </div>
309
- <div class="glyph fs3">
283
+ <div class="glyph fs1">
310
284
  <div class="clearfix pbs">
311
285
  <svg class="icon icon-chevron-down"><use xlink:href="symbol-defs.svg#icon-chevron-down"></use></svg><span class="name"> icon-chevron-down</span>
312
286
  </div>
313
287
  </div>
314
- <div class="glyph fs3">
288
+ <div class="glyph fs1">
315
289
  <div class="clearfix pbs">
316
290
  <svg class="icon icon-chevron-left"><use xlink:href="symbol-defs.svg#icon-chevron-left"></use></svg><span class="name"> icon-chevron-left</span>
317
291
  </div>
318
292
  </div>
319
- <div class="glyph fs3">
293
+ <div class="glyph fs1">
320
294
  <div class="clearfix pbs">
321
295
  <svg class="icon icon-chevron-right"><use xlink:href="symbol-defs.svg#icon-chevron-right"></use></svg><span class="name"> icon-chevron-right</span>
322
296
  </div>
323
297
  </div>
324
- <div class="glyph fs3">
298
+ <div class="glyph fs1">
325
299
  <div class="clearfix pbs">
326
300
  <svg class="icon icon-chevron-up"><use xlink:href="symbol-defs.svg#icon-chevron-up"></use></svg><span class="name"> icon-chevron-up</span>
327
301
  </div>
328
302
  </div>
329
- <div class="glyph fs3">
303
+ <div class="glyph fs1">
330
304
  <div class="clearfix pbs">
331
305
  <svg class="icon icon-chevrons-down"><use xlink:href="symbol-defs.svg#icon-chevrons-down"></use></svg><span class="name"> icon-chevrons-down</span>
332
306
  </div>
333
307
  </div>
334
- <div class="glyph fs3">
308
+ <div class="glyph fs1">
335
309
  <div class="clearfix pbs">
336
310
  <svg class="icon icon-chevrons-left"><use xlink:href="symbol-defs.svg#icon-chevrons-left"></use></svg><span class="name"> icon-chevrons-left</span>
337
311
  </div>
338
312
  </div>
339
- <div class="glyph fs3">
313
+ <div class="glyph fs1">
340
314
  <div class="clearfix pbs">
341
315
  <svg class="icon icon-chevrons-right"><use xlink:href="symbol-defs.svg#icon-chevrons-right"></use></svg><span class="name"> icon-chevrons-right</span>
342
316
  </div>
343
317
  </div>
344
- <div class="glyph fs3">
318
+ <div class="glyph fs1">
345
319
  <div class="clearfix pbs">
346
320
  <svg class="icon icon-chevrons-up"><use xlink:href="symbol-defs.svg#icon-chevrons-up"></use></svg><span class="name"> icon-chevrons-up</span>
347
321
  </div>
348
322
  </div>
349
- <div class="glyph fs3">
323
+ <div class="glyph fs1">
350
324
  <div class="clearfix pbs">
351
325
  <svg class="icon icon-circle"><use xlink:href="symbol-defs.svg#icon-circle"></use></svg><span class="name"> icon-circle</span>
352
326
  </div>
353
327
  </div>
354
- <div class="glyph fs3">
328
+ <div class="glyph fs1">
355
329
  <div class="clearfix pbs">
356
330
  <svg class="icon icon-clipboard"><use xlink:href="symbol-defs.svg#icon-clipboard"></use></svg><span class="name"> icon-clipboard</span>
357
331
  </div>
358
332
  </div>
359
- <div class="glyph fs3">
333
+ <div class="glyph fs1">
360
334
  <div class="clearfix pbs">
361
335
  <svg class="icon icon-clock"><use xlink:href="symbol-defs.svg#icon-clock"></use></svg><span class="name"> icon-clock</span>
362
336
  </div>
363
337
  </div>
364
- <div class="glyph fs3">
338
+ <div class="glyph fs1">
365
339
  <div class="clearfix pbs">
366
340
  <svg class="icon icon-cloud1"><use xlink:href="symbol-defs.svg#icon-cloud1"></use></svg><span class="name"> icon-cloud1</span>
367
341
  </div>
368
342
  </div>
369
- <div class="glyph fs3">
343
+ <div class="glyph fs1">
370
344
  <div class="clearfix pbs">
371
345
  <svg class="icon icon-code"><use xlink:href="symbol-defs.svg#icon-code"></use></svg><span class="name"> icon-code</span>
372
346
  </div>
373
347
  </div>
374
- <div class="glyph fs3">
348
+ <div class="glyph fs1">
375
349
  <div class="clearfix pbs">
376
350
  <svg class="icon icon-copy"><use xlink:href="symbol-defs.svg#icon-copy"></use></svg><span class="name"> icon-copy</span>
377
351
  </div>
378
352
  </div>
379
- <div class="glyph fs3">
353
+ <div class="glyph fs1">
380
354
  <div class="clearfix pbs">
381
355
  <svg class="icon icon-credit-card"><use xlink:href="symbol-defs.svg#icon-credit-card"></use></svg><span class="name"> icon-credit-card</span>
382
356
  </div>
383
357
  </div>
384
- <div class="glyph fs3">
358
+ <div class="glyph fs1">
385
359
  <div class="clearfix pbs">
386
360
  <svg class="icon icon-disc"><use xlink:href="symbol-defs.svg#icon-disc"></use></svg><span class="name"> icon-disc</span>
387
361
  </div>
388
362
  </div>
389
- <div class="glyph fs3">
363
+ <div class="glyph fs1">
390
364
  <div class="clearfix pbs">
391
365
  <svg class="icon icon-edit"><use xlink:href="symbol-defs.svg#icon-edit"></use></svg><span class="name"> icon-edit</span>
392
366
  </div>
393
367
  </div>
394
- <div class="glyph fs3">
368
+ <div class="glyph fs1">
395
369
  <div class="clearfix pbs">
396
370
  <svg class="icon icon-edit-3"><use xlink:href="symbol-defs.svg#icon-edit-3"></use></svg><span class="name"> icon-edit-3</span>
397
371
  </div>
398
372
  </div>
399
- <div class="glyph fs3">
373
+ <div class="glyph fs1">
400
374
  <div class="clearfix pbs">
401
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>
402
376
  </div>
403
377
  </div>
404
- <div class="glyph fs3">
378
+ <div class="glyph fs1">
405
379
  <div class="clearfix pbs">
406
380
  <svg class="icon icon-flag"><use xlink:href="symbol-defs.svg#icon-flag"></use></svg><span class="name"> icon-flag</span>
407
381
  </div>
408
382
  </div>
409
- <div class="glyph fs3">
383
+ <div class="glyph fs1">
410
384
  <div class="clearfix pbs">
411
385
  <svg class="icon icon-home"><use xlink:href="symbol-defs.svg#icon-home"></use></svg><span class="name"> icon-home</span>
412
386
  </div>
413
387
  </div>
414
- <div class="glyph fs3">
388
+ <div class="glyph fs1">
415
389
  <div class="clearfix pbs">
416
390
  <svg class="icon icon-image"><use xlink:href="symbol-defs.svg#icon-image"></use></svg><span class="name"> icon-image</span>
417
391
  </div>
418
392
  </div>
419
- <div class="glyph fs3">
393
+ <div class="glyph fs1">
420
394
  <div class="clearfix pbs">
421
395
  <svg class="icon icon-inbox"><use xlink:href="symbol-defs.svg#icon-inbox"></use></svg><span class="name"> icon-inbox</span>
422
396
  </div>
423
397
  </div>
424
- <div class="glyph fs3">
398
+ <div class="glyph fs1">
425
399
  <div class="clearfix pbs">
426
400
  <svg class="icon icon-info"><use xlink:href="symbol-defs.svg#icon-info"></use></svg><span class="name"> icon-info</span>
427
401
  </div>
428
402
  </div>
429
- <div class="glyph fs3">
403
+ <div class="glyph fs1">
430
404
  <div class="clearfix pbs">
431
405
  <svg class="icon icon-layers"><use xlink:href="symbol-defs.svg#icon-layers"></use></svg><span class="name"> icon-layers</span>
432
406
  </div>
433
407
  </div>
434
- <div class="glyph fs3">
408
+ <div class="glyph fs1">
435
409
  <div class="clearfix pbs">
436
410
  <svg class="icon icon-loader"><use xlink:href="symbol-defs.svg#icon-loader"></use></svg><span class="name"> icon-loader</span>
437
411
  </div>
438
412
  </div>
439
- <div class="glyph fs3">
413
+ <div class="glyph fs1">
440
414
  <div class="clearfix pbs">
441
415
  <svg class="icon icon-lock"><use xlink:href="symbol-defs.svg#icon-lock"></use></svg><span class="name"> icon-lock</span>
442
416
  </div>
443
417
  </div>
444
- <div class="glyph fs3">
418
+ <div class="glyph fs1">
445
419
  <div class="clearfix pbs">
446
420
  <svg class="icon icon-mail1"><use xlink:href="symbol-defs.svg#icon-mail1"></use></svg><span class="name"> icon-mail1</span>
447
421
  </div>
448
422
  </div>
449
- <div class="glyph fs3">
423
+ <div class="glyph fs1">
450
424
  <div class="clearfix pbs">
451
425
  <svg class="icon icon-message-square"><use xlink:href="symbol-defs.svg#icon-message-square"></use></svg><span class="name"> icon-message-square</span>
452
426
  </div>
453
427
  </div>
454
- <div class="glyph fs3">
428
+ <div class="glyph fs1">
455
429
  <div class="clearfix pbs">
456
430
  <svg class="icon icon-mic"><use xlink:href="symbol-defs.svg#icon-mic"></use></svg><span class="name"> icon-mic</span>
457
431
  </div>
458
432
  </div>
459
- <div class="glyph fs3">
433
+ <div class="glyph fs1">
460
434
  <div class="clearfix pbs">
461
435
  <svg class="icon icon-paperclip"><use xlink:href="symbol-defs.svg#icon-paperclip"></use></svg><span class="name"> icon-paperclip</span>
462
436
  </div>
463
437
  </div>
464
- <div class="glyph fs3">
438
+ <div class="glyph fs1">
465
439
  <div class="clearfix pbs">
466
440
  <svg class="icon icon-phone"><use xlink:href="symbol-defs.svg#icon-phone"></use></svg><span class="name"> icon-phone</span>
467
441
  </div>
468
442
  </div>
469
- <div class="glyph fs3">
443
+ <div class="glyph fs1">
470
444
  <div class="clearfix pbs">
471
445
  <svg class="icon icon-phone-forwarded"><use xlink:href="symbol-defs.svg#icon-phone-forwarded"></use></svg><span class="name"> icon-phone-forwarded</span>
472
446
  </div>
473
447
  </div>
474
- <div class="glyph fs3">
448
+ <div class="glyph fs1">
475
449
  <div class="clearfix pbs">
476
450
  <svg class="icon icon-phone-incoming"><use xlink:href="symbol-defs.svg#icon-phone-incoming"></use></svg><span class="name"> icon-phone-incoming</span>
477
451
  </div>
478
452
  </div>
479
- <div class="glyph fs3">
453
+ <div class="glyph fs1">
480
454
  <div class="clearfix pbs">
481
455
  <svg class="icon icon-phone-missed"><use xlink:href="symbol-defs.svg#icon-phone-missed"></use></svg><span class="name"> icon-phone-missed</span>
482
456
  </div>
483
457
  </div>
484
- <div class="glyph fs3">
458
+ <div class="glyph fs1">
485
459
  <div class="clearfix pbs">
486
460
  <svg class="icon icon-phone-outgoing"><use xlink:href="symbol-defs.svg#icon-phone-outgoing"></use></svg><span class="name"> icon-phone-outgoing</span>
487
461
  </div>
488
462
  </div>
489
- <div class="glyph fs3">
463
+ <div class="glyph fs1">
490
464
  <div class="clearfix pbs">
491
465
  <svg class="icon icon-radio"><use xlink:href="symbol-defs.svg#icon-radio"></use></svg><span class="name"> icon-radio</span>
492
466
  </div>
493
467
  </div>
494
- <div class="glyph fs3">
468
+ <div class="glyph fs1">
495
469
  <div class="clearfix pbs">
496
470
  <svg class="icon icon-repeat"><use xlink:href="symbol-defs.svg#icon-repeat"></use></svg><span class="name"> icon-repeat</span>
497
471
  </div>
498
472
  </div>
499
- <div class="glyph fs3">
473
+ <div class="glyph fs1">
500
474
  <div class="clearfix pbs">
501
475
  <svg class="icon icon-send"><use xlink:href="symbol-defs.svg#icon-send"></use></svg><span class="name"> icon-send</span>
502
476
  </div>
503
477
  </div>
504
- <div class="glyph fs3">
478
+ <div class="glyph fs1">
505
479
  <div class="clearfix pbs">
506
480
  <svg class="icon icon-settings"><use xlink:href="symbol-defs.svg#icon-settings"></use></svg><span class="name"> icon-settings</span>
507
481
  </div>
508
482
  </div>
509
- <div class="glyph fs3">
483
+ <div class="glyph fs1">
510
484
  <div class="clearfix pbs">
511
485
  <svg class="icon icon-shield"><use xlink:href="symbol-defs.svg#icon-shield"></use></svg><span class="name"> icon-shield</span>
512
486
  </div>
513
487
  </div>
514
- <div class="glyph fs3">
488
+ <div class="glyph fs1">
515
489
  <div class="clearfix pbs">
516
490
  <svg class="icon icon-shield-off"><use xlink:href="symbol-defs.svg#icon-shield-off"></use></svg><span class="name"> icon-shield-off</span>
517
491
  </div>
518
492
  </div>
519
- <div class="glyph fs3">
493
+ <div class="glyph fs1">
520
494
  <div class="clearfix pbs">
521
495
  <svg class="icon icon-sidebar"><use xlink:href="symbol-defs.svg#icon-sidebar"></use></svg><span class="name"> icon-sidebar</span>
522
496
  </div>
523
497
  </div>
524
- <div class="glyph fs3">
498
+ <div class="glyph fs1">
525
499
  <div class="clearfix pbs">
526
500
  <svg class="icon icon-slash"><use xlink:href="symbol-defs.svg#icon-slash"></use></svg><span class="name"> icon-slash</span>
527
501
  </div>
528
502
  </div>
529
- <div class="glyph fs3">
503
+ <div class="glyph fs1">
530
504
  <div class="clearfix pbs">
531
505
  <svg class="icon icon-sliders"><use xlink:href="symbol-defs.svg#icon-sliders"></use></svg><span class="name"> icon-sliders</span>
532
506
  </div>
533
507
  </div>
534
- <div class="glyph fs3">
508
+ <div class="glyph fs1">
535
509
  <div class="clearfix pbs">
536
510
  <svg class="icon icon-smartphone"><use xlink:href="symbol-defs.svg#icon-smartphone"></use></svg><span class="name"> icon-smartphone</span>
537
511
  </div>
538
512
  </div>
539
- <div class="glyph fs3">
513
+ <div class="glyph fs1">
540
514
  <div class="clearfix pbs">
541
515
  <svg class="icon icon-square"><use xlink:href="symbol-defs.svg#icon-square"></use></svg><span class="name"> icon-square</span>
542
516
  </div>
543
517
  </div>
544
- <div class="glyph fs3">
518
+ <div class="glyph fs1">
545
519
  <div class="clearfix pbs">
546
520
  <svg class="icon icon-tag"><use xlink:href="symbol-defs.svg#icon-tag"></use></svg><span class="name"> icon-tag</span>
547
521
  </div>
548
522
  </div>
549
- <div class="glyph fs3">
523
+ <div class="glyph fs1">
550
524
  <div class="clearfix pbs">
551
525
  <svg class="icon icon-tool"><use xlink:href="symbol-defs.svg#icon-tool"></use></svg><span class="name"> icon-tool</span>
552
526
  </div>
553
527
  </div>
554
- <div class="glyph fs3">
528
+ <div class="glyph fs1">
555
529
  <div class="clearfix pbs">
556
530
  <svg class="icon icon-trash"><use xlink:href="symbol-defs.svg#icon-trash"></use></svg><span class="name"> icon-trash</span>
557
531
  </div>
558
532
  </div>
559
- <div class="glyph fs3">
533
+ <div class="glyph fs1">
560
534
  <div class="clearfix pbs">
561
535
  <svg class="icon icon-trash-2"><use xlink:href="symbol-defs.svg#icon-trash-2"></use></svg><span class="name"> icon-trash-2</span>
562
536
  </div>
563
537
  </div>
564
- <div class="glyph fs3">
538
+ <div class="glyph fs1">
565
539
  <div class="clearfix pbs">
566
540
  <svg class="icon icon-user"><use xlink:href="symbol-defs.svg#icon-user"></use></svg><span class="name"> icon-user</span>
567
541
  </div>
568
542
  </div>
569
- <div class="glyph fs3">
543
+ <div class="glyph fs1">
570
544
  <div class="clearfix pbs">
571
545
  <svg class="icon icon-users"><use xlink:href="symbol-defs.svg#icon-users"></use></svg><span class="name"> icon-users</span>
572
546
  </div>
573
547
  </div>
574
- <div class="glyph fs3">
548
+ <div class="glyph fs1">
575
549
  <div class="clearfix pbs">
576
550
  <svg class="icon icon-speaker"><use xlink:href="symbol-defs.svg#icon-speaker"></use></svg><span class="name"> icon-speaker</span>
577
551
  </div>
578
552
  </div>
579
- <div class="glyph fs3">
553
+ <div class="glyph fs1">
580
554
  <div class="clearfix pbs">
581
555
  <svg class="icon icon-x"><use xlink:href="symbol-defs.svg#icon-x"></use></svg><span class="name"> icon-x</span>
582
556
  </div>
583
557
  </div>
584
- <div class="glyph fs3">
558
+ <div class="glyph fs1">
585
559
  <div class="clearfix pbs">
586
560
  <svg class="icon icon-x-octagon"><use xlink:href="symbol-defs.svg#icon-x-octagon"></use></svg><span class="name"> icon-x-octagon</span>
587
561
  </div>
588
562
  </div>
589
- <div class="glyph fs3">
563
+ <div class="glyph fs1">
590
564
  <div class="clearfix pbs">
591
565
  <svg class="icon icon-zap"><use xlink:href="symbol-defs.svg#icon-zap"></use></svg><span class="name"> icon-zap</span>
592
566
  </div>
593
567
  </div>
594
- <div class="glyph fs3">
568
+ <div class="glyph fs1">
595
569
  <div class="clearfix pbs">
596
570
  <svg class="icon icon-contact-cal"><use xlink:href="symbol-defs.svg#icon-contact-cal"></use></svg><span class="name"> icon-contact-cal</span>
597
571
  </div>
598
572
  </div>
599
- <div class="glyph fs3">
573
+ <div class="glyph fs1">
600
574
  <div class="clearfix pbs">
601
575
  <svg class="icon icon-send-mobile"><use xlink:href="symbol-defs.svg#icon-send-mobile"></use></svg><span class="name"> icon-send-mobile</span>
602
576
  </div>
603
577
  </div>
578
+ </div>
579
+ <div class="clearfix mhl ptl">
580
+ <h1 class="mvm mtn fgc1">Grid Size: 0</h1>
581
+ <div class="glyph fs2">
582
+ <div class="clearfix pbs">
583
+ <svg class="icon icon-zapier"><use xlink:href="symbol-defs.svg#icon-zapier"></use></svg><span class="name"> icon-zapier</span>
584
+ </div>
585
+ </div>
586
+ </div>
587
+ <div class="clearfix mhl ptl">
588
+ <h1 class="mvm mtn fgc1">Grid Size: 16</h1>
589
+ <div class="glyph fs3">
590
+ <div class="clearfix pbs">
591
+ <svg class="icon icon-channel"><use xlink:href="symbol-defs.svg#icon-channel"></use></svg><span class="name"> icon-channel</span>
592
+ </div>
593
+ </div>
594
+ <div class="glyph fs3">
595
+ <div class="clearfix pbs">
596
+ <svg class="icon icon-users1"><use xlink:href="symbol-defs.svg#icon-users1"></use></svg><span class="name"> icon-users1</span>
597
+ </div>
598
+ </div>
599
+ <div class="glyph fs3">
600
+ <div class="clearfix pbs">
601
+ <svg class="icon icon-lock2"><use xlink:href="symbol-defs.svg#icon-lock2"></use></svg><span class="name"> icon-lock2</span>
602
+ </div>
603
+ </div>
604
+ <div class="glyph fs3">
605
+ <div class="clearfix pbs">
606
+ <svg class="icon icon-atom"><use xlink:href="symbol-defs.svg#icon-atom"></use></svg><span class="name"> icon-atom</span>
607
+ </div>
608
+ </div>
609
+ <div class="glyph fs3">
610
+ <div class="clearfix pbs">
611
+ <svg class="icon icon-paperplane"><use xlink:href="symbol-defs.svg#icon-paperplane"></use></svg><span class="name"> icon-paperplane</span>
612
+ </div>
613
+ </div>
614
+ <div class="glyph fs3">
615
+ <div class="clearfix pbs">
616
+ <svg class="icon icon-cancel"><use xlink:href="symbol-defs.svg#icon-cancel"></use></svg><span class="name"> icon-cancel</span>
617
+ </div>
618
+ </div>
604
619
  </div>
605
620
  <div class="clearfix mhl ptl">
606
621
  <h1 class="mvm mtn fgc1">Grid Size: 32</h1>