@bikdotai/bik-widgets 1.0.0 → 1.0.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 (207) hide show
  1. package/dist-package/index.css +95 -0
  2. package/dist-package/index.js +2 -0
  3. package/package.json +17 -4
  4. package/.eslintrc +0 -22
  5. package/.eslintrc.js +0 -19
  6. package/.github/workflows/main.yml +0 -293
  7. package/.prettierignore +0 -13
  8. package/.prettierrc +0 -10
  9. package/cypress/apiHelper/endpoints.ts +0 -21
  10. package/cypress/apiHelper/executor.ts +0 -42
  11. package/cypress/e2e/bottomDrawer.cy.ts +0 -49
  12. package/cypress/e2e/directReward.cy.ts +0 -67
  13. package/cypress/e2e/scratchTheCard.cy.ts +0 -68
  14. package/cypress/e2e/stw.cy.ts +0 -82
  15. package/cypress/e2e/waRedirection.cy.ts +0 -46
  16. package/cypress/fixtures/payloads.ts +0 -330
  17. package/cypress/support/commands.ts +0 -37
  18. package/cypress/support/e2e.ts +0 -20
  19. package/cypress.staging.config.ts +0 -23
  20. package/jsconfig.json +0 -6
  21. package/localtest.sh +0 -10
  22. package/log-server.js +0 -86
  23. package/postcss.config.js +0 -8
  24. package/src/Globals.d.ts +0 -2
  25. package/src/assets/lottie/santa.json +0 -11722
  26. package/src/assets/svg/CalendarClockIcon.tsx +0 -30
  27. package/src/assets/svg/CalendarIcon.tsx +0 -24
  28. package/src/assets/svg/CheckIcon.tsx +0 -17
  29. package/src/assets/svg/ChevronIcon.tsx +0 -21
  30. package/src/assets/svg/Close.tsx +0 -39
  31. package/src/assets/svg/Confetti.tsx +0 -140
  32. package/src/assets/svg/Copy.tsx +0 -26
  33. package/src/assets/svg/DropdownCheckIcon.tsx +0 -35
  34. package/src/assets/svg/ErrorIcon.tsx +0 -27
  35. package/src/assets/svg/RadioIcon.tsx +0 -25
  36. package/src/assets/svg/UncheckedCheckboxIcon.tsx +0 -28
  37. package/src/assets/svg/UncheckedRadioIcon.tsx +0 -26
  38. package/src/assets/svg/info.tsx +0 -30
  39. package/src/assets/svg/qrcode.svg +0 -14
  40. package/src/bootstrap.tsx +0 -8
  41. package/src/components/CtaCard/index.tsx +0 -37
  42. package/src/components/CtaCard/preview.module.css +0 -32
  43. package/src/components/CtaCard/style.module.css +0 -32
  44. package/src/components/EmailInput/emailInputBox.tsx +0 -95
  45. package/src/components/Fab/index.tsx +0 -224
  46. package/src/components/Fab/preview.module.css +0 -28
  47. package/src/components/Fab/style.module.css +0 -37
  48. package/src/components/Icons/Call.tsx +0 -26
  49. package/src/components/Icons/Cross.tsx +0 -24
  50. package/src/components/Icons/Gmail.tsx +0 -61
  51. package/src/components/Icons/Instagram.tsx +0 -60
  52. package/src/components/Icons/LiveChat.tsx +0 -43
  53. package/src/components/Icons/Messenger.tsx +0 -57
  54. package/src/components/Icons/Send.tsx +0 -22
  55. package/src/components/Icons/Whatsapp.tsx +0 -24
  56. package/src/components/Shimmer/index.tsx +0 -12
  57. package/src/components/Shimmer/style.module.css +0 -37
  58. package/src/components/SmsInput/smsInputBox.tsx +0 -135
  59. package/src/components/UserDetailsV2/userDetailsV2.desktop.module.css +0 -52
  60. package/src/components/UserDetailsV2/userDetailsV2.mobile.module.css +0 -52
  61. package/src/components/UserDetailsV2/userDetailsV2.module.css +0 -81
  62. package/src/components/UserDetailsV2/userDetailsV2.tsx +0 -527
  63. package/src/components/WhatsappInput/Spinner.tsx +0 -26
  64. package/src/components/WhatsappInput/whatsappInput.module.css +0 -106
  65. package/src/components/WhatsappInput/whatsappInputBox.tsx +0 -155
  66. package/src/components/WhatsappInput/whatsappInputPreviewDesktop.module.css +0 -71
  67. package/src/components/WhatsappInput/whatsappInputPreviewMobile.module.css +0 -65
  68. package/src/components/checkbox/checkbox.module.css +0 -19
  69. package/src/components/checkbox/checkbox.tsx +0 -88
  70. package/src/components/countryCodePicker/countriesDropdown.module.css +0 -77
  71. package/src/components/countryCodePicker/countriesDropdown.tsx +0 -81
  72. package/src/components/couponDetails/coupon.module.css +0 -208
  73. package/src/components/couponDetails/coupon.tsx +0 -210
  74. package/src/components/couponDetails/couponPreviewDesktop.module.css +0 -158
  75. package/src/components/couponDetails/couponPreviewMobile.module.css +0 -164
  76. package/src/components/index.ts +0 -3
  77. package/src/components/inputComponents/Checkbox.module.css +0 -197
  78. package/src/components/inputComponents/Checkbox.tsx +0 -85
  79. package/src/components/inputComponents/DatePicker.module.css +0 -565
  80. package/src/components/inputComponents/DatePicker.tsx +0 -278
  81. package/src/components/inputComponents/Dropdown.module.css +0 -796
  82. package/src/components/inputComponents/Dropdown.tsx +0 -630
  83. package/src/components/inputComponents/InputBox.module.css +0 -401
  84. package/src/components/inputComponents/InputBox.tsx +0 -209
  85. package/src/components/selectedCountry/selectedCountry.module.css +0 -76
  86. package/src/components/selectedCountry/selectedCountry.tsx +0 -76
  87. package/src/components/selectedCountry/selectedCountryPreviewDesktop.module.css +0 -56
  88. package/src/components/selectedCountry/selectedCountryPreviewMobile.module.css +0 -57
  89. package/src/components/userDetailsForm/RenderCustomFields.tsx +0 -333
  90. package/src/components/userDetailsForm/userDetailsForm.tsx +0 -675
  91. package/src/hooks/index.ts +0 -4
  92. package/src/hooks/useExitIntent.ts +0 -452
  93. package/src/hooks/useIsMobile.tsx +0 -21
  94. package/src/hooks/useMessageEvent.ts +0 -8
  95. package/src/hooks/useTriggeredIntentDetails.ts +0 -43
  96. package/src/hooks/useUrlListerner.ts +0 -30
  97. package/src/hooks/useWebSocketLogger.ts +0 -59
  98. package/src/hooks/useWindowEvent.ts +0 -8
  99. package/src/icons/copyIcon.tsx +0 -26
  100. package/src/icons/crossIconDesktop.tsx +0 -20
  101. package/src/icons/crossIconMobile.tsx +0 -20
  102. package/src/index.html +0 -30
  103. package/src/index.ts +0 -32
  104. package/src/index.tsx +0 -1
  105. package/src/repo/widgetRepo.ts +0 -21
  106. package/src/types/customFields.ts +0 -73
  107. package/src/utilities/cookie.ts +0 -70
  108. package/src/utilities/customFieldTypeMapping.ts +0 -67
  109. package/src/utilities/customFieldValidation.ts +0 -201
  110. package/src/utilities/encryption.ts +0 -21
  111. package/src/utilities/exitIntentUtils.ts +0 -31
  112. package/src/utilities/global.css +0 -11
  113. package/src/utilities/languageUtilities.ts +0 -235
  114. package/src/utilities/localRunner.js +0 -26
  115. package/src/utilities/localRunner.ts +0 -27
  116. package/src/utilities/localStorage.ts +0 -40
  117. package/src/utilities/script.tsx +0 -15
  118. package/src/utilities/stringUtils.ts +0 -5
  119. package/src/utilities/styleUtils.ts +0 -134
  120. package/src/utilities/variables.ts +0 -11
  121. package/src/utilities/widgetUtils.js +0 -342
  122. package/src/utilities/widgetUtils.ts +0 -313
  123. package/src/widgets/BottomDrawer/config.ts +0 -41
  124. package/src/widgets/BottomDrawer/index.tsx +0 -116
  125. package/src/widgets/BottomDrawer/modal.tsx +0 -286
  126. package/src/widgets/BottomDrawer/preview.module.css +0 -122
  127. package/src/widgets/BottomDrawer/previewMobile.module.css +0 -124
  128. package/src/widgets/BottomDrawer/style.module.css +0 -279
  129. package/src/widgets/CaptivateBanner/captivateBanner.tsx +0 -200
  130. package/src/widgets/CaptivateBanner/config.ts +0 -72
  131. package/src/widgets/CaptivateBanner/index.tsx +0 -204
  132. package/src/widgets/CaptivateBanner/previewDesktop.module.css +0 -51
  133. package/src/widgets/CaptivateBanner/previewMobile.module.css +0 -51
  134. package/src/widgets/CaptivateBanner/style.module.css +0 -77
  135. package/src/widgets/CaptivateBanner/utils.ts +0 -104
  136. package/src/widgets/CentrallyAlignedPopup/config.ts +0 -42
  137. package/src/widgets/CentrallyAlignedPopup/index.tsx +0 -109
  138. package/src/widgets/CentrallyAlignedPopup/modal.tsx +0 -269
  139. package/src/widgets/CentrallyAlignedPopup/preview.module.css +0 -153
  140. package/src/widgets/CentrallyAlignedPopup/previewMobile.module.css +0 -153
  141. package/src/widgets/CentrallyAlignedPopup/style.module.css +0 -283
  142. package/src/widgets/DirectReward/components/couponDetails.tsx +0 -265
  143. package/src/widgets/DirectReward/components/userDetails.tsx +0 -117
  144. package/src/widgets/DirectReward/config.ts +0 -186
  145. package/src/widgets/DirectReward/directReward.tsx +0 -350
  146. package/src/widgets/DirectReward/index.tsx +0 -579
  147. package/src/widgets/DirectReward/previewStyles/thankYouPreviewDesktop.module.css +0 -276
  148. package/src/widgets/DirectReward/previewStyles/thankYouPreviewMobile.module.css +0 -303
  149. package/src/widgets/DirectReward/previewStyles/userDetailsPreviewDesktop.module.css +0 -511
  150. package/src/widgets/DirectReward/previewStyles/userDetailsPreviewMobile.module.css +0 -462
  151. package/src/widgets/DirectReward/style.module.css +0 -836
  152. package/src/widgets/ExitIntentHook.tsx +0 -28
  153. package/src/widgets/STW/api.ts +0 -70
  154. package/src/widgets/STW/components/svgFactory.tsx +0 -44
  155. package/src/widgets/STW/config.ts +0 -193
  156. package/src/widgets/STW/context.ts +0 -7
  157. package/src/widgets/STW/couponDetails.tsx +0 -121
  158. package/src/widgets/STW/index.tsx +0 -733
  159. package/src/widgets/STW/previewStyles/thankyouPreviewDesktop.module.css +0 -215
  160. package/src/widgets/STW/previewStyles/thankyouPreviewMobile.module.css +0 -205
  161. package/src/widgets/STW/previewStyles/userInputsPreviewDesktop.module.css +0 -732
  162. package/src/widgets/STW/previewStyles/userInputsPreviewMobile.module.css +0 -661
  163. package/src/widgets/STW/previewStyles/wheelPreviewDesktop.module.css +0 -498
  164. package/src/widgets/STW/previewStyles/wheelPreviewMobile.module.css +0 -497
  165. package/src/widgets/STW/stw1.tsx +0 -119
  166. package/src/widgets/STW/stw2Components/wheelDesign.tsx +0 -183
  167. package/src/widgets/STW/stw2Pages/couponDetails.tsx +0 -72
  168. package/src/widgets/STW/stw2Pages/stw2.tsx +0 -212
  169. package/src/widgets/STW/stw2Pages/style.module.css +0 -1226
  170. package/src/widgets/STW/stw2Pages/userDetails.tsx +0 -86
  171. package/src/widgets/STW/stw2Pages/wheel.tsx +0 -117
  172. package/src/widgets/STW/stw2PreviewStyles/thankyouPreviewDesktop.module.css +0 -835
  173. package/src/widgets/STW/stw2PreviewStyles/thankyouPreviewMobile.module.css +0 -787
  174. package/src/widgets/STW/stw2PreviewStyles/userInputsPreviewDesktop.module.css +0 -867
  175. package/src/widgets/STW/stw2PreviewStyles/userInputsPreviewMobile.module.css +0 -798
  176. package/src/widgets/STW/stw2PreviewStyles/wheelPreviewDesktop.module.css +0 -572
  177. package/src/widgets/STW/stw2PreviewStyles/wheelPreviewMobile.module.css +0 -559
  178. package/src/widgets/STW/style.module.css +0 -901
  179. package/src/widgets/STW/userDetails.tsx +0 -150
  180. package/src/widgets/STW/utility.ts +0 -664
  181. package/src/widgets/STW/wheel.tsx +0 -304
  182. package/src/widgets/ScratchCard/ScratchOff/scratchOff.tsx +0 -157
  183. package/src/widgets/ScratchCard/config.ts +0 -152
  184. package/src/widgets/ScratchCard/globalStyle.module.css +0 -931
  185. package/src/widgets/ScratchCard/index.tsx +0 -546
  186. package/src/widgets/ScratchCard/modal.tsx +0 -225
  187. package/src/widgets/ScratchCard/preview.module.css +0 -250
  188. package/src/widgets/ScratchCard/previewMobile.module.css +0 -247
  189. package/src/widgets/ScratchCard/previewStyles/userDetailsPreviewDesktop.module.css +0 -537
  190. package/src/widgets/ScratchCard/previewStyles/userDetailsPreviewMobile.module.css +0 -463
  191. package/src/widgets/ScratchCard/style.module.css +0 -220
  192. package/src/widgets/ShopifyForm/config.ts +0 -168
  193. package/src/widgets/ShopifyForm/index.tsx +0 -214
  194. package/src/widgets/ShopifyForm/previewDesktop.module.css +0 -117
  195. package/src/widgets/ShopifyForm/previewMobile.module.css +0 -131
  196. package/src/widgets/ShopifyForm/shopifyForm.tsx +0 -445
  197. package/src/widgets/ShopifyForm/style.module.css +0 -161
  198. package/src/widgets/SingleButtonRedirection/config.ts +0 -47
  199. package/src/widgets/SingleButtonRedirection/index.tsx +0 -121
  200. package/src/widgets/WebStories/config.ts +0 -105
  201. package/src/widgets/WebStories/index.css +0 -3
  202. package/src/widgets/WebStories/index.tsx +0 -282
  203. package/src/widgets/WebStories/style.module.css +0 -26
  204. package/src/widgets/index.tsx +0 -3
  205. package/src/widgets/utility.ts +0 -31
  206. package/tsconfig.json +0 -12
  207. package/webpack.config.js +0 -239
