@royaloperahouse/harmonic 0.2.3-i → 0.2.3-k

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.
@@ -7,3 +7,4 @@ export declare const Input: import("styled-components").StyledComponent<"input",
7
7
  export declare const ShowHideButton: import("styled-components").StyledComponent<"button", any, {}, never>;
8
8
  export declare const TextLabel: import("styled-components").StyledComponent<"div", any, Pick<ITextFieldProps, "darkMode">, never>;
9
9
  export declare const ErrorLabel: import("styled-components").StyledComponent<"div", any, Pick<ITextFieldProps, "darkMode">, never>;
10
+ export declare const BodyCopyHarmonicWithWrapper: import("styled-components").StyledComponent<({ children, size, color, className, ...props }: import("../../../types/typography").IGenericTypographyProps<HTMLParagraphElement>) => import("react").JSX.Element, any, {}, never>;
@@ -1,6 +1,6 @@
1
- import { Colors } from '../../../types';
1
+ import { ThemeColor } from '../../../types';
2
2
  export declare const Wrapper: import("styled-components").StyledComponent<"div", any, {
3
- theme: Colors;
3
+ theme: ThemeColor;
4
4
  }, never>;
5
5
  export declare const SignUpFormWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
6
6
  export declare const SignUpTitleWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -1,2 +1,4 @@
1
+ export declare const disableTabbingInside: (element: HTMLElement | null, shouldDisable: boolean) => void;
2
+ export declare const isCloneSlide: (index: number, clonesCount: number, childrenLength: number, infinite: boolean) => boolean;
1
3
  export declare const getVisibleIndexes: (currentIndex: number, slideWidths: number[], containerWidth: number, slidesLength: number) => number[];
2
4
  export declare const getMovedSlides: (delta: number, slideWidths: number[]) => number;
@@ -1,4 +1,5 @@
1
1
  import { FunctionComponent } from 'react';
2
2
  import { IHighlightsCarouselProps } from '../../../../types/carousel';
3
+ export declare const TYPOGRAPHY_CLASS_NAME = "highlight-carousel-text";
3
4
  declare const HighlightsCarousel: FunctionComponent<IHighlightsCarouselProps>;
4
5
  export default HighlightsCarousel;
@@ -7,6 +7,7 @@ declare type Props = {
7
7
  setCurrentSlide: React.Dispatch<React.SetStateAction<number>>;
8
8
  carouselRef: React.RefObject<SwipeRef>;
9
9
  hasMultipleSlides: boolean;
10
+ carouselTitle: string | undefined;
10
11
  };
11
12
  declare const SwipeCarousel: FunctionComponent<Props>;
12
13
  export default SwipeCarousel;
@@ -330,6 +330,325 @@
330
330
  font-display: swap;
331
331
  }
332
332
 
