sesame-components-testing 2.0.1 → 2.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 (55) hide show
  1. package/dist/Button/Button.d.ts +14 -0
  2. package/dist/Button/Button.js +22 -0
  3. package/dist/Button/Button.styles.d.ts +10 -0
  4. package/{src/Button/Button.styles.ts → dist/Button/Button.styles.js} +30 -53
  5. package/dist/Common/FlexCenter.d.ts +4 -0
  6. package/dist/Common/FlexCenter.js +12 -0
  7. package/dist/SesameComponent.d.ts +5 -0
  8. package/dist/SesameComponent.js +17 -0
  9. package/dist/index.js +7 -0
  10. package/dist/theme/ThemeProvider.d.ts +7 -0
  11. package/dist/theme/ThemeProvider.js +19 -0
  12. package/dist/theme/colors/darkColors.d.ts +2 -0
  13. package/dist/theme/colors/darkColors.js +224 -0
  14. package/dist/theme/colors/lightColors.d.ts +2 -0
  15. package/dist/theme/colors/lightColors.js +224 -0
  16. package/dist/theme/colors/primitiveColors.d.ts +19 -0
  17. package/dist/theme/colors/primitiveColors.js +259 -0
  18. package/dist/theme/extendTheme.d.ts +2 -0
  19. package/dist/theme/extendTheme.js +23 -0
  20. package/{src/theme/index.ts → dist/theme/index.d.ts} +2 -4
  21. package/dist/theme/index.js +22 -0
  22. package/dist/theme/sizes/breakpoints.d.ts +2 -0
  23. package/dist/theme/sizes/breakpoints.js +732 -0
  24. package/dist/theme/sizes/dpiToRem.d.ts +2 -0
  25. package/dist/theme/sizes/dpiToRem.js +9 -0
  26. package/dist/theme/sizes/getSizedTheme.d.ts +3 -0
  27. package/dist/theme/sizes/getSizedTheme.js +8 -0
  28. package/dist/theme/theme.d.ts +7 -0
  29. package/dist/theme/theme.js +32 -0
  30. package/dist/theme/types.d.ts +169 -0
  31. package/dist/theme/types.js +2 -0
  32. package/dist/theme/useBreakpointSize.d.ts +3 -0
  33. package/dist/theme/useBreakpointSize.js +35 -0
  34. package/package.json +7 -12
  35. package/src/Button/Button.tsx +0 -37
  36. package/src/Common/FlexCenter.tsx +0 -7
  37. package/src/SesameComponent.tsx +0 -16
  38. package/src/theme/ThemeProvider.tsx +0 -23
  39. package/src/theme/colors/darkColors.ts +0 -223
  40. package/src/theme/colors/lightColors.ts +0 -223
  41. package/src/theme/colors/primitiveColors.ts +0 -297
  42. package/src/theme/extendTheme.ts +0 -26
  43. package/src/theme/reset.css +0 -21
  44. package/src/theme/sizes/breakpoints.ts +0 -751
  45. package/src/theme/sizes/dpiToRem.ts +0 -8
  46. package/src/theme/sizes/getSizedTheme.ts +0 -8
  47. package/src/theme/theme.ts +0 -32
  48. package/src/theme/types.ts +0 -205
  49. package/src/theme/useBreakpointSize.ts +0 -38
  50. package/tsconfig.json +0 -13
  51. package/vite-env.d.ts +0 -8
  52. package/vite.config.ts +0 -55
  53. package/vitest.config.ts +0 -76
  54. package/vitest.shims.d.ts +0 -1
  55. /package/{src/index.ts → dist/index.d.ts} +0 -0