@@ -1,1226 +0,0 @@
1
- body.bik-overflow-hidden {
2
- overflow: hidden;
3
- }
4
-
5
- .spinOverlay {
6
- width: 100%;
7
- height: 100%;
8
- position: fixed;
9
- top: 0;
10
- left: 0;
11
- background-color: rgba(0, 0, 0, 0.5);
12
- z-index: 9999999999999;
13
- display: none;
14
- }
15
-
16
- .userDetailsTitleWrapper {
17
- display: flex;
18
- justify-content: center;
19
- text-align: center;
20
- font-family: inherit;
21
- line-height: 32px;
22
- }
23
-
24
- .bikSpinOverlay {
25
- width: 100%;
26
- height: 100%;
27
- position: fixed;
28
- top: 0;
29
- left: 0;
30
- background-color: rgba(0, 0, 0, 0.5);
31
- display: block !important;
32
- z-index: 9999999999999;
33
- }
34
-
35
- .closeBtnWrapper {
36
- width: 100%;
37
- display: flex;
38
- justify-content: flex-end;
39
- align-items: center;
40
- }
41
-
42
- #spinLogoImage {
43
- height: 42px;
44
- width: 42px;
45
- }
46
-
47
- .closeBtn {
48
- width: 32px;
49
- height: 32px;
50
- border-radius: 50%;
51
- background-color: #fff;
52
- margin-bottom: 10px;
53
- display: flex;
54
- justify-content: center;
55
- align-items: center;
56
- cursor: pointer;
57
- }
58
-
59
- #phone-field:focus-visible {
60
- box-shadow: unset;
61
- }
62
-
63
- .closeBtn svg {
64
- width: 24px;
65
- height: 24px;
66
- }
67
-
68
- .mainWrapper {
69
- position: fixed;
70
- transform: translate(-50%, -50%);
71
- top: 50%;
72
- left: 50%;
73
- width: 61%;
74
- max-width: 750px;
75
- min-height: calc(54% + 32px + 28px);
76
- z-index: 999999999999999;
77
- }
78
-
79
- .wrapper {
80
- width: 100%;
81
- height: calc(100% - 32px - 28px);
82
- background-color: #ffffff;
83
- display: flex;
84
- overflow: hidden;
85
- border-radius: 8px;
86
- padding: 20px 0px 0px 0px;
87
- box-shadow: 0 4em 5em rgba(27, 8, 53, 0.2);
88
- flex-direction: row;
89
- align-items: center;
90
- position: relative;
91
- }
92
-
93
- .bikWrapper {
94
- padding-left: 60px;
95
- font-family: inherit;
96
- display: flex;
97
- flex-direction: column;
98
- justify-content: center;
99
- align-items: center;
100
- width: 100%;
101
- }
102
-
103
- #header {
104
- font-family: 'Inter';
105
- font-style: normal;
106
- font-weight: 600;
107
- font-size: 28px;
108
- line-height: 40px;
109
- text-align: center;
110
- font-feature-settings:
111
- 'tnum' on,
112
- 'lnum' on,
113
- 'case' on,
114
- 'ss04' on;
115
- color: #212121;
116
- margin: 0;
117
- }
118
-
119
- #subheader {
120
- font-feature-settings:
121
- 'tnum' on,
122
- 'lnum' on,
123
- 'case' on,
124
- 'ss04' on;
125
- color: #616161;
126
- text-align: center;
127
- margin: 0;
128
- margin-bottom: 24px;
129
- margin-top: 8px;
130
- }
131
-
132
- #header p,
133
- #subheader p {
134
- font-family: inherit;
135
- }
136
-
137
- .poweredBy {
138
- text-align: center;
139
- font-weight: 400;
140
- font-size: 12px;
141
- line-height: 16px;
142
- color: #9e9e9e;
143
- margin-bottom: 20px;
144
- font-family: 'Inter';
145
- display: flex;
146
- align-items: center;
147
- justify-content: flex-end;
148
- width: 100%;
149
- padding-top: 20px;
150
- padding-right: 20px;
151
- }
152
-
153
- .poweredBy svg {
154
- stroke: none !important;
155
- fill: none !important;
156
- height: unset !important;
157
- width: unset !important;
158
- }
159
-
160
- .poweredBy a {
161
- text-decoration: none;
162
- color: #9e9e9e;
163
- margin-right: 6px;
164
- }
165
-
166
- .spinTopAligned {
167
- position: absolute;
168
- top: -18%;
169
- height: 400px;
170
- width: 400px;
171
- }
172
-
173
- .containerPadding {
174
- /* padding-top: 316px; */
175
- }
176
-
177
- #userDetails {
178
- width: 100%;
179
- padding-left: 40px;
180
- padding-right: 40px;
181
- font-family: inherit;
182
- }
183
-
184
- #inputWrapper {
185
- width: 100%;
186
- display: flex;
187
- flex-direction: column;
188
- font-family: inherit;
189
- }
190
-
191
- #inputWrapper input {
192
- border: none;
193
- outline: none;
194
- padding: 12px 24px;
195
- background: #ffffff;
196
- border: 1px solid #e0e0e0;
197
- border-radius: 4px;
198
- width: 100%;
199
- font-family: inherit;
200
- height: 48px;
201
- box-shadow: none;
202
- }
203
-
204
- #errorWrapper {
205
- margin: 0;
206
- color: #b92321;
207
- font-weight: 400;
208
- font-size: 12px;
209
- line-height: 16px;
210
- margin-top: 8px;
211
- font-family: inherit;
212
- }
213
-
214
- #bikayiBtn {
215
- position: relative;
216
- border: none;
217
- padding: 14px 0;
218
- background: #731dcf;
219
- border-radius: 8px;
220
- outline: none;
221
- width: 100%;
222
- color: #fff;
223
- font-weight: 600;
224
- font-size: 16px;
225
- line-height: 20px;
226
- margin-top: 24px;
227
- cursor: pointer;
228
- height: 48px;
229
- font-family: inherit;
230
- display: flex;
231
- justify-content: center;
232
- align-items: center;
233
- }
234
-
235
- #footerLastPage {
236
- width: 405px;
237
- font-family: inherit;
238
- }
239
-
240
- .bikEmailInputMain {
241
- display: block;
242
- margin: 12px 0;
243
- font-family: inherit;
244
- }
245
-
246
- #discountCodeDetails {
247
- display: flex;
248
- flex-direction: column;
249
- align-items: center;
250
- padding: 16px;
251
- gap: 8px;
252
- width: 100%;
253
- height: 100px;
254
- background: #e6f4e7;
255
- border: 1px dashed #1a872c;
256
- border-radius: 4px;
257
- font-family: inherit;
258
- }
259
-
260
- #discountCouponName {
261
- text-align: center;
262
- color: #212121;
263
- font-family: inherit;
264
- }
265
-
266
- #discountCouponDetail {
267
- text-align: center;
268
- color: #616161;
269
- font-family: inherit;
270
- }
271
-
272
- .font14 {
273
- font-size: 14px;
274
- line-height: 20px;
275
- }
276
-
277
- .font16 {
278
- font-size: 16px;
279
- line-height: 24px;
280
- }
281
-
282
- .fontWeight400 {
283
- font-weight: 400;
284
- }
285
-
286
- .fontWeight600 {
287
- font-weight: 600;
288
- }
289
-
290
- #wheel {
291
- height: 100%;
292
- width: 100%;
293
- top: 0;
294
- padding: 0;
295
- border-radius: 50%;
296
- box-shadow: 0px 5.75051px 51.7546px rgb(0 0 0 / 24%);
297
- border: 21px solid #fff;
298
- }
299
-
300
- .top58 {
301
- top: 58%;
302
- }
303
-
304
- .top55 {
305
- top: -55px;
306
- }
307
-
308
- @keyframes rotate {
309
- 100% {
310
- transform: rotate(360deg);
311
- }
312
- }
313
-
314
- #spinBtn {
315
- position: absolute;
316
- transform: translate(-50%, -50%);
317
- top: 50%;
318
- left: 50%;
319
- border: 10px solid #fff !important;
320
- width: 23%;
321
- height: 23%;
322
- border-radius: 50%;
323
- cursor: pointer;
324
- border: 0;
325
- background: #fbbb18;
326
- color: #664006;
327
- text-transform: uppercase;
328
- font-family: 'Poppins';
329
- font-style: normal;
330
- font-weight: 700;
331
- font-size: 24px;
332
- line-height: 35px;
333
- text-align: center;
334
- }
335
-
336
- .widgetCTAHide {
337
- display: none !important;
338
- }
339
-
340
- .widgetCTAShow {
341
- display: flex !important;
342
- }
343
-
344
- #spinWidgetCTA {
345
- width: 70px;
346
- height: 70px;
347
- border-radius: 50%;
348
- background: #fce49b;
349
- display: flex;
350
- justify-content: center;
351
- align-items: center;
352
- position: fixed;
353
- bottom: 24px;
354
- left: 24px;
355
- z-index: 9999;
356
- cursor: pointer;
357
- box-shadow:
358
- rgba(50, 50, 93, 0.25) 0px 13px 27px -5px,
359
- rgba(0, 0, 0, 0.3) 0px 8px 16px -8px;
360
- opacity: 1;
361
- animation: pulse 0.7s ease-in forwards;
362
- }
363
-
364
- #spinWidgetCTA svg {
365
- fill: #fff;
366
- }
367
-
368
- #bikFooter2 {
369
- display: block;
370
- padding-bottom: 16px;
371
- padding-right: 40px;
372
- padding-left: 60px;
373
- width: 100%;
374
- }
375
-
376
- #bikFooter2 p {
377
- font-family: inherit;
378
- }
379
-
380
- .bikStw2WaCheckboxContainer {
381
- display: flex;
382
- flex-direction: row;
383
- gap: 8px;
384
- margin-bottom: 12px;
385
- }
386
-
387
- .bikStw2WaCheckboxContainer h2 {
388
- margin-bottom: 0;
389
- color: #616161;
390
- }
391
-
392
- .bikStw2CountryCodeContainer {
393
- gap: 8px;
394
- display: flex;
395
- align-items: center;
396
- flex-direction: row;
397
- font-family: inherit;
398
- }
399
-
400
- #bikFooter2 > h1 {
401
- font-family: inherit;
402
- font-style: normal;
403
- font-weight: 600;
404
- font-size: 28px;
405
- line-height: 40px;
406
- text-align: center;
407
- font-feature-settings:
408
- 'tnum' on,
409
- 'lnum' on,
410
- 'case' on,
411
- 'ss04' on;
412
- color: #212121;
413
- }
414
-
415
- #bikFooter2 > h2 {
416
- font-family: inherit;
417
- font-style: normal;
418
- font-weight: 400;
419
- font-size: 14px;
420
- line-height: 16px;
421
- text-align: center;
422
- font-feature-settings:
423
- 'tnum' on,
424
- 'lnum' on,
425
- 'case' on,
426
- 'ss04' on;
427
- color: #212121;
428
- margin-top: 8px;
429
- margin-bottom: 24px;
430
- }
431
-
432
- .bikStw2H2 {
433
- font-family: inherit;
434
- font-style: normal;
435
- font-weight: 400;
436
- font-size: 14px;
437
- line-height: 20px;
438
- font-feature-settings:
439
- 'tnum' on,
440
- 'lnum' on,
441
- 'case' on,
442
- 'ss04' on;
443
- color: #212121;
444
- margin-bottom: 8px;
445
- }
446
-
447
- .bikStw2PhoneInputRow {
448
- display: flex;
449
- flex-direction: row;
450
- margin-top: 24px;
451
- width: 100%;
452
- font-family: inherit;
453
- }
454
-
455
- .bikStw2PhoneInputRow > div {
456
- font-family: inherit;
457
- }
458
-
459
- .bikStw2CountryCodePicker {
460
- font-family: inherit;
461
- height: 48px;
462
- border-radius: 4px;
463
- margin-top: 8px;
464
- border-width: 1px;
465
- border-style: solid;
466
- background-color: #fff;
467
- align-items: center;
468
- border-color: #e0e0e0;
469
- padding: 12px 8px;
470
- gap: 8px;
471
- display: flex;
472
- flex-direction: row;
473
- }
474
-
475
- .bikStw2CountryCodePicker h2 {
476
- margin-bottom: 0;
477
- }
478
-
479
- .bikStw2DownArrow {
480
- width: 0;
481
- height: 0;
482
- border-left: 5px solid transparent;
483
- border-right: 5px solid transparent;
484
- border-top: 7px solid #616161;
485
- font-size: 0;
486
- line-height: 0;
487
- float: left;
488
- display: block !important;
489
- }
490
-
491
- .bikStw2CountryFlag {
492
- width: 24px;
493
- height: 24px;
494
- }
495
-
496
- .bikStw2PhoneInput {
497
- margin-left: 16px;
498
- flex: 2;
499
- font-family: inherit;
500
- }
501
-
502
- #bikStw2OptPhone {
503
- display: none;
504
- margin: 12px 0;
505
- }
506
-
507
- #bikStw2OptWa {
508
- display: none;
509
- margin: 12px 0;
510
- }
511
-
512
- #bikStw2OptEmail {
513
- display: none;
514
- margin: 12px 0;
515
- }
516
-
517
- #bikStw2MandWa {
518
- display: none;
519
- margin: 12px 0;
520
- }
521
-
522
- #bikStw2MandEmail {
523
- display: none;
524
- margin: 12px 0;
525
- }
526
-
527
- #bikStw2MandPhone {
528
- display: none;
529
- margin: 12px 0;
530
- }
531
-
532
- #bikStw2WaCheckboxLayout {
533
- display: none;
534
- }
535
-
536
- #bikStw2PhoneCheckboxLayout {
537
- display: none;
538
- }
539
-
540
- input::-webkit-outer-spin-button,
541
- input::-webkit-inner-spin-button {
542
- -webkit-appearance: none;
543
- margin: 0;
544
- }
545
-
546
- /* Firefox */
547
- input[type='number'] {
548
- -moz-appearance: textfield;
549
- }
550
-
551
- @keyframes pulse {
552
- 0% {
553
- opacity: 0;
554
- }
555
-
556
- 100% {
557
- opacity: 1;
558
- }
559
- }
560
-
561
- .bikContainerSpinner {
562
- position: relative;
563
- height: 400px;
564
- width: 400px;
565
- border-radius: 50%;
566
- /* margin: 50px auto; */
567
- display: flex;
568
- align-items: center;
569
- justify-content: center;
570
- overflow: hidden;
571
- pointer-events: none;
572
- box-shadow: 0px 5.75051px 51.7546px rgba(0, 0, 0, 0.24);
573
- }
574
-
575
- .containerInner {
576
- position: relative;
577
- height: 100%;
578
- width: 100%;
579
- display: flex;
580
- align-items: center;
581
- justify-content: center;
582
- }
583
-
584
- .containerOverlay {
585
- height: 100%;
586
- width: 100%;
587
- border-radius: 50%;
588
- border: 19px solid #474747;
589
- filter: drop-shadow(-11px 13px 2px rgba(0, 0, 0, 0.12));
590
- box-shadow:
591
- inset 5px 5px 25px 0px #00000010,
592
- inset -5px -5px 25px 0 #00000010;
593
- z-index: 13;
594
- position: relative;
595
- display: block !important;
596
- }
597
-
598
- .segment {
599
- position: absolute;
600
- clip-path: polygon(100% 0, 0 0, 50% 100%);
601
- height: 180px;
602
- width: 300px;
603
- bottom: 50%;
604
- transform-origin: bottom center;
605
- display: flex;
606
- align-items: flex-start;
607
- justify-content: center;
608
- pointer-events: none;
609
- padding-top: 27px;
610
- }
611
-
612
- .bikCardContent {
613
- align-content: space-between;
614
- width: 63%;
615
- padding: 0 40px 0 20px;
616
- flex-direction: column;
617
- position: absolute;
618
- right: 11px;
619
- top: 30%;
620
- display: flex;
621
- }
622
-
623
- .couponText {
624
- text-align: center;
625
- width: 50%;
626
- font-size: 14px;
627
- }
628
-
629
- .spinOuterContainer {
630
- position: absolute;
631
- display: flex;
632
- align-items: center;
633
- justify-content: center;
634
- height: 150px;
635
- border-radius: 75px;
636
- width: 150px;
637
- background: rgba(0, 0, 0, 0.05);
638
- }
639
-
640
- #outerContainer {
641
- margin-left: -189px;
642
- }
643
-
644
- #bikCta {
645
- font-family: 'Inter';
646
- font-weight: 400;
647
- color: #9e9e9e;
648
- font-size: 14px;
649
- line-height: 20px;
650
- margin-left: auto;
651
- display: flex;
652
- align-items: center;
653
- }
654
-
655
- #bikCta a {
656
- text-decoration: none;
657
- color: #9e9e9e;
658
- margin-right: 8px;
659
- }
660
-
661
- #bikCta svg {
662
- stroke: none !important;
663
- fill: none !important;
664
- height: unset !important;
665
- width: unset !important;
666
- }
667
-
668
- #bikCtaContainer {
669
- position: absolute;
670
- bottom: 12px;
671
- right: 12px;
672
- width: 100%;
673
- display: flex;
674
- justify-content: flex-end;
675
- }
676
-
677
- .containerSpin {
678
- position: absolute;
679
- display: flex;
680
- align-items: center;
681
- justify-content: center;
682
- }
683
-
684
- .bikSpinArrow {
685
- position: absolute;
686
- display: block !important;
687
- left: 161px;
688
- z-index: 14;
689
- transform: rotate(90deg);
690
- border-top: 60px;
691
- border-left: 30px solid transparent;
692
- border-right: 30px solid transparent;
693
- border-bottom: 0;
694
- border-top: 60px solid #ff6e45;
695
- filter: drop-shadow(2px -5px 1px rgba(0, 0, 0, 0.12));
696
- }
697
-
698
- .spinOverlay {
699
- width: 218.28px;
700
- height: 218.28px;
701
- border-radius: 100px;
702
- background: rgba(0, 0, 0, 0.05);
703
- }
704
-
705
- .spinContent {
706
- height: 84px;
707
- width: 84px;
708
- padding-top: 8px;
709
- position: absolute;
710
- z-index: 1;
711
- border: 10px solid white;
712
- border-radius: 50%;
713
- background-color: #474747;
714
- display: flex;
715
- align-items: center;
716
- justify-content: center;
717
- box-shadow: 0px 0px 25px 1px #00000052;
718
- cursor: pointer;
719
- }
720
-
721
- .spinLogo {
722
- justify-content: center;
723
- align-items: center;
724
- }
725
-
726
- #success {
727
- width: 100%;
728
- display: none;
729
- align-items: center;
730
- justify-content: center;
731
- padding-left: 50px;
732
- }
733
-
734
- .segment.one {
735
- background-color: #a1deed;
736
- }
737
-
738
- .segment.two {
739
- background-color: #d97559;
740
- transform: rotate(60deg);
741
- }
742
-
743
- .segment.three {
744
- background-color: #fad56e;
745
- transform: rotate(120deg);
746
- }
747
-
748
- .segment.four {
749
- background-color: #a1deed;
750
- transform: rotate(180deg);
751
- }
752
-
753
- .segment.five {
754
- background-color: #d97559;
755
- transform: rotate(240deg);
756
- }
757
-
758
- .segment.six {
759
- background-color: #fad56e;
760
- transform: rotate(300deg);
761
- }
762
-
763
- .mainContainer {
764
- display: flex;
765
- justify-content: center;
766
- align-items: center;
767
- margin-bottom: 20px;
768
- }
769
-
770
- .lightContainer {
771
- width: 100px;
772
- height: 100px;
773
- top: -14px;
774
- position: absolute;
775
- left: 180px;
776
- }
777
-
778
- .lightContainer span {
779
- width: 10px;
780
- height: 10px;
781
- background: white;
782
- border-radius: 50%;
783
- position: absolute;
784
- filter: blur(1.3432299999999984px);
785
- transform: rotate(calc(var(--n) * 24deg));
786
- transform-origin: 0 196px;
787
- }
788
-
789
- #bikFooterLastPage {
790
- width: 405px;
791
- font-family: inherit;
792
- margin-bottom: 12px;
793
- }
794
-
795
- #bikDiscountCodeDetails {
796
- display: flex;
797
- flex-direction: column;
798
- align-items: center;
799
- padding: 16px;
800
- gap: 8px;
801
- width: 100%;
802
- height: 100px;
803
- background: #e6f4e7;
804
- border: 1px dashed #1a872c;
805
- border-radius: 4px;
806
- font-family: inherit;
807
- }
808
-
809
- #bikDiscountCouponName {
810
- text-align: center;
811
- color: #212121;
812
- font-family: inherit;
813
- }
814
-
815
- #bikDiscountCouponDetail {
816
- text-align: center;
817
- color: #616161;
818
- font-family: inherit;
819
- }
820
-
821
- #bikHeader {
822
- font-style: normal;
823
- font-weight: 400;
824
- font-size: 18px;
825
- line-height: 24px;
826
- text-align: center;
827
- font-feature-settings:
828
- 'tnum' on,
829
- 'lnum' on,
830
- 'case' on,
831
- 'ss04' on;
832
- color: #212121;
833
- margin: 0;
834
- font-family: inherit;
835
- }
836
-
837
- #bikSubheader {
838
- font-feature-settings:
839
- 'tnum' on,
840
- 'lnum' on,
841
- 'case' on,
842
- 'ss04' on;
843
- color: #616161;
844
- text-align: center;
845
- margin: 0;
846
- margin-bottom: 24px;
847
- margin-top: 8px;
848
- font-family: inherit;
849
- font-size: 16px;
850
- }
851
-
852
- #bikHeader p,
853
- #bikSubheader p {
854
- font-family: inherit;
855
- }
856
-
857
- #bikHeader p {
858
- font-weight: 600;
859
- }
860
-
861
- .couponName {
862
- color: #212121 !important;
863
- }
864
-
865
- .couponText {
866
- font-weight: 900;
867
- }
868
-
869
- .cliamBtn--loading::after {
870
- content: '';
871
- position: absolute;
872
- width: 28px;
873
- height: 28px;
874
- top: 0;
875
- left: 0;
876
- right: 0;
877
- bottom: 0;
878
- margin: auto;
879
- border: 4px solid transparent;
880
- border-top-color: #ffffff;
881
- border-radius: 50%;
882
- animation: button-loading-spinner 1s ease infinite;
883
- }
884
-
885
- .bikStwPhoneInputRow {
886
- display: flex;
887
- flex-direction: row;
888
- margin-top: 24px;
889
- width: 100%;
890
- font-family: inherit;
891
- }
892
-
893
- .bikStwPhoneInputRow > div {
894
- font-family: inherit;
895
- }
896
-
897
- .bikInputMain {
898
- display: flex;
899
- margin: 12px 0;
900
- }
901
-
902
- .bikStwH2 {
903
- font-family: inherit;
904
- font-style: normal;
905
- font-weight: 400;
906
- font-size: 14px;
907
- line-height: 20px;
908
- font-feature-settings:
909
- 'tnum' on,
910
- 'lnum' on,
911
- 'case' on,
912
- 'ss04' on;
913
- color: #212121;
914
- margin-bottom: 8px;
915
- }
916
-
917
- .bikStwPhoneInput {
918
- margin-left: 16px;
919
- flex: 2;
920
- font-family: inherit;
921
- }
922
-
923
- .bikInputWrapper {
924
- width: 100%;
925
- display: flex;
926
- flex-direction: column;
927
- font-family: inherit;
928
- }
929
-
930
- input.bikStwSpinInputText::-webkit-outer-spin-button,
931
- input.bikStwSpinInputText::-webkit-inner-spin-button {
932
- -webkit-appearance: none;
933
- margin: 0;
934
- }
935
-
936
- .bikInputWrapper span {
937
- font-family: inherit;
938
- }
939
-
940
- .bikInputWrapper input {
941
- border: none;
942
- outline: none;
943
- padding: 12px 24px;
944
- background: #ffffff;
945
- border: 1px solid #e0e0e0;
946
- border-radius: 4px !important;
947
- width: 100%;
948
- font-family: inherit;
949
- height: 48px;
950
- box-shadow: none;
951
- font-family: inherit;
952
- }
953
-
954
- #bikErrorWrapper {
955
- margin: 0 !important;
956
- color: #b92321;
957
- font-weight: 400 !important;
958
- font-size: 12px !important;
959
- line-height: 16px !important;
960
- margin-top: 8px !important;
961
- font-family: inherit !important;
962
- }
963
-
964
- .bikStwError {
965
- font-style: normal;
966
- font-weight: 400;
967
- font-size: 12px;
968
- line-height: 16px;
969
- color: #b92321;
970
- margin-top: 8px;
971
- display: block;
972
- }
973
-
974
- .bikStwWaCheckboxContainer {
975
- display: flex;
976
- flex-direction: row;
977
- gap: 8px;
978
- margin: 8px 0;
979
- font-family: inherit;
980
- align-items: center;
981
- }
982
-
983
- .bikStwWaCheckboxContainer h2 {
984
- margin-bottom: 0;
985
- color: #616161;
986
- font-family: inherit;
987
- margin-top: 0;
988
- }
989
-
990
- .bikStwWaCheckboxContainer a {
991
- font-family: inherit;
992
- }
993
-
994
- .loader {
995
- border: 2px solid rgba(255, 255, 255, 0.3);
996
- border-top: 2px solid #fff;
997
- border-left: 2px solid #fff;
998
- border-radius: 50%;
999
- width: 20px;
1000
- height: 20px;
1001
- display: block !important;
1002
- animation: spin 1.3s linear infinite;
1003
- }
1004
-
1005
- @keyframes spin {
1006
- 0% {
1007
- transform: rotate(0deg);
1008
- }
1009
-
1010
- 100% {
1011
- transform: rotate(360deg);
1012
- }
1013
- }
1014
-
1015
- @keyframes button-loading-spinner {
1016
- from {
1017
- transform: rotate(0turn);
1018
- }
1019
-
1020
- to {
1021
- transform: rotate(1turn);
1022
- }
1023
- }
1024
-
1025
- @media only screen and (max-width: 768px) {
1026
- #bikFooter2 > h1 {
1027
- font-size: 22px;
1028
- }
1029
-
1030
- .bik-stw2-h2 {
1031
- font-size: 12px;
1032
- }
1033
-
1034
- .segement {
1035
- height: 195px;
1036
- }
1037
-
1038
- .mainWrapper {
1039
- width: 100%;
1040
- bottom: 0;
1041
- min-height: unset;
1042
- transform: unset;
1043
- top: unset;
1044
- left: unset;
1045
- }
1046
-
1047
- .bikSpinArrow {
1048
- transform: rotate(0deg);
1049
- left: -29px;
1050
- bottom: 160px;
1051
- }
1052
-
1053
- #bikCtaContainer {
1054
- position: relative;
1055
- padding-top: 10px;
1056
- width: 100%;
1057
- display: none;
1058
- right: 0;
1059
- }
1060
-
1061
- .lightContainer {
1062
- width: 100px;
1063
- height: 100px;
1064
- top: -11px;
1065
- position: absolute;
1066
- left: 195px;
1067
- }
1068
-
1069
- .lightContainer span {
1070
- width: 8px;
1071
- height: 8px;
1072
- background: white;
1073
- border-radius: 50%;
1074
- position: absolute;
1075
- filter: blur(1.3432299999999984px);
1076
- transform: rotate(calc(var(--n) * 24deg));
1077
- transform-origin: 0 205px;
1078
- }
1079
-
1080
- .containerPadding {
1081
- padding-top: 10px;
1082
- }
1083
-
1084
- .wrapper {
1085
- position: unset;
1086
- display: flex;
1087
- flex-direction: column-reverse;
1088
- border-radius: 8px 8px 0 0;
1089
- }
1090
-
1091
- .bikContainerSpinner {
1092
- height: 413px;
1093
- width: 413px;
1094
- }
1095
-
1096
- .segment {
1097
- padding-bottom: 0;
1098
- padding-top: 50px;
1099
- height: 195px;
1100
- }
1101
-
1102
- .spinContent {
1103
- width: 76px;
1104
- height: 76px;
1105
- padding-top: 0px;
1106
- border: 7px solid white;
1107
- }
1108
-
1109
- .spinLogo {
1110
- font-size: 14px;
1111
- line-height: 15px;
1112
- font-weight: bolder;
1113
- }
1114
-
1115
- .containerOverlay {
1116
- border: 12px solid #474747;
1117
- }
1118
-
1119
- #outerContainer {
1120
- margin-left: 0px;
1121
- }
1122
-
1123
- .containerInner {
1124
- position: relative;
1125
- height: 100%;
1126
- width: 100%;
1127
- display: flex;
1128
- align-items: center;
1129
- justify-content: center;
1130
- }
1131
-
1132
- .spinArrow {
1133
- width: 19px;
1134
- height: 26px;
1135
- bottom: 159px;
1136
- left: -30px;
1137
- transform: rotate(0deg);
1138
- }
1139
-
1140
- #header {
1141
- font-weight: 600;
1142
- font-size: 16px;
1143
- line-height: 20px;
1144
- }
1145
-
1146
- #subheader {
1147
- font-weight: 400;
1148
- font-size: 12px;
1149
- line-height: 16px;
1150
- }
1151
-
1152
- .closeBtnWrapper {
1153
- /* position: absolute; */
1154
- top: -210px;
1155
- justify-content: center;
1156
- }
1157
-
1158
- .mainContainer {
1159
- top: -178px;
1160
- margin-bottom: -162px;
1161
- }
1162
-
1163
- .bikCardContent {
1164
- padding: 0 20px 25px 20px;
1165
- justify-content: center;
1166
- align-items: center;
1167
- width: 100%;
1168
- position: unset;
1169
- }
1170
-
1171
- #userDetails {
1172
- width: unset;
1173
- }
1174
-
1175
- #bikFooter2 {
1176
- padding: 0 20px;
1177
- }
1178
-
1179
- #success {
1180
- width: 100%;
1181
- display: none;
1182
- align-items: center;
1183
- justify-content: center;
1184
- padding-left: 20px;
1185
- }
1186
-
1187
- #footerLastPage {
1188
- width: unset;
1189
- padding: 0 29px 26px 0px;
1190
- }
1191
-
1192
- #discountCodeDetails {
1193
- height: unset;
1194
- margin-bottom: 0;
1195
- }
1196
-
1197
- .bikWrapper {
1198
- padding: 0 20px;
1199
- width: 100%;
1200
- }
1201
-
1202
- .footerLastPage {
1203
- width: 100%;
1204
- }
1205
-
1206
- #bikayiBtn {
1207
- /* margin-bottom: 20px; */
1208
- }
1209
-
1210
- #bikFooterLastPage {
1211
- width: 100%;
1212
- }
1213
-
1214
- #bikDiscountCodeDetails {
1215
- height: unset;
1216
- }
1217
-
1218
- .poweredBy {
1219
- justify-content: center;
1220
- padding-right: 0;
1221
- }
1222
-
1223
- .userDetailsTitleWrapper {
1224
- line-height: 24px;
1225
- }
1226
- }