toggle-components-library 1.25.9 → 1.25.11

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 (42) hide show
  1. package/dist/img/{airship-circle-user-icon-hover.7eecff69.svg → airship-user-icon-hover.7eecff69.svg} +0 -0
  2. package/dist/img/{airship-circle-user-icon.b39571b4.svg → airship-user-icon.b39571b4.svg} +0 -0
  3. package/dist/toggle-components-library.common.js +151 -354
  4. package/dist/toggle-components-library.common.js.map +1 -1
  5. package/dist/toggle-components-library.css +1 -1
  6. package/dist/toggle-components-library.umd.js +151 -354
  7. package/dist/toggle-components-library.umd.js.map +1 -1
  8. package/dist/toggle-components-library.umd.min.js +6 -6
  9. package/dist/toggle-components-library.umd.min.js.map +1 -1
  10. package/package.json +3 -3
  11. package/src/.DS_Store +0 -0
  12. package/src/assets/icons/airship-user-icon-hover.svg +2 -2
  13. package/src/assets/icons/airship-user-icon.svg +2 -2
  14. package/src/components/forms/ToggleInputImage.vue +6 -10
  15. package/src/components/forms/ToggleInputText.vue +6 -6
  16. package/src/components/metrics/ToggleMetricBarChart.vue +6 -7
  17. package/src/components/metrics/ToggleMetricFunnelChart.vue +3 -12
  18. package/src/components/metrics/ToggleMetricPieChart.vue +8 -15
  19. package/src/components/metrics/ToggleMetricSingleMetric.vue +4 -2
  20. package/src/components/metrics/ToggleMetricSparkLine.vue +7 -9
  21. package/src/components/mixins/mixins.js +23 -58
  22. package/src/components/navs/multitiersidenav/ToggleMultiTierSideNav.vue +3 -39
  23. package/src/components/text/ToggleTextClipboardCopy.vue +1 -10
  24. package/src/index.js +0 -2
  25. package/src/sass/includes/_as_buttons.scss +0 -55
  26. package/src/sass/includes/_as_inputs.scss +9 -9
  27. package/src/sass/includes/_as_metrics.scss +17 -28
  28. package/src/sass/includes/_as_navs.scss +6 -111
  29. package/src/sass/includes/_as_text.scss +1 -1
  30. package/dist/img/airship-audiences-hover.7197407c.svg +0 -9
  31. package/dist/img/airship-audiences.e7477e19.svg +0 -9
  32. package/dist/img/airship-user-icon.1c0e190a.svg +0 -3
  33. package/dist/img/airship-x-hover.e1c3bb98.svg +0 -3
  34. package/dist/img/airship-x.dec93e61.svg +0 -3
  35. package/src/assets/icons/airship-audiences-hover.svg +0 -9
  36. package/src/assets/icons/airship-audiences.svg +0 -9
  37. package/src/assets/icons/airship-circle-user-icon-hover.svg +0 -3
  38. package/src/assets/icons/airship-circle-user-icon.svg +0 -3
  39. package/src/assets/icons/airship-x-hover.svg +0 -3
  40. package/src/assets/icons/airship-x.svg +0 -3
  41. package/src/components/buttons/ToggleLoginButton.vue +0 -67
  42. package/src/components/json/char_list.json +0 -2233
@@ -280,7 +280,7 @@
280
280
 
281
281
  .toggle-input-select {
282
282
  padding: 0rem;
283
- font-size: 0.9rem;
283
+ font-size: 1.1rem;
284
284
  }
285
285
  }
286
286
 
@@ -507,20 +507,20 @@ $iconWidth:20px;
507
507
  background-size: cover !important;
508
508
  background-position: center;
509
509
  border-radius:4px;
510
+ cursor: move;
510
511
  }
511
- .toggle-center {
512
- display: flex;
513
- align-items: center;
514
- justify-content: center;
515
- }
516
- .toggle-move-icon::after {
512
+ .toggle-item-img::after{
517
513
  position: absolute;
518
514
  content:'';
519
515
  height: 100%;
520
516
  width: 100%;
521
- background-size: $iconWidth!important;
522
517
  background: url('../assets/icons/draggable.svg') no-repeat center center;
523
- cursor: move;
518
+ background-size: $iconWidth;
519
+ }
520
+ .toggle-center {
521
+ display: flex;
522
+ align-items: center;
523
+ justify-content: center;
524
524
  }
525
525
 
526
526
  }