package/src/theme/sizes/breakpoints.ts DELETED
@@ -1,751 +0,0 @@
1
- import type { Breakpoints } from '../types';
2
- import { dpiToRem } from './dpiToRem';
3
-
4
- export const breakpoints: Breakpoints = {
5
- // Large >=1600px w
6
- large: {
7
- typography: {
8
- fontWeight: {
9
- regular: 400,
10
- medium: 500,
11
- semibold: 600,
12
- bold: 700,
13
- },
14
- title: {
15
- size: {
16
- '2xs': dpiToRem(10),
17
- xs: dpiToRem(12),
18
- s: dpiToRem(14),
19
- m: dpiToRem(16),
20
- l: dpiToRem(20),
21
- xl: dpiToRem(24),
22
- '2xl': dpiToRem(32),
23
- },
24
- lineHeight: {
25
- '2xs': dpiToRem(10),
26
- xs: dpiToRem(12),
27
- s: dpiToRem(16),
28
- m: dpiToRem(18),
29
- l: dpiToRem(24),
30
- xl: dpiToRem(28),
31
- '2xl': dpiToRem(36),
32
- },
33
- },
34
- body: {
35
- size: {
36
- '2xs': dpiToRem(10),
37
- xs: dpiToRem(12),
38
- s: dpiToRem(14),
39
- m: dpiToRem(16),
40
- l: dpiToRem(18),
41
- xl: dpiToRem(20),
42
- '2xl': dpiToRem(24),
43
- '3xl': dpiToRem(32),
44
- },
45
- lineHeight: {
46
- '2xs': dpiToRem(12),
47
- xs: dpiToRem(16),
48
- s: dpiToRem(18),
49
- m: dpiToRem(20),
50
- l: dpiToRem(24),
51
- xl: dpiToRem(28),
52
- '2xl': dpiToRem(32),
53
- '3xl': dpiToRem(36),
54
- },
55
- },
56
- label: {
57
- size: {
58
- '2xs': dpiToRem(10),
59
- xs: dpiToRem(12),
60
- s: dpiToRem(14),
61
- m: dpiToRem(16),
62
- l: dpiToRem(18),
63
- xl: dpiToRem(20),
64
- },
65
- lineHeight: {
66
- '2xs': dpiToRem(12),
67
- xs: dpiToRem(14),
68
- s: dpiToRem(16),
69
- m: dpiToRem(18),
70
- l: dpiToRem(20),
71
- xl: dpiToRem(24),
72
- },
73
- },
74
- },
75
-
76
- space: {
77
- zero: dpiToRem(0),
78
- '3xs': dpiToRem(2),
79
- '2xs': dpiToRem(4),
80
- xs: dpiToRem(5),
81
- s: dpiToRem(8),
82
- m: dpiToRem(12),
83
- l: dpiToRem(16),
84
- xl: dpiToRem(20),
85
- '2xl': dpiToRem(24),
86
- '3xl': dpiToRem(32),
87
- '4xl': dpiToRem(40),
88
- '5xl': dpiToRem(48),
89
- },
90
-
91
- border: {
92
- zero: dpiToRem(0),
93
- s: dpiToRem(1),
94
- m: dpiToRem(2),
95
- l: dpiToRem(4),
96
- xl: dpiToRem(6),
97
- '2xl': dpiToRem(8),
98
- },
99
-
100
- radii: {
101
- '0': dpiToRem(0),
102
- '2xs': dpiToRem(4),
103
- xs: dpiToRem(8),
104
- s: dpiToRem(12),
105
- m: dpiToRem(16),
106
- l: dpiToRem(20),
107
- xl: dpiToRem(24),
108
- '2xl': dpiToRem(32),
109
- full: dpiToRem(100),
110
- },
111
-
112
- icon: {
113
- '4xs': dpiToRem(12),
114
- '3xs': dpiToRem(16),
115
- '2xs': dpiToRem(20),
116
- xs: dpiToRem(24),
117
- s: dpiToRem(28),
118
- m: dpiToRem(36),
119
- l: dpiToRem(40),
120
- xl: dpiToRem(48),
121
- '2xl': dpiToRem(56),
122
- '3xl': dpiToRem(64),
123
- },
124
-
125
- height: {
126
- button: {
127
- posButton: {
128
- l: { min: dpiToRem(68), fixed: dpiToRem(68), max: dpiToRem(68) },
129
- m: { min: dpiToRem(60), fixed: dpiToRem(60), max: dpiToRem(60) },
130
- s: { fixed: dpiToRem(52), min: dpiToRem(52), max: dpiToRem(52) },
131
- },
132
- keypadButton: {
133
- l: { fixed: dpiToRem(88) },
134
- },
135
- },
136
- badge: {
137
- xl: { fixed: dpiToRem(36) },
138
- l: { fixed: dpiToRem(32) },
139
- m: { fixed: dpiToRem(28) },
140
- s: { fixed: dpiToRem(24) },
141
- xs: { fixed: dpiToRem(22) },
142
- },
143
- image: {
144
- l: dpiToRem(96),
145
- m: dpiToRem(80),
146
- },
147
- input: {
148
- fixed: dpiToRem(56),
149
- },
150
- keypad: {
151
- panel: {
152
- fixed: dpiToRem(320),
153
- },
154
- },
155
- list: {
156
- listItemCart: {
157
- caret: {
158
- fixed: dpiToRem(40),
159
- },
160
- },
161
- },
162
- page: {
163
- pos: {
164
- standard: dpiToRem(1080),
165
- },
166
- },
167
- selection: {
168
- checkbox: { fixed: dpiToRem(32) },
169
- radio: { fixed: dpiToRem(32) },
170
- },
171
- tile: {
172
- customizationTile: {
173
- multiAddContent: {
174
- fixed: dpiToRem(24),
175
- },
176
- default: {
177
- fixed: dpiToRem(70),
178
- },
179
- },
180
- selectionTile: {
181
- fixed: dpiToRem(70),
182
- },
183
- menuTile: {
184
- default: {
185
- fixed: dpiToRem(96),
186
- },
187
- mealContent: {
188
- fixed: dpiToRem(48),
189
- },
190
- meal: {
191
- fixed: dpiToRem(128),
192
- },
193
- },
194
- },
195
- toggle: {
196
- container: { fixed: dpiToRem(40) },
197
- handle: { fixed: dpiToRem(30) },
198
- },
199
- },
200
-
201
- width: {
202
- button: {
203
- posButton: {
204
- l: { min: dpiToRem(60) },
205
- },
206
- keypadButton: {
207
- l: { fixed: dpiToRem(88) },
208
- },
209
- },
210
- list: {
211
- listItemCart: {
212
- caret: {
213
- fixed: dpiToRem(12),
214
- },
215
- },
216
- },
217
- modal: {
218
- fixed: dpiToRem(600),
219
- },
220
- page: {
221
- pos: {
222
- standard: dpiToRem(1920),
223
- },
224
- },
225
- panel: {
226
- l: { fixed: dpiToRem(420) },
227
- m: { fixed: dpiToRem(340) },
228
- },
229
- sidebar: {
230
- fixed: dpiToRem(96),
231
- },
232
- tile: {
233
- customizationTile: {
234
- imageContainer: dpiToRem(76),
235
- },
236
- menuTile: {
237
- imageContainer: dpiToRem(76),
238
- },
239
- },
240
- toggle: {
241
- container: { fixed: dpiToRem(80) },
242
- },
243
- },
244
- },
245
-
246
- // Medium 1100px - 1599px w
247
- medium: {
248
- typography: {
249
- fontWeight: {
250
- regular: 400,
251
- medium: 500,
252
- semibold: 600,
253
- bold: 700,
254
- },
255
- title: {
256
- size: {
257
- '2xs': dpiToRem(6),
258
- xs: dpiToRem(8),
259
- s: dpiToRem(10),
260
- m: dpiToRem(12),
261
- l: dpiToRem(14),
262
- xl: dpiToRem(18),
263
- '2xl': dpiToRem(24),
264
- },
265
- lineHeight: {
266
- '2xs': dpiToRem(8),
267
- xs: dpiToRem(10),
268
- s: dpiToRem(12),
269
- m: dpiToRem(14),
270
- l: dpiToRem(18),
271
- xl: dpiToRem(20),
272
- '2xl': dpiToRem(32),
273
- },
274
- },
275
- body: {
276
- size: {
277
- '2xs': dpiToRem(6),
278
- xs: dpiToRem(8),
279
- s: dpiToRem(10),
280
- m: dpiToRem(12),
281
- l: dpiToRem(14),
282
- xl: dpiToRem(18),
283
- '2xl': dpiToRem(20),
284
- '3xl': dpiToRem(24),
285
- },
286
- lineHeight: {
287
- '2xs': dpiToRem(10),
288
- xs: dpiToRem(12),
289
- s: dpiToRem(14),
290
- m: dpiToRem(16),
291
- l: dpiToRem(16),
292
- xl: dpiToRem(24),
293
- '2xl': dpiToRem(28),
294
- '3xl': dpiToRem(32),
295
- },
296
- },
297
- label: {
298
- size: {
299
- '2xs': dpiToRem(6),
300
- xs: dpiToRem(8),
301
- s: dpiToRem(10),
302
- m: dpiToRem(12),
303
- l: dpiToRem(14),
304
- xl: dpiToRem(16),
305
- },
306
- lineHeight: {
307
- '2xs': dpiToRem(8),
308
- xs: dpiToRem(10),
309
- s: dpiToRem(14),
310
- m: dpiToRem(14),
311
- l: dpiToRem(16),
312
- xl: dpiToRem(20),
313
- },
314
- },
315
- },
316
-
317
- space: {
318
- zero: dpiToRem(0),
319
- '3xs': dpiToRem(2),
320
- '2xs': dpiToRem(2),
321
- xs: dpiToRem(3),
322
- s: dpiToRem(6),
323
- m: dpiToRem(8),
324
- l: dpiToRem(12),
325
- xl: dpiToRem(16),
326
- '2xl': dpiToRem(18),
327
- '3xl': dpiToRem(20),
328
- '4xl': dpiToRem(32),
329
- '5xl': dpiToRem(40),
330
- },
331
-
332
- border: {
333
- zero: dpiToRem(0),
334
- s: dpiToRem(1),
335
- m: dpiToRem(1.5),
336
- l: dpiToRem(2),
337
- xl: dpiToRem(4),
338
- '2xl': dpiToRem(6),
339
- },
340
-
341
- radii: {
342
- '0': dpiToRem(0),
343
- '2xs': dpiToRem(2),
344
- xs: dpiToRem(6),
345
- s: dpiToRem(10),
346
- m: dpiToRem(14),
347
- l: dpiToRem(16),
348
- xl: dpiToRem(20),
349
- '2xl': dpiToRem(28),
350
- full: dpiToRem(100),
351
- },
352
-
353
- icon: {
354
- '4xs': dpiToRem(10),
355
- '3xs': dpiToRem(12),
356
- '2xs': dpiToRem(16),
357
- xs: dpiToRem(20),
358
- s: dpiToRem(20),
359
- m: dpiToRem(24),
360
- l: dpiToRem(28),
361
- xl: dpiToRem(40),
362
- '2xl': dpiToRem(48),
363
- '3xl': dpiToRem(52),
364
- },
365
-
366
- height: {
367
- button: {
368
- posButton: {
369
- l: {
370
- min: dpiToRem(48),
371
- fixed: dpiToRem(48),
372
- max: dpiToRem(48),
373
- },
374
- m: {
375
- min: dpiToRem(40),
376
- fixed: dpiToRem(40),
377
- max: dpiToRem(40),
378
- },
379
- s: {
380
- fixed: dpiToRem(36),
381
- min: dpiToRem(36),
382
- max: dpiToRem(36),
383
- },
384
- },
385
- keypadButton: {
386
- l: { fixed: dpiToRem(64) },
387
- },
388
- },
389
- badge: {
390
- xl: { fixed: dpiToRem(32) },
391
- l: { fixed: dpiToRem(24) },
392
- m: { fixed: dpiToRem(20) },
393
- s: { fixed: dpiToRem(18) },
394
- xs: { fixed: dpiToRem(16) },
395
- },
396
- image: {
397
- l: dpiToRem(68),
398
- m: dpiToRem(56),
399
- },
400
- input: {
401
- fixed: dpiToRem(40),
402
- },
403
- keypad: {
404
- panel: {
405
- fixed: dpiToRem(228),
406
- },
407
- },
408
- list: {
409
- listItemCart: {
410
- caret: {
411
- fixed: dpiToRem(32),
412
- },
413
- },
414
- },
415
- page: {
416
- pos: {
417
- standard: dpiToRem(768),
418
- },
419
- },
420
- selection: {
421
- checkbox: { fixed: dpiToRem(24) },
422
- radio: { fixed: dpiToRem(24) },
423
- },
424
- tile: {
425
- customizationTile: {
426
- multiAddContent: {
427
- fixed: dpiToRem(16),
428
- },
429
- default: {
430
- fixed: dpiToRem(48),
431
- },
432
- },
433
- selectionTile: {
434
- fixed: dpiToRem(40),
435
- },
436
- menuTile: {
437
- default: {
438
- fixed: dpiToRem(68),
439
- },
440
- mealContent: {
441
- fixed: dpiToRem(32),
442
- },
443
- meal: {
444
- fixed: dpiToRem(90),
445
- },
446
- },
447
- },
448
- toggle: {
449
- container: { fixed: dpiToRem(28) },
450
- handle: { fixed: dpiToRem(22) },
451
- },
452
- },
453
-
454
- width: {
455
- button: {
456
- posButton: {
457
- l: { min: dpiToRem(40) },
458
- },
459
- keypadButton: {
460
- l: { fixed: dpiToRem(64) },
461
- },
462
- },
463
- list: {
464
- listItemCart: {
465
- caret: {
466
- fixed: dpiToRem(12),
467
- },
468
- },
469
- },
470
- modal: {
471
- fixed: dpiToRem(460),
472
- },
473
- page: {
474
- pos: {
475
- standard: dpiToRem(1366),
476
- },
477
- },
478
- panel: {
479
- l: { fixed: dpiToRem(300) },
480
- m: { fixed: dpiToRem(240) },
481
- },
482
- sidebar: {
483
- fixed: dpiToRem(68),
484
- },
485
- tile: {
486
- customizationTile: {
487
- imageContainer: dpiToRem(52),
488
- },
489
- menuTile: {
490
- imageContainer: dpiToRem(52),
491
- },
492
- },
493
- toggle: {
494
- container: { fixed: dpiToRem(56) },
495
- },
496
- },
497
- },
498
-
499
- // Small 900px - 1099px w
500
- small: {
501
- typography: {
502
- fontWeight: {
503
- regular: 400,
504
- medium: 500,
505
- semibold: 600,
506
- bold: 700,
507
- },
508
- title: {
509
- size: {
510
- '2xs': dpiToRem(4),
511
- xs: dpiToRem(6),
512
- s: dpiToRem(8),
513
- m: dpiToRem(10),
514
- l: dpiToRem(12),
515
- xl: dpiToRem(14),
516
- '2xl': dpiToRem(16),
517
- },
518
- lineHeight: {
519
- '2xs': dpiToRem(8),
520
- xs: dpiToRem(10),
521
- s: dpiToRem(12),
522
- m: dpiToRem(14),
523
- l: dpiToRem(16),
524
- xl: dpiToRem(18),
525
- '2xl': dpiToRem(24),
526
- },
527
- },
528
- body: {
529
- size: {
530
- '2xs': dpiToRem(4),
531
- xs: dpiToRem(6),
532
- s: dpiToRem(8),
533
- m: dpiToRem(10),
534
- l: dpiToRem(12),
535
- xl: dpiToRem(14),
536
- '2xl': dpiToRem(18),
537
- '3xl': dpiToRem(20),
538
- },
539
- lineHeight: {
540
- '2xs': dpiToRem(6),
541
- xs: dpiToRem(8),
542
- s: dpiToRem(10),
543
- m: dpiToRem(12),
544
- l: dpiToRem(14),
545
- xl: dpiToRem(18),
546
- '2xl': dpiToRem(24),
547
- '3xl': dpiToRem(28),
548
- },
549
- },
550
- label: {
551
- size: {
552
- '2xs': dpiToRem(6),
553
- xs: dpiToRem(7),
554
- s: dpiToRem(8),
555
- m: dpiToRem(10),
556
- l: dpiToRem(12),
557
- xl: dpiToRem(14),
558
- },
559
- lineHeight: {
560
- '2xs': dpiToRem(8),
561
- xs: dpiToRem(8),
562
- s: dpiToRem(10),
563
- m: dpiToRem(12),
564
- l: dpiToRem(14),
565
- xl: dpiToRem(16),
566
- },
567
- },
568
- },
569
-
570
- space: {
571
- zero: dpiToRem(0),
572
- '3xs': dpiToRem(1),
573
- '2xs': dpiToRem(2),
574
- xs: dpiToRem(2),
575
- s: dpiToRem(4),
576
- m: dpiToRem(6),
577
- l: dpiToRem(8),
578
- xl: dpiToRem(10),
579
- '2xl': dpiToRem(12),
580
- '3xl': dpiToRem(16),
581
- '4xl': dpiToRem(28),
582
- '5xl': dpiToRem(32),
583
- },
584
-
585
- border: {
586
- zero: dpiToRem(0),
587
- s: dpiToRem(1),
588
- m: dpiToRem(1),
589
- l: dpiToRem(2),
590
- xl: dpiToRem(4),
591
- '2xl': dpiToRem(4),
592
- },
593
-
594
- radii: {
595
- '0': dpiToRem(0),
596
- '2xs': dpiToRem(2),
597
- xs: dpiToRem(4),
598
- s: dpiToRem(8),
599
- m: dpiToRem(12),
600
- l: dpiToRem(14),
601
- xl: dpiToRem(16),
602
- '2xl': dpiToRem(24),
603
- full: dpiToRem(100),
604
- },
605
-
606
- icon: {
607
- '4xs': dpiToRem(8),
608
- '3xs': dpiToRem(10),
609
- '2xs': dpiToRem(14),
610
- xs: dpiToRem(16),
611
- s: dpiToRem(18),
612
- m: dpiToRem(20),
613
- l: dpiToRem(24),
614
- xl: dpiToRem(28),
615
- '2xl': dpiToRem(32),
616
- '3xl': dpiToRem(40),
617
- },
618
-
619
- height: {
620
- button: {
621
- posButton: {
622
- l: {
623
- min: dpiToRem(40),
624
- fixed: dpiToRem(40),
625
- max: dpiToRem(40),
626
- },
627
- m: {
628
- min: dpiToRem(32),
629
- fixed: dpiToRem(32),
630
- max: dpiToRem(32),
631
- },
632
- s: {
633
- fixed: dpiToRem(28),
634
- min: dpiToRem(28),
635
- max: dpiToRem(28),
636
- },
637
- },
638
- keypadButton: {
639
- l: { fixed: dpiToRem(48) },
640
- },
641
- },
642
- badge: {
643
- xl: { fixed: dpiToRem(28) },
644
- l: { fixed: dpiToRem(18) },
645
- m: { fixed: dpiToRem(16) },
646
- s: { fixed: dpiToRem(14) },
647
- xs: { fixed: dpiToRem(12) },
648
- },
649
- image: {
650
- l: dpiToRem(52),
651
- m: dpiToRem(44),
652
- },
653
- input: {
654
- fixed: dpiToRem(32),
655
- },
656
- keypad: {
657
- panel: {
658
- fixed: dpiToRem(184),
659
- },
660
- },
661
- list: {
662
- listItemCart: {
663
- caret: {
664
- fixed: dpiToRem(28),
665
- },
666
- },
667
- },
668
- page: {
669
- pos: {
670
- standard: dpiToRem(768),
671
- },
672
- },
673
- selection: {
674
- checkbox: { fixed: dpiToRem(18) },
675
- radio: { fixed: dpiToRem(18) },
676
- },
677
- tile: {
678
- customizationTile: {
679
- multiAddContent: {
680
- fixed: dpiToRem(16),
681
- },
682
- default: {
683
- fixed: dpiToRem(40),
684
- },
685
- },
686
- selectionTile: {
687
- fixed: dpiToRem(40),
688
- },
689
- menuTile: {
690
- default: {
691
- fixed: dpiToRem(56),
692
- },
693
- mealContent: {
694
- fixed: dpiToRem(28),
695
- },
696
- meal: {
697
- fixed: dpiToRem(72),
698
- },
699
- },
700
- },
701
- toggle: {
702
- container: { fixed: dpiToRem(20) },
703
- handle: { fixed: dpiToRem(16) },
704
- },
705
- },
706
-
707
- width: {
708
- button: {
709
- posButton: {
710
- l: { min: dpiToRem(32) },
711
- },
712
- keypadButton: {
713
- l: { fixed: dpiToRem(48) },
714
- },
715
- },
716
- list: {
717
- listItemCart: {
718
- caret: {
719
- fixed: dpiToRem(10),
720
- },
721
- },
722
- },
723
- modal: {
724
- fixed: dpiToRem(384),
725
- },
726
- page: {
727
- pos: {
728
- standard: dpiToRem(1024),
729
- },
730
- },
731
- panel: {
732
- l: { fixed: dpiToRem(224) },
733
- m: { fixed: dpiToRem(184) },
734
- },
735
- sidebar: {
736
- fixed: dpiToRem(52),
737
- },
738
- tile: {
739
- customizationTile: {
740
- imageContainer: dpiToRem(40),
741
- },
742
- menuTile: {
743
- imageContainer: dpiToRem(44),
744
- },
745
- },
746
- toggle: {
747
- container: { fixed: dpiToRem(44) },
748
- },
749
- },
750
- },
751
- } as const;