333
+ /* ~~~~~ General Styling Classes ~~~~~ */
334
+ .typography_color-primary__LOfDi {
335
+ color: var(--color-primary);
336
+ }
337
+
338
+ .typography_color-black__6MHRL {
339
+ color: var(--color-base-black);
340
+ }
341
+
342
+ .typography_color-white__PfW5s {
343
+ color: var(--color-base-white);
344
+ }
345
+
346
+ .typography_color-red__iPlbG {
347
+ color: var(--color-primary-red);
348
+ }
349
+
350
+ .typography_color-grey__GA1c2 {
351
+ color: var(--color-base-dark-grey);
352
+ }
353
+
354
+ .typography_color-inherit__RDd0Y {
355
+ color: inherit;
356
+ }
357
+
358
+ .typography_em__E6tX- {
359
+ font-style: italic;
360
+ }
361
+ /* ~~~ */
362
+
363
+ /* Display Headers */
364
+ .typography_display__-F3p4 {
365
+ margin: 0;
366
+ font-family: var(--font-family-sans);
367
+ line-height: 100%;
368
+
369
+ &.typography_large__uq0zC {
370
+ font-size: 96px;
371
+ font-weight: 700;
372
+ letter-spacing: -5px;
373
+ }
374
+
375
+ &.typography_small__wfQ0K {
376
+ font-size: 68px;
377
+ font-weight: 500;
378
+ letter-spacing: -3px;
379
+ }
380
+
381
+ /* Serif and Italic styles */
382
+ &.typography_serif__VSO38,
383
+ &.typography_em__E6tX- {
384
+ font-family: var(--font-family-serif);
385
+ font-weight: 500;
386
+ }
387
+
388
+ /* Serif and Italic adjustments */
389
+ &.typography_large__uq0zC.typography_serif__VSO38,
390
+ &.typography_large__uq0zC.typography_em__E6tX- {
391
+ letter-spacing: -3px;
392
+ }
393
+
394
+ &.typography_small__wfQ0K.typography_serif__VSO38,
395
+ &.typography_small__wfQ0K.typography_em__E6tX- {
396
+ letter-spacing: -2px;
397
+ }
398
+
399
+ @media (max-width: 699px) {
400
+ &.typography_large__uq0zC {
401
+ font-size: 38px;
402
+ letter-spacing: -1.5px;
403
+ }
404
+
405
+ &.typography_small__wfQ0K {
406
+ font-size: 32px;
407
+ letter-spacing: -1.5px;
408
+ }
409
+
410
+ &.typography_large__uq0zC.typography_serif__VSO38,
411
+ &.typography_large__uq0zC.typography_em__E6tX-,
412
+ &.typography_small__wfQ0K.typography_serif__VSO38,
413
+ &.typography_small__wfQ0K.typography_em__E6tX- {
414
+ letter-spacing: -0.5px;
415
+ }
416
+ }
417
+ }
418
+
419
+ /* Headers */
420
+ .typography_header__BexiD {
421
+ margin: 0;
422
+ font-family: var(--font-family-sans);
423
+ font-weight: 500;
424
+
425
+ &.typography_large__uq0zC {
426
+ font-size: 44px;
427
+ line-height: 48px;
428
+ letter-spacing: -1.5px;
429
+ }
430
+
431
+ &.typography_medium__K0uZD {
432
+ font-size: 34px;
433
+ line-height: 40px;
434
+ letter-spacing: -1px;
435
+ }
436
+
437
+ &.typography_small__wfQ0K {
438
+ font-size: 26px;
439
+ line-height: 32px;
440
+ letter-spacing: -0.5px;
441
+ }
442
+
443
+ /* Serif and Italic styles */
444
+ &.typography_serif__VSO38,
445
+ &.typography_em__E6tX- {
446
+ font-family: var(--font-family-serif);
447
+ }
448
+
449
+ /* Serif and Italic letter-spacing overrides */
450
+ &.typography_large__uq0zC.typography_serif__VSO38,
451
+ &.typography_large__uq0zC.typography_em__E6tX- {
452
+ letter-spacing: -0.5px;
453
+ }
454
+
455
+ &.typography_medium__K0uZD.typography_serif__VSO38,
456
+ &.typography_medium__K0uZD.typography_em__E6tX- {
457
+ letter-spacing: -0.5px;
458
+ }
459
+
460
+ &.typography_small__wfQ0K.typography_serif__VSO38,
461
+ &.typography_small__wfQ0K.typography_em__E6tX- {
462
+ letter-spacing: -0.5px;
463
+ }
464
+
465
+ @media (max-width: 699px) {
466
+ &.typography_large__uq0zC {
467
+ font-size: 28px;
468
+ line-height: 34px;
469
+ letter-spacing: -1.5px;
470
+ }
471
+
472
+ &.typography_medium__K0uZD {
473
+ font-size: 24px;
474
+ line-height: 28px;
475
+ letter-spacing: -1px;
476
+ }
477
+
478
+ &.typography_small__wfQ0K {
479
+ font-size: 20px;
480
+ line-height: 26px;
481
+ letter-spacing: -0.75px;
482
+ }
483
+
484
+ /* Mobile overrides for serif/italic letter-spacing */
485
+ &.typography_large__uq0zC.typography_serif__VSO38,
486
+ &.typography_large__uq0zC.typography_em__E6tX-,
487
+ &.typography_medium__K0uZD.typography_serif__VSO38,
488
+ &.typography_medium__K0uZD.typography_em__E6tX-,
489
+ &.typography_small__wfQ0K.typography_serif__VSO38,
490
+ &.typography_small__wfQ0K.typography_em__E6tX- {
491
+ letter-spacing: -0.5px;
492
+ }
493
+ }
494
+ }
495
+
496
+ /* Subtitle */
497
+ .typography_subtitle__aoFTV {
498
+ margin: 0;
499
+ font-family: var(--font-family-sans);
500
+ font-weight: 500;
501
+
502
+ &.typography_large__uq0zC {
503
+ font-size: 19px;
504
+ line-height: 26px;
505
+ letter-spacing: -0.5px;
506
+ }
507
+
508
+ &.typography_small__wfQ0K {
509
+ font-size: 17px;
510
+ line-height: 24px;
511
+ letter-spacing: -0.5px;
512
+ }
513
+
514
+ @media (max-width: 699px) {
515
+ &.typography_large__uq0zC {
516
+ font-size: 17px;
517
+ line-height: 24px;
518
+ letter-spacing: -0.5px;
519
+ }
520
+
521
+ &.typography_small__wfQ0K {
522
+ font-size: 14px;
523
+ line-height: 20px;
524
+ letter-spacing: -0.2px;
525
+ }
526
+ }
527
+ }
528
+
529
+ /* Body Copy */
530
+ .typography_bodycopy__vYtQ8 {
531
+ margin: 0;
532
+ font-family: var(--font-family-sans);
533
+ font-weight: 400;
534
+
535
+ &.typography_large__uq0zC {
536
+ font-size: 19px;
537
+ line-height: 26px;
538
+ letter-spacing: -0.5px;
539
+ }
540
+
541
+ &.typography_medium__K0uZD {
542
+ font-size: 17px;
543
+ line-height: 24px;
544
+ letter-spacing: -0.5px;
545
+ }
546
+
547
+ &.typography_small__wfQ0K {
548
+ font-size: 14px;
549
+ line-height: 20px;
550
+ letter-spacing: -0.5px;
551
+ }
552
+
553
+ @media (max-width: 699px) {
554
+ &.typography_large__uq0zC {
555
+ font-size: 17px;
556
+ line-height: 24px;
557
+ letter-spacing: -0.5px;
558
+ }
559
+
560
+ &.typography_medium__K0uZD {
561
+ font-size: 14px;
562
+ line-height: 20px;
563
+ letter-spacing: -0.2px;
564
+ }
565
+
566
+ &.typography_small__wfQ0K {
567
+ font-size: 11px;
568
+ line-height: 16px;
569
+ letter-spacing: -0.2px;
570
+ }
571
+ }
572
+ }
573
+
574
+ /* Overline */
575
+ .typography_overline__EnUK3 {
576
+ margin: 0;
577
+ font-family: var(--font-family-sans);
578
+ font-weight: 500;
579
+ text-transform: uppercase;
580
+
581
+ &.typography_large__uq0zC {
582
+ font-size: 14px;
583
+ line-height: 18px;
584
+ letter-spacing: 0.3px;
585
+ }
586
+
587
+ &.typography_small__wfQ0K {
588
+ font-size: 12px;
589
+ line-height: 14px;
590
+ letter-spacing: 0.2px;
591
+ }
592
+
593
+ @media (max-width: 699px) {
594
+ &.typography_large__uq0zC {
595
+ line-height: 17px;
596
+ letter-spacing: 0.3px; /* Added to ensure it stays */
597
+ }
598
+
599
+ &.typography_small__wfQ0K {
600
+ line-height: 14px;
601
+ letter-spacing: 0.3px;
602
+ }
603
+ }
604
+ }
605
+
606
+ /* Button Text */
607
+ .typography_buttontext__vcxNi {
608
+ margin: 0;
609
+ font-family: var(--font-family-sans);
610
+ font-size: 17px;
611
+ line-height: 20px;
612
+ letter-spacing: -0.5px;
613
+ font-weight: 400;
614
+
615
+ @media (max-width: 699px) {
616
+ font-weight: 500;
617
+ line-height: 17px;
618
+ }
619
+ }
620
+
621
+ /* Caption Text */
622
+ .typography_captiontext__91UFb {
623
+ margin: 0;
624
+ font-family: var(--font-family-sans);
625
+ font-weight: 400;
626
+ font-size: 17px;
627
+ line-height: 24px;
628
+ letter-spacing: -0.5px;
629
+
630
+ @media (max-width: 699px) {
631
+ font-size: 14px;
632
+ line-height: 20px;
633
+ letter-spacing: -0.2px;
634
+ }
635
+ }
636
+
637
+ /* Navigation Text */
638
+ .typography_navigationtext__YfGf7 {
639
+ margin: 0;
640
+ font-family: var(--font-family-sans);
641
+ font-size: 19px;
642
+ line-height: 19px;
643
+ letter-spacing: 0.4px;
644
+ font-weight: 500;
645
+
646
+ @media (max-width: 699px) {
647
+ font-size: 17px;
648
+ line-height: 17px;
649
+ }
650
+ }
651
+
333
652
  .core-theme-module_coreTheme__pWxYB {
334
653
  /* RBO Red */
335
654
  /* Primary Palette */