@@ -22,20 +22,20 @@
22
22
  /* Funnel */
23
23
  .toggle-metric-funnel-container {
24
24
  grid-template-rows: auto;
25
- grid-template-columns: 1fr 1fr 1fr 1fr;
25
+ grid-template-columns: 1fr 1fr 1fr;
26
26
  display: grid;
27
27
  grid-auto-flow: column;
28
28
 
29
29
  }
30
30
 
31
31
  .funnel-grid-svg {
32
- min-height: 12rem;
33
- background: transparent url('../assets/img/funnel.svg') no-repeat padding-box center;
34
- background-size: 100% auto;
32
+ min-height: 13rem;
33
+ background: transparent url('../assets/img/funnel.svg') no-repeat padding-box bottom;
34
+ background-size: 100% 100%;
35
35
  grid-row-start: 2;
36
36
  grid-column-start: 1;
37
37
  grid-row-end: 3;
38
- grid-column-end: 5;
38
+ grid-column-end: 4;
39
39
  }
40
40
 
41
41
  .funnel-grid-1 {
@@ -60,13 +60,6 @@
60
60
  }
61
61
 
62
62
  .funnel-grid-4 {
63
- grid-row-start: 1;
64
- grid-column-start: 4;
65
- grid-row-end: 2;
66
- grid-column-end: 5;
67
- }
68
-
69
- .funnel-grid-5 {
70
63
  grid-row-start: 2;
71
64
  grid-column-start: 1;
72
65
  grid-row-end: 3;
@@ -74,7 +67,7 @@
74
67
  display: flex;
75
68
  }
76
69
 
