@times-components/ts-components 1.145.1-cfea81c4084e6f91221ea00fec9fc730d5b933cb.4 → 1.145.1-e871182934034874ea6a75e1e684090e5504df44.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 (136) hide show
  1. package/dist/components/travel-mini-cta/index.d.ts +3 -0
  2. package/dist/components/travel-mini-cta/index.js +86 -0
  3. package/dist/components/travel-mini-cta/styles.d.ts +42 -0
  4. package/dist/components/travel-mini-cta/styles.js +273 -0
  5. package/dist/components/travel-mini-cta/travel-mini-cta.stories.d.ts +110 -0
  6. package/dist/components/travel-mini-cta/travel-mini-cta.stories.js +121 -0
  7. package/dist/components/travel-mini-cta/types.d.ts +10 -0
  8. package/dist/components/{trip-cards → travel-mini-cta}/types.js +1 -1
  9. package/dist/index.d.ts +1 -1
  10. package/dist/index.js +2 -2
  11. package/dist/utils/applyDarkMode.d.ts +1 -0
  12. package/dist/utils/applyDarkMode.js +12 -0
  13. package/dist/utils/getMediaQuery.d.ts +11 -0
  14. package/dist/utils/getMediaQuery.js +19 -0
  15. package/dist/utils/index.d.ts +2 -0
  16. package/dist/utils/index.js +3 -0
  17. package/package.json +3 -3
  18. package/rnw.js +1 -1
  19. package/src/components/travel-mini-cta/index.tsx +164 -0
  20. package/src/components/travel-mini-cta/styles.ts +336 -0
  21. package/src/components/travel-mini-cta/travel-mini-cta.stories.tsx +157 -0
  22. package/src/components/travel-mini-cta/types.ts +10 -0
  23. package/src/index.ts +1 -2
  24. package/src/utils/applyDarkMode.ts +12 -0
  25. package/src/utils/getMediaQuery.ts +25 -0
  26. package/src/utils/index.ts +2 -0
  27. package/dist/components/carousel-component/CarouselComponent.stories.d.ts +0 -1
  28. package/dist/components/carousel-component/CarouselComponent.stories.js +0 -146
  29. package/dist/components/carousel-component/CarouselItem.d.ts +0 -3
  30. package/dist/components/carousel-component/CarouselItem.js +0 -11
  31. package/dist/components/carousel-component/DefaultNavigationArrow.d.ts +0 -8
  32. package/dist/components/carousel-component/DefaultNavigationArrow.js +0 -6
  33. package/dist/components/carousel-component/DefaultPageDot.d.ts +0 -8
  34. package/dist/components/carousel-component/DefaultPageDot.js +0 -4
  35. package/dist/components/carousel-component/__tests__/CarouselComponent.test.d.ts +0 -1
  36. package/dist/components/carousel-component/__tests__/CarouselComponent.test.js +0 -163
  37. package/dist/components/carousel-component/__tests__/CarouselItem.test.d.ts +0 -1
  38. package/dist/components/carousel-component/__tests__/CarouselItem.test.js +0 -80
  39. package/dist/components/carousel-component/__tests__/DefaultNavigationArrow.test.d.ts +0 -1
  40. package/dist/components/carousel-component/__tests__/DefaultNavigationArrow.test.js +0 -62
  41. package/dist/components/carousel-component/__tests__/DefaultPageDot.test.d.ts +0 -1
  42. package/dist/components/carousel-component/__tests__/DefaultPageDot.test.js +0 -68
  43. package/dist/components/carousel-component/hooks/__tests__/useCarousel.test.d.ts +0 -1
  44. package/dist/components/carousel-component/hooks/__tests__/useCarousel.test.js +0 -314
  45. package/dist/components/carousel-component/hooks/useCarousel.d.ts +0 -2
  46. package/dist/components/carousel-component/hooks/useCarousel.js +0 -140
  47. package/dist/components/carousel-component/index.d.ts +0 -4
  48. package/dist/components/carousel-component/index.js +0 -20
  49. package/dist/components/carousel-component/styles.d.ts +0 -30
  50. package/dist/components/carousel-component/styles.js +0 -120
  51. package/dist/components/carousel-component/types.d.ts +0 -46
  52. package/dist/components/carousel-component/types.js +0 -2
  53. package/dist/components/trip-cards/SkeletonCard.d.ts +0 -2
  54. package/dist/components/trip-cards/SkeletonCard.js +0 -21
  55. package/dist/components/trip-cards/TripCard.d.ts +0 -3
  56. package/dist/components/trip-cards/TripCard.js +0 -47
  57. package/dist/components/trip-cards/TripCards.stories.d.ts +0 -1
  58. package/dist/components/trip-cards/TripCards.stories.js +0 -40
  59. package/dist/components/trip-cards/TripCardsLayout.d.ts +0 -3
  60. package/dist/components/trip-cards/TripCardsLayout.js +0 -26
  61. package/dist/components/trip-cards/__tests__/SkeletonCard.test.d.ts +0 -1
  62. package/dist/components/trip-cards/__tests__/SkeletonCard.test.js +0 -139
  63. package/dist/components/trip-cards/__tests__/TripCard.test.d.ts +0 -1
  64. package/dist/components/trip-cards/__tests__/TripCard.test.js +0 -95
  65. package/dist/components/trip-cards/__tests__/TripCardsLayout.test.d.ts +0 -1
  66. package/dist/components/trip-cards/__tests__/TripCardsLayout.test.js +0 -277
  67. package/dist/components/trip-cards/__tests__/assets.test.d.ts +0 -1
  68. package/dist/components/trip-cards/__tests__/assets.test.js +0 -165
  69. package/dist/components/trip-cards/__tests__/helpers.test.d.ts +0 -1
  70. package/dist/components/trip-cards/__tests__/helpers.test.js +0 -135
  71. package/dist/components/trip-cards/__tests__/index.test.d.ts +0 -1
  72. package/dist/components/trip-cards/__tests__/index.test.js +0 -437
  73. package/dist/components/trip-cards/__tests__/mockData.test.d.ts +0 -1
  74. package/dist/components/trip-cards/__tests__/mockData.test.js +0 -57
  75. package/dist/components/trip-cards/__tests__/skeletonStyles.test.d.ts +0 -1
  76. package/dist/components/trip-cards/__tests__/skeletonStyles.test.js +0 -194
  77. package/dist/components/trip-cards/assets/BoatIcon.d.ts +0 -1
  78. package/dist/components/trip-cards/assets/BoatIcon.js +0 -4
  79. package/dist/components/trip-cards/assets/CalendarIcon.d.ts +0 -1
  80. package/dist/components/trip-cards/assets/CalendarIcon.js +0 -4
  81. package/dist/components/trip-cards/assets/ChevronRightIcon.d.ts +0 -1
  82. package/dist/components/trip-cards/assets/ChevronRightIcon.js +0 -4
  83. package/dist/components/trip-cards/assets/LocationIcon.d.ts +0 -1
  84. package/dist/components/trip-cards/assets/LocationIcon.js +0 -4
  85. package/dist/components/trip-cards/assets/MoonIcon.d.ts +0 -1
  86. package/dist/components/trip-cards/assets/MoonIcon.js +0 -4
  87. package/dist/components/trip-cards/assets/index.d.ts +0 -6
  88. package/dist/components/trip-cards/assets/index.js +0 -7
  89. package/dist/components/trip-cards/helpers.d.ts +0 -4
  90. package/dist/components/trip-cards/helpers.js +0 -74
  91. package/dist/components/trip-cards/index.d.ts +0 -4
  92. package/dist/components/trip-cards/index.js +0 -70
  93. package/dist/components/trip-cards/mockData.d.ts +0 -3
  94. package/dist/components/trip-cards/mockData.js +0 -323
  95. package/dist/components/trip-cards/skeletonStyles.d.ts +0 -9
  96. package/dist/components/trip-cards/skeletonStyles.js +0 -37
  97. package/dist/components/trip-cards/styles.d.ts +0 -39
  98. package/dist/components/trip-cards/styles.js +0 -387
  99. package/dist/components/trip-cards/types.d.ts +0 -87
  100. package/src/components/carousel-component/CarouselComponent.stories.tsx +0 -220
  101. package/src/components/carousel-component/CarouselItem.tsx +0 -20
  102. package/src/components/carousel-component/DefaultNavigationArrow.tsx +0 -37
  103. package/src/components/carousel-component/DefaultPageDot.tsx +0 -20
  104. package/src/components/carousel-component/__tests__/CarouselComponent.test.tsx +0 -259
  105. package/src/components/carousel-component/__tests__/CarouselItem.test.tsx +0 -140
  106. package/src/components/carousel-component/__tests__/DefaultNavigationArrow.test.tsx +0 -153
  107. package/src/components/carousel-component/__tests__/DefaultPageDot.test.tsx +0 -105
  108. package/src/components/carousel-component/hooks/__tests__/useCarousel.test.ts +0 -438
  109. package/src/components/carousel-component/hooks/useCarousel.ts +0 -187
  110. package/src/components/carousel-component/index.tsx +0 -88
  111. package/src/components/carousel-component/styles.ts +0 -140
  112. package/src/components/carousel-component/types.ts +0 -51
  113. package/src/components/trip-cards/SkeletonCard.tsx +0 -54
  114. package/src/components/trip-cards/TripCard.tsx +0 -135
  115. package/src/components/trip-cards/TripCards.stories.tsx +0 -67
  116. package/src/components/trip-cards/TripCardsLayout.tsx +0 -75
  117. package/src/components/trip-cards/__tests__/SkeletonCard.test.tsx +0 -169
  118. package/src/components/trip-cards/__tests__/TripCard.test.tsx +0 -120
  119. package/src/components/trip-cards/__tests__/TripCardsLayout.test.tsx +0 -532
  120. package/src/components/trip-cards/__tests__/assets.test.tsx +0 -206
  121. package/src/components/trip-cards/__tests__/helpers.test.ts +0 -165
  122. package/src/components/trip-cards/__tests__/index.test.tsx +0 -499
  123. package/src/components/trip-cards/__tests__/mockData.test.ts +0 -67
  124. package/src/components/trip-cards/__tests__/skeletonStyles.test.tsx +0 -256
  125. package/src/components/trip-cards/assets/BoatIcon.tsx +0 -17
  126. package/src/components/trip-cards/assets/CalendarIcon.tsx +0 -17
  127. package/src/components/trip-cards/assets/ChevronRightIcon.tsx +0 -20
  128. package/src/components/trip-cards/assets/LocationIcon.tsx +0 -17
  129. package/src/components/trip-cards/assets/MoonIcon.tsx +0 -17
  130. package/src/components/trip-cards/assets/index.ts +0 -7
  131. package/src/components/trip-cards/helpers.ts +0 -99
  132. package/src/components/trip-cards/index.tsx +0 -104
  133. package/src/components/trip-cards/mockData.ts +0 -351
  134. package/src/components/trip-cards/skeletonStyles.ts +0 -46
  135. package/src/components/trip-cards/styles.ts +0 -426
  136. package/src/components/trip-cards/types.ts +0 -91