77
- .funnel-grid-6 {
70
+ .funnel-grid-5 {
78
71
  grid-row-start: 2;
79
72
  grid-column-start: 2;
80
73
  grid-row-end: 3;
@@ -82,7 +75,7 @@
82
75
  display: flex;
83
76
  }
84
77
 
85
- .funnel-grid-7 {
78
+ .funnel-grid-6 {
86
79
  grid-row-start: 2;
87
80
  grid-column-start: 3;
88
81
  grid-row-end: 3;
@@ -90,19 +83,11 @@
90
83
  display: flex;
91
84
  }
92
85
 
93
- .funnel-grid-8 {
94
- grid-row-start: 2;
95
- grid-column-start: 4;
96
- grid-row-end: 3;
97
- grid-column-end: 5;
98
- display: flex;
99
- }
100
-
101
86
  .funnel-spark-line, .funnel-single-metric {
102
87
  margin-right: 1rem;
103
88
  border-right: 1px solid #BCDBEE;
104
89
 
105
- &:nth-child(5), &:last-child {
90
+ &:nth-child(4), &:last-child {
106
91
  border: 0;
107
92
  }
108
93
  }
@@ -112,9 +97,13 @@
112
97
  }
113
98
 
114
99
  .funnel-single-metric-container {
115
- display: flex;
116
- flex-direction: column;
117
- align-items: center;
118
- justify-content: center;
119
- width: 100%;
100
+ margin-left: 40%;
101
+ align-self: center;
102
+ }
103
+
104
+ @media (min-width: $toggle-breakpoint-large-desktop) {
105
+ .funnel-grid-svg {
106
+ min-height: 15rem;
107
+ background-size: 100%;
108
+ }
120
109
  }
@@ -140,124 +140,30 @@
140
140
  min-height: 100vh;
141
141
 
142
142
  .toggle-multi-tier-sidenav-logo {
143
- max-width: 7rem;
144
- margin: 1rem 0 2rem 0.6rem;
145
- }
146
-
147
- .toggle-multi-tier-sidenav-user-icon {
148
- background-position: center;
149
- background-size: contain;
150
- background-repeat: no-repeat;
151
- background-image: url("../assets/icons/airship-circle-user-icon.svg");
152
- width: 2rem;
153
- height: 2rem;
143
+ max-width: 6rem;
154
144
  margin: 1rem 0 1rem 0.6rem;
155
- cursor: pointer;
156
-
157
- &:hover {
158
- animation: tilt-shake 0.4s;
159
- background-image: url("../assets/icons/airship-circle-user-icon-hover.svg");
160
- }
161
145
  }
162
146
 
163
- .toggle-multi-tier-sidenav-user-icon-menu-open {
147
+ .toggle-multi-tier-sidenav-user-icon {
164
148
  background-position: center;
165
149
  background-size: contain;
166
150
  background-repeat: no-repeat;
167
- background-image: url("../assets/icons/airship-x.svg");
151
+ background-image: url("../assets/icons/airship-user-icon.svg");
168
152
  width: 2rem;
169
153
  height: 2rem;
170
- margin: 1rem 0 1rem 0.6rem;
154
+ margin: 2rem 0 1rem 0.6rem;
171
155
  cursor: pointer;
172
156
 
173
157
  &:hover {
174
158
  animation: tilt-shake 0.4s;
175
- background-image: url("../assets/icons/airship-x-hover.svg");
159
+ background-image: url("../assets/icons/airship-user-icon-hover.svg");
176
160
  }
177
161
  }
178
162
 
179
- .toggle-multi-tier-sidenav-user-menu-container {
180
- padding: 0;
181
- position: relative;
182
- bottom: 3.9rem;
183
- z-index: 99;
184
- }
185
-
186
- .toggle-multi-tier-sidenav-user-menu {
187
- position: absolute;
188
- background-color: #ffffff;
189
- border-radius: 0.5rem;
190
- padding: 0;
191
- bottom: -4rem;
192
- height: fit-content;
193
- margin: 2rem 0 0 0.6rem;
194
- width: 96%;
195
- }
196
-
197
- .toggle-multi-tier-sidenav-user-menu:after {
198
- content: '';
199
- position: absolute;
200
- bottom: 0;
201
- left: 15px;
202
- width: 0px;
203
- height: 0;
204
- border: 8px solid transparent;
205
- border-top-color: #ffffff;
206
- border-bottom: 0px;
207
- margin-left: -8px;
208
- margin-bottom: -8px;
209
- }
210
-
211
- .toggle-multi-tier-sidenav-user-menu-divider {
212
- width: 92%;
213
- margin: 0.9rem 0rem 1.2rem .6rem;
214
- border-bottom: 1px solid #E9EDF2;
215
- }
216
-
217
163
  .toggle-multi-tier-sidenav-title {
218
- font-size: 0.9rem;
219
164
  margin: 2rem 0 0 .6rem;
220
165
  }
221
166
 
222
- .toggle-multi-tier-sidenav-user-name {
223
- margin: 0 0 0 1.5rem;
224
- padding: .8rem 0 0 .6rem;
225
- font-size: .9rem
226
- }
227
-
228
- .toggle-multi-tier-sidenav-user-menu:before {
229
- content: '';
230
- position: absolute;
231
- background-position: center;
232
- background-size: contain;
233
- background-repeat: no-repeat;
234
- width: .9rem;
235
- height: .9rem;
236
- margin: 1rem 0 1rem 0.6rem;
237
- background-image: url("../assets/icons/airship-user-icon.svg");
238
- }
239
-
240
- .toggle-multi-tier-sidenav-user-menu-ul {
241
- display: flex;
242
- flex-direction: column;
243
- padding: 0;
244
- margin: 0;
245
- li {
246
- list-style: none;
247
- font-family: $toggle-font-family;
248
- font-size: .9rem;
249
- padding: 0 0 1.5rem 0.6rem;
250
- a, span {
251
- color: #354b64;
252
- }
253
- }
254
- li:hover {
255
- a, span {
256
- color: $toggle-blue;
257
- }
258
- }
259
- }
260
-
261
167
  .toggle-multi-tier-sidenav-select-container {
262
168
  height: max-content;
263
169
  overflow: hidden;
@@ -273,7 +179,7 @@
273
179
  .toggle-multi-tier-sidenav-item {
274
180
  list-style: none;
275
181
  font-family: $toggle-font-family;
276
- font-size: 1rem;
182
+ font-size: 1.1rem;
277
183
  font-weight: bold !important;
278
184
  padding-bottom: 0.25rem;
279
185
 
@@ -496,17 +402,6 @@
496
402
  background-image: url("../assets/icons/airship-hat-hover.svg");
497
403
  }
498
404
 
499
- &.airship-audiences-icon a::before,
500
- &.airship-audiences-icon span::before {
501
- background-image: url("../assets/icons/airship-audiences.svg");
502
- }
503
-
504
- &.airship-audiences-icon a:hover::before,
505
- &.airship-audiences-icon span:hover::before {
506
- animation: tilt-shake 0.4s;
507
- background-image: url("../assets/icons/airship-audiences-hover.svg");
508
- }
509
-
510
405
  }
511
406
  }
512
407
 
@@ -51,7 +51,7 @@ a {
51
51
  background-position: center;
52
52
  background-size: contain;
53
53
  background-repeat: no-repeat;
54
- cursor:copy;
54
+ cursor:pointer;
55
55
  }
56
56
  }
57
57
  }
@@ -1,9 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="94.135" height="72.864" viewBox="0 0 94.135 72.864">
2
- <g id="Group_340" data-name="Group 340" transform="translate(-5223.304 -1302)">
3
- <path id="Path_215" data-name="Path 215" d="M5543.056,1319.05a17.05,17.05,0,1,0-17.049,17.05A17.049,17.049,0,0,0,5543.056,1319.05Zm-46.887,48.525a4.608,4.608,0,0,0,4.614,4.618l50.443,2.664c3.059.143,4.617-2.068,4.617-4.618,0-12.747-9.95-25.742-23.084-25.748h-13.506A23.086,23.086,0,0,0,5496.169,1367.575Z" transform="translate(-238.405)" fill="#477ef6"/>
4
- <g id="Group_338" data-name="Group 338" transform="translate(5223.304 1308.662)">
5
- <path id="Path_216" data-name="Path 216" d="M5251.644,1659.237a27.462,27.462,0,0,1,8.065-19.469,27.911,27.911,0,0,1,2.373-2.115,19.2,19.2,0,0,0-8.212-1.833h-11.283c-10.972,0-19.283,10.86-19.283,21.509a3.555,3.555,0,0,0,3.856,3.858l24.509-1.294C5251.655,1659.674,5251.644,1659.456,5251.644,1659.237Z" transform="translate(-5223.304 -1600.324)" fill="#477ef6"/>
6
- <circle id="Ellipse_112" data-name="Ellipse 112" cx="14.243" cy="14.243" r="14.243" transform="translate(10.682 0)" fill="#477ef6"/>
7
- </g>
8
- </g>
9
- </svg>
@@ -1,9 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="94.135" height="72.864" viewBox="0 0 94.135 72.864">
2
- <g id="Group_339" data-name="Group 339" transform="translate(-5223.304 -1302)">
3
- <path id="Path_215" data-name="Path 215" d="M5543.056,1319.05a17.05,17.05,0,1,0-17.049,17.05A17.049,17.049,0,0,0,5543.056,1319.05Zm-46.887,48.525a4.608,4.608,0,0,0,4.614,4.618l50.443,2.664c3.059.143,4.617-2.068,4.617-4.618,0-12.747-9.95-25.742-23.084-25.748h-13.506A23.086,23.086,0,0,0,5496.169,1367.575Z" transform="translate(-238.405)" fill="#354b64"/>
4
- <g id="Group_338" data-name="Group 338" transform="translate(5223.304 1308.662)">
5
- <path id="Path_216" data-name="Path 216" d="M5251.644,1659.237a27.462,27.462,0,0,1,8.065-19.469,27.911,27.911,0,0,1,2.373-2.115,19.2,19.2,0,0,0-8.212-1.833h-11.283c-10.972,0-19.283,10.86-19.283,21.509a3.555,3.555,0,0,0,3.856,3.858l24.509-1.294C5251.655,1659.674,5251.644,1659.456,5251.644,1659.237Z" transform="translate(-5223.304 -1600.324)" fill="#354b64"/>
6
- <circle id="Ellipse_112" data-name="Ellipse 112" cx="14.243" cy="14.243" r="14.243" transform="translate(10.682 0)" fill="#354b64"/>
7
- </g>
8
- </g>
9
- </svg>
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="76.977" height="94" viewBox="0 0 76.977 94">
2
- <path id="Exclusion_5" data-name="Exclusion 5" d="M-11917.125-16077.678h-.191a5.293,5.293,0,0,1-4.119-1.816,6.407,6.407,0,0,1-1.379-4.145,35.712,35.712,0,0,1,8.531-22.773c5.736-6.734,13.279-10.441,21.24-10.445h17.424a29.584,29.584,0,0,1,21.061,8.723,29.6,29.6,0,0,1,8.721,21.059,5.954,5.954,0,0,1-5.939,5.953h-.014l-65.07,3.438C-11916.949-16077.678-11917.033-16077.678-11917.125-16077.678Zm32.8-50a21.867,21.867,0,0,1-15.555-6.445,21.88,21.88,0,0,1-6.437-15.559,21.871,21.871,0,0,1,6.438-15.555,21.856,21.856,0,0,1,15.555-6.441,22.021,22.021,0,0,1,22,22A22.025,22.025,0,0,1-11884.328-16127.678Z" transform="translate(11922.814 16171.678)" fill="#354b64"/>
3
- </svg>
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="94" height="94.001" viewBox="0 0 94 94.001">
2
- <path id="Exclusion_4" data-name="Exclusion 4" d="M-11986-16029a46.689,46.689,0,0,1-18.294-3.693,46.864,46.864,0,0,1-14.941-10.071,46.871,46.871,0,0,1-10.073-14.94A46.7,46.7,0,0,1-12033-16076a46.7,46.7,0,0,1,3.693-18.294,46.869,46.869,0,0,1,10.073-14.941,46.869,46.869,0,0,1,14.941-10.073A46.7,46.7,0,0,1-11986-16123a46.7,46.7,0,0,1,18.294,3.693,46.872,46.872,0,0,1,14.939,10.073,46.864,46.864,0,0,1,10.071,14.941A46.689,46.689,0,0,1-11939-16076a46.689,46.689,0,0,1-3.693,18.294,46.871,46.871,0,0,1-10.071,14.94,46.856,46.856,0,0,1-14.939,10.071A46.689,46.689,0,0,1-11986-16029Zm-13.426-64.429a3.971,3.971,0,0,0-2.828,1.172,4.005,4.005,0,0,0,0,5.657l10.233,10.229-10.233,10.229a4.006,4.006,0,0,0,0,5.656,3.977,3.977,0,0,0,2.828,1.174,3.974,3.974,0,0,0,2.828-1.174l10.229-10.229,10.229,10.225a3.971,3.971,0,0,0,2.828,1.172,3.971,3.971,0,0,0,2.828-1.172,3.971,3.971,0,0,0,1.172-2.828,3.971,3.971,0,0,0-1.172-2.828l-10.229-10.226,10.229-10.225a3.972,3.972,0,0,0,1.172-2.829,3.971,3.971,0,0,0-1.172-2.828,3.976,3.976,0,0,0-2.828-1.171,3.976,3.976,0,0,0-2.828,1.171l-10.229,10.226-10.229-10.229A3.968,3.968,0,0,0-11999.425-16093.429Z" transform="translate(12033.001 16123.001)" fill="#477ef6"/>
3
- </svg>
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="94" height="94.001" viewBox="0 0 94 94.001">
2
- <path id="Exclusion_2" data-name="Exclusion 2" d="M-11986-16029a46.689,46.689,0,0,1-18.294-3.693,46.864,46.864,0,0,1-14.941-10.071,46.871,46.871,0,0,1-10.073-14.94A46.7,46.7,0,0,1-12033-16076a46.7,46.7,0,0,1,3.693-18.294,46.869,46.869,0,0,1,10.073-14.941,46.869,46.869,0,0,1,14.941-10.073A46.7,46.7,0,0,1-11986-16123a46.7,46.7,0,0,1,18.294,3.693,46.872,46.872,0,0,1,14.939,10.073,46.864,46.864,0,0,1,10.071,14.941A46.689,46.689,0,0,1-11939-16076a46.689,46.689,0,0,1-3.693,18.294,46.871,46.871,0,0,1-10.071,14.94,46.856,46.856,0,0,1-14.939,10.071A46.689,46.689,0,0,1-11986-16029Zm-13.426-64.429a3.971,3.971,0,0,0-2.828,1.172,4.005,4.005,0,0,0,0,5.657l10.233,10.229-10.233,10.229a4.006,4.006,0,0,0,0,5.656,3.977,3.977,0,0,0,2.828,1.174,3.974,3.974,0,0,0,2.828-1.174l10.229-10.229,10.229,10.225a3.971,3.971,0,0,0,2.828,1.172,3.971,3.971,0,0,0,2.828-1.172,3.971,3.971,0,0,0,1.172-2.828,3.971,3.971,0,0,0-1.172-2.828l-10.229-10.226,10.229-10.225a3.972,3.972,0,0,0,1.172-2.829,3.971,3.971,0,0,0-1.172-2.828,3.976,3.976,0,0,0-2.828-1.171,3.976,3.976,0,0,0-2.828,1.171l-10.229,10.226-10.229-10.229A3.968,3.968,0,0,0-11999.425-16093.429Z" transform="translate(12033.001 16123.001)" fill="#354b64"/>
3
- </svg>
@@ -1,9 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="94.135" height="72.864" viewBox="0 0 94.135 72.864">
2
- <g id="Group_340" data-name="Group 340" transform="translate(-5223.304 -1302)">
3
- <path id="Path_215" data-name="Path 215" d="M5543.056,1319.05a17.05,17.05,0,1,0-17.049,17.05A17.049,17.049,0,0,0,5543.056,1319.05Zm-46.887,48.525a4.608,4.608,0,0,0,4.614,4.618l50.443,2.664c3.059.143,4.617-2.068,4.617-4.618,0-12.747-9.95-25.742-23.084-25.748h-13.506A23.086,23.086,0,0,0,5496.169,1367.575Z" transform="translate(-238.405)" fill="#477ef6"/>
4
- <g id="Group_338" data-name="Group 338" transform="translate(5223.304 1308.662)">
5
- <path id="Path_216" data-name="Path 216" d="M5251.644,1659.237a27.462,27.462,0,0,1,8.065-19.469,27.911,27.911,0,0,1,2.373-2.115,19.2,19.2,0,0,0-8.212-1.833h-11.283c-10.972,0-19.283,10.86-19.283,21.509a3.555,3.555,0,0,0,3.856,3.858l24.509-1.294C5251.655,1659.674,5251.644,1659.456,5251.644,1659.237Z" transform="translate(-5223.304 -1600.324)" fill="#477ef6"/>
6
- <circle id="Ellipse_112" data-name="Ellipse 112" cx="14.243" cy="14.243" r="14.243" transform="translate(10.682 0)" fill="#477ef6"/>
7
- </g>
8
- </g>
9
- </svg>
@@ -1,9 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="94.135" height="72.864" viewBox="0 0 94.135 72.864">
2
- <g id="Group_339" data-name="Group 339" transform="translate(-5223.304 -1302)">
3
- <path id="Path_215" data-name="Path 215" d="M5543.056,1319.05a17.05,17.05,0,1,0-17.049,17.05A17.049,17.049,0,0,0,5543.056,1319.05Zm-46.887,48.525a4.608,4.608,0,0,0,4.614,4.618l50.443,2.664c3.059.143,4.617-2.068,4.617-4.618,0-12.747-9.95-25.742-23.084-25.748h-13.506A23.086,23.086,0,0,0,5496.169,1367.575Z" transform="translate(-238.405)" fill="#354b64"/>
4
- <g id="Group_338" data-name="Group 338" transform="translate(5223.304 1308.662)">
5
- <path id="Path_216" data-name="Path 216" d="M5251.644,1659.237a27.462,27.462,0,0,1,8.065-19.469,27.911,27.911,0,0,1,2.373-2.115,19.2,19.2,0,0,0-8.212-1.833h-11.283c-10.972,0-19.283,10.86-19.283,21.509a3.555,3.555,0,0,0,3.856,3.858l24.509-1.294C5251.655,1659.674,5251.644,1659.456,5251.644,1659.237Z" transform="translate(-5223.304 -1600.324)" fill="#354b64"/>
6
- <circle id="Ellipse_112" data-name="Ellipse 112" cx="14.243" cy="14.243" r="14.243" transform="translate(10.682 0)" fill="#354b64"/>
7
- </g>
8
- </g>
9
- </svg>
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="94" height="94.001" viewBox="0 0 94 94.001">
2
- <path id="Exclusion_3" data-name="Exclusion 3" d="M-11986-16029a46.689,46.689,0,0,1-18.294-3.693,46.864,46.864,0,0,1-14.941-10.071,46.871,46.871,0,0,1-10.073-14.94A46.7,46.7,0,0,1-12033-16076a46.7,46.7,0,0,1,3.693-18.294,46.869,46.869,0,0,1,10.073-14.941,46.869,46.869,0,0,1,14.941-10.073A46.7,46.7,0,0,1-11986-16123a46.7,46.7,0,0,1,18.294,3.693,46.872,46.872,0,0,1,14.939,10.073,46.864,46.864,0,0,1,10.071,14.941A46.689,46.689,0,0,1-11939-16076a46.689,46.689,0,0,1-3.693,18.294,46.871,46.871,0,0,1-10.071,14.94,46.856,46.856,0,0,1-14.939,10.071A46.689,46.689,0,0,1-11986-16029Zm-4.034-45.308a12.917,12.917,0,0,0-9.831,4.836,16.519,16.519,0,0,0-3.95,10.54,2.967,2.967,0,0,0,.64,1.918,2.452,2.452,0,0,0,1.905.842h.089c.04,0,.081,0,.121,0l30.117-1.59h.007a2.756,2.756,0,0,0,2.749-2.756,13.7,13.7,0,0,0-4.037-9.747,13.69,13.69,0,0,0-9.745-4.039Zm4.03-25.366a10.193,10.193,0,0,0-10.181,10.181,10.191,10.191,0,0,0,10.181,10.177,10.111,10.111,0,0,0,7.2-2.981,10.1,10.1,0,0,0,2.981-7.2,10.111,10.111,0,0,0-2.981-7.2A10.111,10.111,0,0,0-11986-16099.674Z" transform="translate(12033.001 16123.001)" fill="#477ef6"/>
3
- </svg>
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="94" height="94.001" viewBox="0 0 94 94.001">
2
- <path id="Exclusion_1" data-name="Exclusion 1" d="M-11986-16029a46.689,46.689,0,0,1-18.294-3.693,46.864,46.864,0,0,1-14.941-10.071,46.871,46.871,0,0,1-10.073-14.94A46.7,46.7,0,0,1-12033-16076a46.7,46.7,0,0,1,3.693-18.294,46.869,46.869,0,0,1,10.073-14.941,46.869,46.869,0,0,1,14.941-10.073A46.7,46.7,0,0,1-11986-16123a46.7,46.7,0,0,1,18.294,3.693,46.872,46.872,0,0,1,14.939,10.073,46.864,46.864,0,0,1,10.071,14.941A46.689,46.689,0,0,1-11939-16076a46.689,46.689,0,0,1-3.693,18.294,46.871,46.871,0,0,1-10.071,14.94,46.856,46.856,0,0,1-14.939,10.071A46.689,46.689,0,0,1-11986-16029Zm-4.034-45.308a12.917,12.917,0,0,0-9.831,4.836,16.519,16.519,0,0,0-3.95,10.54,2.967,2.967,0,0,0,.64,1.918,2.452,2.452,0,0,0,1.905.842h.089c.04,0,.081,0,.121,0l30.117-1.59h.007a2.756,2.756,0,0,0,2.749-2.756,13.7,13.7,0,0,0-4.037-9.747,13.69,13.69,0,0,0-9.745-4.039Zm4.03-25.366a10.193,10.193,0,0,0-10.181,10.181,10.191,10.191,0,0,0,10.181,10.177,10.111,10.111,0,0,0,7.2-2.981,10.1,10.1,0,0,0,2.981-7.2,10.111,10.111,0,0,0-2.981-7.2A10.111,10.111,0,0,0-11986-16099.674Z" transform="translate(12033.001 16123.001)" fill="#354b64"/>
3
- </svg>
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="94" height="94.001" viewBox="0 0 94 94.001">
2
- <path id="Exclusion_4" data-name="Exclusion 4" d="M-11986-16029a46.689,46.689,0,0,1-18.294-3.693,46.864,46.864,0,0,1-14.941-10.071,46.871,46.871,0,0,1-10.073-14.94A46.7,46.7,0,0,1-12033-16076a46.7,46.7,0,0,1,3.693-18.294,46.869,46.869,0,0,1,10.073-14.941,46.869,46.869,0,0,1,14.941-10.073A46.7,46.7,0,0,1-11986-16123a46.7,46.7,0,0,1,18.294,3.693,46.872,46.872,0,0,1,14.939,10.073,46.864,46.864,0,0,1,10.071,14.941A46.689,46.689,0,0,1-11939-16076a46.689,46.689,0,0,1-3.693,18.294,46.871,46.871,0,0,1-10.071,14.94,46.856,46.856,0,0,1-14.939,10.071A46.689,46.689,0,0,1-11986-16029Zm-13.426-64.429a3.971,3.971,0,0,0-2.828,1.172,4.005,4.005,0,0,0,0,5.657l10.233,10.229-10.233,10.229a4.006,4.006,0,0,0,0,5.656,3.977,3.977,0,0,0,2.828,1.174,3.974,3.974,0,0,0,2.828-1.174l10.229-10.229,10.229,10.225a3.971,3.971,0,0,0,2.828,1.172,3.971,3.971,0,0,0,2.828-1.172,3.971,3.971,0,0,0,1.172-2.828,3.971,3.971,0,0,0-1.172-2.828l-10.229-10.226,10.229-10.225a3.972,3.972,0,0,0,1.172-2.829,3.971,3.971,0,0,0-1.172-2.828,3.976,3.976,0,0,0-2.828-1.171,3.976,3.976,0,0,0-2.828,1.171l-10.229,10.226-10.229-10.229A3.968,3.968,0,0,0-11999.425-16093.429Z" transform="translate(12033.001 16123.001)" fill="#477ef6"/>
3
- </svg>
@@ -1,3 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="94" height="94.001" viewBox="0 0 94 94.001">
2
- <path id="Exclusion_2" data-name="Exclusion 2" d="M-11986-16029a46.689,46.689,0,0,1-18.294-3.693,46.864,46.864,0,0,1-14.941-10.071,46.871,46.871,0,0,1-10.073-14.94A46.7,46.7,0,0,1-12033-16076a46.7,46.7,0,0,1,3.693-18.294,46.869,46.869,0,0,1,10.073-14.941,46.869,46.869,0,0,1,14.941-10.073A46.7,46.7,0,0,1-11986-16123a46.7,46.7,0,0,1,18.294,3.693,46.872,46.872,0,0,1,14.939,10.073,46.864,46.864,0,0,1,10.071,14.941A46.689,46.689,0,0,1-11939-16076a46.689,46.689,0,0,1-3.693,18.294,46.871,46.871,0,0,1-10.071,14.94,46.856,46.856,0,0,1-14.939,10.071A46.689,46.689,0,0,1-11986-16029Zm-13.426-64.429a3.971,3.971,0,0,0-2.828,1.172,4.005,4.005,0,0,0,0,5.657l10.233,10.229-10.233,10.229a4.006,4.006,0,0,0,0,5.656,3.977,3.977,0,0,0,2.828,1.174,3.974,3.974,0,0,0,2.828-1.174l10.229-10.229,10.229,10.225a3.971,3.971,0,0,0,2.828,1.172,3.971,3.971,0,0,0,2.828-1.172,3.971,3.971,0,0,0,1.172-2.828,3.971,3.971,0,0,0-1.172-2.828l-10.229-10.226,10.229-10.225a3.972,3.972,0,0,0,1.172-2.829,3.971,3.971,0,0,0-1.172-2.828,3.976,3.976,0,0,0-2.828-1.171,3.976,3.976,0,0,0-2.828,1.171l-10.229,10.226-10.229-10.229A3.968,3.968,0,0,0-11999.425-16093.429Z" transform="translate(12033.001 16123.001)" fill="#354b64"/>
3
- </svg>
@@ -1,67 +0,0 @@
1
- <template>
2
- <div class="toggle-button-container">
3
-
4
- <button :type="type"
5
- :class="['toggle-login-button', { 'toggle-login-button--airship': platform == 'airship' }]" @click="click">
6
-
7
- <div :class="['toggle-login-button-loader', { 'toggle-login-button-loader--airship': platform == 'airship' }]"
8
- v-if="loading"></div>
9
-
10
- <div class="toggle-login-button-text" v-else>
11
- {{ buttonText }}
12
- </div>
13
-
14
- </button>
15
-
16
- </div>
17
- </template>
18
-
19
- <script>
20
-
21
- export default {
22
- name: 'ButtonLogin',
23
- props: {
24
- /**
25
- * The test to display in side the button
26
- */
27
- buttonText: {
28
- type: String,
29
- default: "Let's go!"
30
- },
31
- /**
32
- * The HTML button type i.e. `submit` or `button`
33
- */
34
- type: {
35
- type: String,
36
- default: "submit"
37
- },
38
- /**
39
- * Is the button in a loading state?
40
- */
41
- loading: {
42
- type: Boolean,
43
- default: false
44
- },
45
- /**
46
- * Is the button being used on toggle or airship? use `toggle` or `airship`
47
- */
48
- platform: {
49
- type: String,
50
- default: "toggle",
51
- validator: function (value) {
52
- return ['toggle', 'airship'].indexOf(value) !== -1;
53
- },
54
- }
55
- },
56
- methods: {
57
- click() {
58
- /**
59
- * Emitted when the button is clicked.
60
- * @event click
61
- * @type {Event}
62
- */
63
- this.$emit('click');
64
- }
65
- }
66
- }
67
- </script>