@@ -1,351 +0,0 @@
1
- import { TripCardApiData, ApiCruiseResult } from './types';
2
- import { transformApiResult } from './helpers';
3
-
4
- export const mockApiResults: ApiCruiseResult[] = [
5
- {
6
- post_id: 34246,
7
- cruise_id: 2074350,
8
- cruise_title: 'Mediterranean from Barcelona',
9
- cruise_line: {
10
- name: 'MSC Cruises',
11
- link:
12
- 'https://www.staging-thetimes.com/holidays/cruise-lines/msc-cruises/',
13
- logo:
14
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/MSC.png'
15
- },
16
- ship: {
17
- name: 'MSC Seaside',
18
- link: 'https://www.staging-thetimes.com/holidays/ships/msc-seaside/',
19
- image:
20
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/1595507284-scaled-1024x683.jpg'
21
- },
22
- departs: '2025-10-21',
23
- ends: '2025-10-28',
24
- date_label: 'Oct 21 - Oct 28, 2025',
25
- destination: ['Mediterranean'],
26
- duration: 7,
27
- itinerary: [
28
- 'Barcelona',
29
- 'La Goulette',
30
- 'Palermo (Monreale), Italy',
31
- 'Naples (Pompeii), Italy',
32
- 'Livorno(Florence), Italy',
33
- 'Marseille (Provence), France'
34
- ],
35
- prices: {
36
- cheapest_price: 2000,
37
- inside: 'Enquire now',
38
- outside: 'Enquire now',
39
- balcony: '2000',
40
- suite: 'Enquire now'
41
- },
42
- was_prices: {
43
- cheapest_price: 2500,
44
- inside: 0,
45
- outside: 0,
46
- balcony: 2500,
47
- suite: 0
48
- },
49
- link:
50
- 'https://www.staging-thetimes.com/holidays/cruises/mediterranean-from-barcelona-msc-seaside-2025-10-21/',
51
- campaigns: [],
52
- extras: {
53
- date: 'Oct 2025 - Oct 2025',
54
- duration: 'Seven Days',
55
- destination: 'Mediterranean',
56
- info: 'Seven nights onboard a four-star ship'
57
- }
58
- },
59
- {
60
- post_id: 37835,
61
- cruise_id: 2140335,
62
- cruise_title: 'Mediterranean from Genoa',
63
- cruise_line: {
64
- name: 'MSC Cruises',
65
- link:
66
- 'https://www.staging-thetimes.com/holidays/cruise-lines/msc-cruises/',
67
- logo:
68
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/MSC.png'
69
- },
70
- ship: {
71
- name: 'MSC Poesia',
72
- link: 'https://www.staging-thetimes.com/holidays/ships/msc-poesia/',
73
- image:
74
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/1595507127-scaled-1024x518.jpg'
75
- },
76
- departs: '2025-10-21',
77
- ends: '2025-10-25',
78
- date_label: 'Oct 21 - Oct 25, 2025',
79
- destination: ['Mediterranean'],
80
- duration: 4,
81
- itinerary: [
82
- 'Genoa (Portofino), Italy',
83
- 'Barcelona',
84
- 'Marseille (Provence), France'
85
- ],
86
- prices: {
87
- cheapest_price: 0,
88
- inside: 'Enquire now',
89
- outside: 'Enquire now',
90
- balcony: 'Enquire now',
91
- suite: 'Enquire now'
92
- },
93
- was_prices: {
94
- cheapest_price: 0,
95
- inside: 0,
96
- outside: 0,
97
- balcony: 0,
98
- suite: 0
99
- },
100
- link:
101
- 'https://www.staging-thetimes.com/holidays/cruises/mediterranean-from-genoa-msc-poesia-2025-10-21/',
102
- campaigns: [],
103
- extras: {
104
- date: 'Oct 2025 - Oct 2025',
105
- duration: 'Four Days',
106
- destination: 'Mediterranean',
107
- info: 'Four nights onboard a four-star ship'
108
- }
109
- },
110
- {
111
- post_id: 41162,
112
- cruise_id: 2177685,
113
- cruise_title: 'MSC Grand Voyages from Barcelona',
114
- cruise_line: {
115
- name: 'MSC Cruises',
116
- link:
117
- 'https://www.staging-thetimes.com/holidays/cruise-lines/msc-cruises/',
118
- logo:
119
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/MSC.png'
120
- },
121
- ship: {
122
- name: 'MSC Euribia',
123
- link: 'https://www.staging-thetimes.com/holidays/ships/msc-euribia/',
124
- image:
125
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/1650819843-1024x579.jpg'
126
- },
127
- departs: '2025-10-21',
128
- ends: '2025-11-12',
129
- date_label: 'Oct 21 - Nov 12, 2025',
130
- destination: [
131
- 'Mediterranean',
132
- 'Iberian Peninsula',
133
- 'Dubai & Emirates',
134
- 'Egypt & Red Sea'
135
- ],
136
- duration: 22,
137
- itinerary: [
138
- 'Barcelona',
139
- 'Marseille (Provence), France',
140
- 'Civitavecchia (Rome), Italy',
141
- 'Alexandria',
142
- 'Suez Canal Transit',
143
- 'Aqaba',
144
- 'Muscat',
145
- 'Doha, Qatar',
146
- 'Dubai',
147
- 'Bahrain',
148
- 'Abu Dhabi'
149
- ],
150
- prices: {
151
- cheapest_price: 0,
152
- inside: 'Enquire now',
153
- outside: 'Enquire now',
154
- balcony: 'Enquire now',
155
- suite: 'Enquire now'
156
- },
157
- was_prices: {
158
- cheapest_price: 0,
159
- inside: 0,
160
- outside: 0,
161
- balcony: 0,
162
- suite: 0
163
- },
164
- link:
165
- 'https://www.staging-thetimes.com/holidays/cruises/msc-grand-voyages-from-barcelona-msc-euribia-2025-10-21/',
166
- campaigns: [],
167
- extras: {
168
- date: 'Oct 2025 - Nov 2025',
169
- duration: 'Twenty-two Days',
170
- destination:
171
- 'Mediterranean, Iberian Peninsula, Dubai & Emirates, Egypt & Red Sea',
172
- info: 'Twenty-two nights onboard a five-star ship'
173
- }
174
- },
175
- {
176
- post_id: 34246,
177
- cruise_id: 2074351,
178
- cruise_title: 'Mediterranean from Barcelona',
179
- cruise_line: {
180
- name: 'MSC Cruises',
181
- link:
182
- 'https://www.staging-thetimes.com/holidays/cruise-lines/msc-cruises/',
183
- logo:
184
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/MSC.png'
185
- },
186
- ship: {
187
- name: 'MSC Seaside',
188
- link: 'https://www.staging-thetimes.com/holidays/ships/msc-seaside/',
189
- image:
190
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/1595507284-scaled-1024x683.jpg'
191
- },
192
- departs: '2025-10-21',
193
- ends: '2025-10-28',
194
- date_label: 'Oct 21 - Oct 28, 2025',
195
- destination: ['Mediterranean'],
196
- duration: 7,
197
- itinerary: [
198
- 'Barcelona',
199
- 'La Goulette',
200
- 'Palermo (Monreale), Italy',
201
- 'Naples (Pompeii), Italy',
202
- 'Livorno(Florence), Italy',
203
- 'Marseille (Provence), France'
204
- ],
205
- prices: {
206
- cheapest_price: 4550,
207
- inside: 'Enquire now',
208
- outside: 'Enquire now',
209
- balcony: '4550',
210
- suite: 'Enquire now'
211
- },
212
- was_prices: {
213
- cheapest_price: 0,
214
- inside: 0,
215
- outside: 0,
216
- balcony: 0,
217
- suite: 0
218
- },
219
- link:
220
- 'https://www.staging-thetimes.com/holidays/cruises/mediterranean-from-barcelona-msc-seaside-2025-10-21/',
221
- campaigns: [],
222
- extras: {
223
- date: 'Oct 2025 - Oct 2025',
224
- duration: 'Seven Days',
225
- destination: 'Mediterranean',
226
- info: 'Seven nights onboard a four-star ship'
227
- }
228
- },
229
- {
230
- post_id: 37835,
231
- cruise_id: 2140336,
232
- cruise_title: 'Mediterranean from Genoa',
233
- cruise_line: {
234
- name: 'MSC Cruises',
235
- link:
236
- 'https://www.staging-thetimes.com/holidays/cruise-lines/msc-cruises/',
237
- logo:
238
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/MSC.png'
239
- },
240
- ship: {
241
- name: 'MSC Poesia',
242
- link: 'https://www.staging-thetimes.com/holidays/ships/msc-poesia/',
243
- image:
244
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/1595507127-scaled-1024x518.jpg'
245
- },
246
- departs: '2025-10-21',
247
- ends: '2025-10-25',
248
- date_label: 'Oct 21 - Oct 25, 2025',
249
- destination: ['Mediterranean'],
250
- duration: 4,
251
- itinerary: [
252
- 'Genoa (Portofino), Italy',
253
- 'Barcelona',
254
- 'Marseille (Provence), France'
255
- ],
256
- prices: {
257
- cheapest_price: 0,
258
- inside: 'Enquire now',
259
- outside: 'Enquire now',
260
- balcony: 'Enquire now',
261
- suite: 'Enquire now'
262
- },
263
- was_prices: {
264
- cheapest_price: 0,
265
- inside: 0,
266
- outside: 0,
267
- balcony: 0,
268
- suite: 0
269
- },
270
- link:
271
- 'https://www.staging-thetimes.com/holidays/cruises/mediterranean-from-genoa-msc-poesia-2025-10-21/',
272
- campaigns: [],
273
- extras: {
274
- date: 'Oct 2025 - Oct 2025',
275
- duration: 'Four Days',
276
- destination: 'Mediterranean',
277
- info: 'Four nights onboard a four-star ship'
278
- }
279
- },
280
- {
281
- post_id: 41162,
282
- cruise_id: 2177686,
283
- cruise_title: 'MSC Grand Voyages from Barcelona',
284
- cruise_line: {
285
- name: 'MSC Cruises',
286
- link:
287
- 'https://www.staging-thetimes.com/holidays/cruise-lines/msc-cruises/',
288
- logo:
289
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/MSC.png'
290
- },
291
- ship: {
292
- name: 'MSC Euribia',
293
- link: 'https://www.staging-thetimes.com/holidays/ships/msc-euribia/',
294
- image:
295
- 'https://www.staging-thetimes.com/holidays/wp-content/uploads/2025/05/1650819843-1024x579.jpg'
296
- },
297
- departs: '2025-10-21',
298
- ends: '2025-11-12',
299
- date_label: 'Oct 21 - Nov 12, 2025',
300
- destination: [
301
- 'Mediterranean',
302
- 'Iberian Peninsula',
303
- 'Dubai & Emirates',
304
- 'Egypt & Red Sea'
305
- ],
306
- duration: 22,
307
- itinerary: [
308
- 'Barcelona',
309
- 'Marseille (Provence), France',
310
- 'Civitavecchia (Rome), Italy',
311
- 'Alexandria',
312
- 'Suez Canal Transit',
313
- 'Aqaba',
314
- 'Muscat',
315
- 'Doha, Qatar',
316
- 'Dubai',
317
- 'Bahrain',
318
- 'Abu Dhabi'
319
- ],
320
- prices: {
321
- cheapest_price: 0,
322
- inside: 'Enquire now',
323
- outside: 'Enquire now',
324
- balcony: 'Enquire now',
325
- suite: 'Enquire now'
326
- },
327
- was_prices: {
328
- cheapest_price: 0,
329
- inside: 0,
330
- outside: 0,
331
- balcony: 0,
332
- suite: 0
333
- },
334
- link:
335
- 'https://www.staging-thetimes.com/holidays/cruises/msc-grand-voyages-from-barcelona-msc-euribia-2025-10-21/',
336
- campaigns: [],
337
- extras: {
338
- date: 'Oct 2025 - Nov 2025',
339
- duration: 'Twenty-two Days',
340
- destination:
341
- 'Mediterranean, Iberian Peninsula, Dubai & Emirates, Egypt & Red Sea',
342
- info: 'Twenty-two nights onboard a five-star ship'
343
- }
344
- }
345
- ];
346
-
347
- // Get mock data already transformed
348
- export const getMockTripCards = (count?: number): TripCardApiData[] => {
349
- const allCards = mockApiResults.map(transformApiResult);
350
- return count ? allCards.slice(0, count) : allCards;
351
- };
@@ -1,46 +0,0 @@
1
- import styled, { css } from 'styled-components';
2
- import { CTAButton } from './styles';
3
-
4
- const skeletonBase = css`
5
- background: linear-gradient(
6
- to right,
7
- #f0f0f0 0%,
8
- #f5f2f2 20%,
9
- #f0f0f0 40%,
10
- #f0f0f0 100%
11
- );
12
- background-size: 800px 104px;
13
- `;
14
-
15
- interface SkeletonLineProps {
16
- width?: string;
17
- marginBottom?: string;
18
- }
19
-
20
- export const SkeletonLine = styled.div<SkeletonLineProps>`
21
- ${skeletonBase} height: 16px;
22
- width: ${props => props.width || '100%'};
23
- margin-bottom: ${props => props.marginBottom || '0'};
24
- `;
25
-
26
- export const SkeletonHeadline = styled.div`
27
- ${skeletonBase} height: 48px;
28
- width: 100%;
29
- margin-bottom: 16px;
30
- `;
31
-
32
- export const SkeletonPrice = styled.div`
33
- ${skeletonBase} height: 28px;
34
- width: 120px;
35
- `;
36
-
37
- export const SkeletonButton = styled(CTAButton)`
38
- ${skeletonBase} height: 48px;
39
- width: 100%;
40
- pointer-events: none;
41
- border: none;
42
-
43
- &:hover {
44
- transform: none;
45
- }
46
- `;