@preply/ds-web-root 0.82.0 → 0.83.0

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 (9) hide show
  1. package/dist/generated/GlobalStyle.d.ts.map +1 -1
  2. package/dist/generated/GlobalStyle.js +448 -101
  3. package/dist/generated/global-style.less +447 -100
  4. package/dist/generated/global-style.less.js +2 -2
  5. package/dist/generated/themes.d.ts +1 -1
  6. package/dist/generated/themes.js +2 -2
  7. package/dist/generated/themes.module.less +4 -4
  8. package/dist/styles/global-style.less.js +2 -2
  9. package/package.json +14 -14
package/dist/generated/global-style.less CHANGED
@@ -619,6 +619,121 @@
619
619
  U+FFFD;
620
620
  }
621
621
 
622
+ /* thai */
623
+ @font-face {
624
+ /*
625
+ Google font uses "Noto Sans Thai" as the font-family name, but using "just Noto Sans" allows us
626
+ to logically (but not physically) "merge" the two fonts.
627
+
628
+ @see https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@600&display=swap for the original CSS
629
+ */
630
+ font-family: 'Noto Sans';
631
+ font-style: normal;
632
+ font-weight: 600;
633
+ font-stretch: 100%;
634
+ font-display: swap;
635
+ src: url(https://static.preply.com/ds/fonts/google/s/notosansthai/v25/iJWQBXeUZi_OHPqn4wq6hQ2_hbJ1xyN9wd43SofNWcdfKI2hTWsb-P2c.woff2)
636
+ format('woff2');
637
+ unicode-range: U+0E01-0E5B, U+200C-200D, U+25CC;
638
+ }
639
+
640
+ /*
641
+ Thai
642
+
643
+ Google font uses "Noto Sans Thai" as the font-family name, but using "just Noto Sans" allows us
644
+ to logically (but not physically) "merge" the two fonts.
645
+
646
+ @see https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@600&display=swap for the original CSS
647
+
648
+ The font-face is repeated for each weight because the first experiments showed that the range used by google
649
+ (which is "100 900") kinda be less specific than single digit ones (like all the one above) so the browser
650
+ does not use the correct Thai glyphs for Thai characters.
651
+ */
652
+ @font-face {
653
+ font-family: 'Noto Sans';
654
+ font-style: normal;
655
+ font-weight: 400;
656
+ font-stretch: 100%;
657
+ font-display: swap;
658
+ src: url(https://static.preply.com/ds/fonts/google/s/notosansthai/v25/iJWQBXeUZi_OHPqn4wq6hQ2_hbJ1xyN9wd43SofNWcdfKI2hTWsb-P2c.woff2)
659
+ format('woff2');
660
+ unicode-range: U+0E01-0E5B, U+200C-200D, U+25CC;
661
+ }
662
+ @font-face {
663
+ /*
664
+ Google font uses "Noto Sans Thai" as the font-family name, but using "just Noto Sans" allows us
665
+ to logically (but not physically) "merge" the two fonts.
666
+
667
+ @see https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@600&display=swap for the original CSS
668
+ */
669
+ font-family: 'Noto Sans';
670
+ font-style: normal;
671
+ font-weight: 500;
672
+ font-stretch: 100%;
673
+ font-display: swap;
674
+ src: url(https://static.preply.com/ds/fonts/google/s/notosansthai/v25/iJWQBXeUZi_OHPqn4wq6hQ2_hbJ1xyN9wd43SofNWcdfKI2hTWsb-P2c.woff2)
675
+ format('woff2');
676
+ unicode-range: U+0E01-0E5B, U+200C-200D, U+25CC;
677
+ }
678
+ @font-face {
679
+ /*
680
+ Google font uses "Noto Sans Thai" as the font-family name, but using "just Noto Sans" allows us
681
+ to logically (but not physically) "merge" the two fonts.
682
+
683
+ @see https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@600&display=swap for the original CSS
684
+ */
685
+ font-family: 'Noto Sans';
686
+ font-style: normal;
687
+ font-weight: 600;
688
+ font-stretch: 100%;
689
+ font-display: swap;
690
+ src: url(https://static.preply.com/ds/fonts/google/s/notosansthai/v25/iJWQBXeUZi_OHPqn4wq6hQ2_hbJ1xyN9wd43SofNWcdfKI2hTWsb-P2c.woff2)
691
+ format('woff2');
692
+ unicode-range: U+0E01-0E5B, U+200C-200D, U+25CC;
693
+ }
694
+ @font-face {
695
+ font-family: 'Noto Sans';
696
+ font-style: italic;
697
+ font-weight: 400;
698
+ font-stretch: 100%;
699
+ font-display: swap;
700
+ src: url(https://static.preply.com/ds/fonts/google/s/notosansthai/v25/iJWQBXeUZi_OHPqn4wq6hQ2_hbJ1xyN9wd43SofNWcdfKI2hTWsb-P2c.woff2)
701
+ format('woff2');
702
+ unicode-range: U+0E01-0E5B, U+200C-200D, U+25CC;
703
+ }
704
+ @font-face {
705
+ /*
706
+ Google font uses "Noto Sans Thai" as the font-family name, but using "just Noto Sans" allows us
707
+ to logically (but not physically) "merge" the two fonts.
708
+
709
+ @see https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@600&display=swap for the original CSS
710
+ */
711
+ font-family: 'Noto Sans';
712
+ font-style: italic;
713
+ font-weight: 500;
714
+ font-stretch: 100%;
715
+ font-display: swap;
716
+ src: url(https://static.preply.com/ds/fonts/google/s/notosansthai/v25/iJWQBXeUZi_OHPqn4wq6hQ2_hbJ1xyN9wd43SofNWcdfKI2hTWsb-P2c.woff2)
717
+ format('woff2');
718
+ unicode-range: U+0E01-0E5B, U+200C-200D, U+25CC;
719
+ }
720
+ @font-face {
721
+ /*
722
+ Google font uses "Noto Sans Thai" as the font-family name, but using "just Noto Sans" allows us
723
+ to logically (but not physically) "merge" the two fonts.
724
+
725
+ @see https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@600&display=swap for the original CSS
726
+ */
727
+ font-family: 'Noto Sans';
728
+ font-style: italic;
729
+ font-weight: 600;
730
+ font-stretch: 100%;
731
+ font-display: swap;
732
+ src: url(https://static.preply.com/ds/fonts/google/s/notosansthai/v25/iJWQBXeUZi_OHPqn4wq6hQ2_hbJ1xyN9wd43SofNWcdfKI2hTWsb-P2c.woff2)
733
+ format('woff2');
734
+ unicode-range: U+0E01-0E5B, U+200C-200D, U+25CC;
735
+ }
736
+
622
737
  /* Fallback */
623
738
  @font-face {
624
739
  font-family: 'PreplyInter-Fallback';
@@ -705,47 +820,53 @@
705
820
  }
706
821
  }
707
822
 
708
- [data-preply-ds-theme='tokyo-ui'] * {
709
- font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
710
- }
711
-
712
- /* no mistake: Figtree doesn't look good for TR, PL, and RO — Platform is ok */
713
- [data-preply-ds-theme='tokyo-ui'] *:lang(id),
714
- [data-preply-ds-theme='tokyo-ui'] *:lang(nl),
715
- [data-preply-ds-theme='tokyo-ui'] *:lang(es),
716
- [data-preply-ds-theme='tokyo-ui'] *:lang(en),
717
- [data-preply-ds-theme='tokyo-ui'] *:lang(de),
718
- [data-preply-ds-theme='tokyo-ui'] *:lang(it),
719
- [data-preply-ds-theme='tokyo-ui'] *:lang(fr),
720
- [data-preply-ds-theme='tokyo-ui'] *:lang(pt) {
823
+ /* ENGLISH */
824
+ /* Standard Platform for Headings + Figtree for texts */
825
+ [data-preply-ds-theme='tokyo-ui'] *:lang(en) {
721
826
  font-family: 'Figtree', 'Figtree-fallback', 'Figtree-fallback-android', 'Noto Sans',
722
827
  'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
723
828
  }
829
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(en),
830
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(en),
831
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(en),
832
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(en),
833
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(en),
834
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(en),
835
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(en),
836
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(en),
837
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(en),
838
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(en),
839
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(en),
840
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(en) {
841
+ font-family: 'Platform', 'Platform-fallback', 'Platform-fallback-android', 'Noto Sans',
842
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
843
+ }
724
844
 
725
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(id),
726
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(id),
727
- [data-preply-ds-theme='tokyo-ui'] h1:lang(id),
728
- [data-preply-ds-theme='tokyo-ui'] h1 *:lang(id),
729
- [data-preply-ds-theme='tokyo-ui'] h2:lang(id),
730
- [data-preply-ds-theme='tokyo-ui'] h2 *:lang(id),
731
- [data-preply-ds-theme='tokyo-ui'] h3:lang(id),
732
- [data-preply-ds-theme='tokyo-ui'] h3 *:lang(id),
733
- [data-preply-ds-theme='tokyo-ui'] h4:lang(id),
734
- [data-preply-ds-theme='tokyo-ui'] h4 *:lang(id),
735
- [data-preply-ds-theme='tokyo-ui'] h5:lang(id),
736
- [data-preply-ds-theme='tokyo-ui'] h5 *:lang(id),
737
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(nl),
738
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(nl),
739
- [data-preply-ds-theme='tokyo-ui'] h1:lang(nl),
740
- [data-preply-ds-theme='tokyo-ui'] h1 *:lang(nl),
741
- [data-preply-ds-theme='tokyo-ui'] h2:lang(nl),
742
- [data-preply-ds-theme='tokyo-ui'] h2 *:lang(nl),
743
- [data-preply-ds-theme='tokyo-ui'] h3:lang(nl),
744
- [data-preply-ds-theme='tokyo-ui'] h3 *:lang(nl),
745
- [data-preply-ds-theme='tokyo-ui'] h4:lang(nl),
746
- [data-preply-ds-theme='tokyo-ui'] h4 *:lang(nl),
747
- [data-preply-ds-theme='tokyo-ui'] h5:lang(nl),
748
- [data-preply-ds-theme='tokyo-ui'] h5 *:lang(nl),
845
+ /* RUSSIAN */
846
+ /* Noto Sans for everything due to Cyrillic characters */
847
+ [data-preply-ds-theme='tokyo-ui'] *:lang(ru) {
848
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
849
+ }
850
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(ru),
851
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(ru),
852
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(ru),
853
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(ru),
854
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(ru),
855
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(ru),
856
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(ru),
857
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(ru),
858
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(ru),
859
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(ru),
860
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(ru),
861
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(ru) {
862
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
863
+ }
864
+
865
+ /* POLISH */
866
+ /* Platform for Headings + Noto Sans (NOT Figtree since some letters do not look good at all) for texts */
867
+ [data-preply-ds-theme='tokyo-ui'] *:lang(pl) {
868
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
869
+ }
749
870
  [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(pl),
750
871
  [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(pl),
751
872
  [data-preply-ds-theme='tokyo-ui'] h1:lang(pl),
@@ -757,43 +878,17 @@
757
878
  [data-preply-ds-theme='tokyo-ui'] h4:lang(pl),
758
879
  [data-preply-ds-theme='tokyo-ui'] h4 *:lang(pl),
759
880
  [data-preply-ds-theme='tokyo-ui'] h5:lang(pl),
760
- [data-preply-ds-theme='tokyo-ui'] h5 *:lang(pl),
761
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(es),
762
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(es),
763
- [data-preply-ds-theme='tokyo-ui'] h1:lang(es),
764
- [data-preply-ds-theme='tokyo-ui'] h1 *:lang(es),
765
- [data-preply-ds-theme='tokyo-ui'] h2:lang(es),
766
- [data-preply-ds-theme='tokyo-ui'] h2 *:lang(es),
767
- [data-preply-ds-theme='tokyo-ui'] h3:lang(es),
768
- [data-preply-ds-theme='tokyo-ui'] h3 *:lang(es),
769
- [data-preply-ds-theme='tokyo-ui'] h4:lang(es),
770
- [data-preply-ds-theme='tokyo-ui'] h4 *:lang(es),
771
- [data-preply-ds-theme='tokyo-ui'] h5:lang(es),
772
- [data-preply-ds-theme='tokyo-ui'] h5 *:lang(es),
773
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(ro),
774
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(ro),
775
- [data-preply-ds-theme='tokyo-ui'] h1:lang(ro),
776
- [data-preply-ds-theme='tokyo-ui'] h1 *:lang(ro),
777
- [data-preply-ds-theme='tokyo-ui'] h2:lang(ro),
778
- [data-preply-ds-theme='tokyo-ui'] h2 *:lang(ro),
779
- [data-preply-ds-theme='tokyo-ui'] h3:lang(ro),
780
- [data-preply-ds-theme='tokyo-ui'] h3 *:lang(ro),
781
- [data-preply-ds-theme='tokyo-ui'] h4:lang(ro),
782
- [data-preply-ds-theme='tokyo-ui'] h4 *:lang(ro),
783
- [data-preply-ds-theme='tokyo-ui'] h5:lang(ro),
784
- [data-preply-ds-theme='tokyo-ui'] h5 *:lang(ro),
785
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(en),
786
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(en),
787
- [data-preply-ds-theme='tokyo-ui'] h1:lang(en),
788
- [data-preply-ds-theme='tokyo-ui'] h1 *:lang(en),
789
- [data-preply-ds-theme='tokyo-ui'] h2:lang(en),
790
- [data-preply-ds-theme='tokyo-ui'] h2 *:lang(en),
791
- [data-preply-ds-theme='tokyo-ui'] h3:lang(en),
792
- [data-preply-ds-theme='tokyo-ui'] h3 *:lang(en),
793
- [data-preply-ds-theme='tokyo-ui'] h4:lang(en),
794
- [data-preply-ds-theme='tokyo-ui'] h4 *:lang(en),
795
- [data-preply-ds-theme='tokyo-ui'] h5:lang(en),
796
- [data-preply-ds-theme='tokyo-ui'] h5 *:lang(en),
881
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(pl) {
882
+ font-family: 'Platform', 'Platform-fallback', 'Platform-fallback-android', 'Noto Sans',
883
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
884
+ }
885
+
886
+ /* GERMAN */
887
+ /* Standard Platform for Headings + Figtree for texts */
888
+ [data-preply-ds-theme='tokyo-ui'] *:lang(de) {
889
+ font-family: 'Figtree', 'Figtree-fallback', 'Figtree-fallback-android', 'Noto Sans',
890
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
891
+ }
797
892
  [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(de),
798
893
  [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(de),
799
894
  [data-preply-ds-theme='tokyo-ui'] h1:lang(de),
@@ -805,31 +900,37 @@
805
900
  [data-preply-ds-theme='tokyo-ui'] h4:lang(de),
806
901
  [data-preply-ds-theme='tokyo-ui'] h4 *:lang(de),
807
902
  [data-preply-ds-theme='tokyo-ui'] h5:lang(de),
808
- [data-preply-ds-theme='tokyo-ui'] h5 *:lang(de),
809
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(it),
810
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(it),
811
- [data-preply-ds-theme='tokyo-ui'] h1:lang(it),
812
- [data-preply-ds-theme='tokyo-ui'] h1 *:lang(it),
813
- [data-preply-ds-theme='tokyo-ui'] h2:lang(it),
814
- [data-preply-ds-theme='tokyo-ui'] h2 *:lang(it),
815
- [data-preply-ds-theme='tokyo-ui'] h3:lang(it),
816
- [data-preply-ds-theme='tokyo-ui'] h3 *:lang(it),
817
- [data-preply-ds-theme='tokyo-ui'] h4:lang(it),
818
- [data-preply-ds-theme='tokyo-ui'] h4 *:lang(it),
819
- [data-preply-ds-theme='tokyo-ui'] h5:lang(it),
820
- [data-preply-ds-theme='tokyo-ui'] h5 *:lang(it),
821
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(fr),
822
- [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(fr),
823
- [data-preply-ds-theme='tokyo-ui'] h1:lang(fr),
824
- [data-preply-ds-theme='tokyo-ui'] h1 *:lang(fr),
825
- [data-preply-ds-theme='tokyo-ui'] h2:lang(fr),
826
- [data-preply-ds-theme='tokyo-ui'] h2 *:lang(fr),
827
- [data-preply-ds-theme='tokyo-ui'] h3:lang(fr),
828
- [data-preply-ds-theme='tokyo-ui'] h3 *:lang(fr),
829
- [data-preply-ds-theme='tokyo-ui'] h4:lang(fr),
830
- [data-preply-ds-theme='tokyo-ui'] h4 *:lang(fr),
831
- [data-preply-ds-theme='tokyo-ui'] h5:lang(fr),
832
- [data-preply-ds-theme='tokyo-ui'] h5 *:lang(fr),
903
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(de) {
904
+ font-family: 'Platform', 'Platform-fallback', 'Platform-fallback-android', 'Noto Sans',
905
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
906
+ }
907
+
908
+ /* UKRANIAN */
909
+ /* Noto Sans for everything due to Cyrillic characters */
910
+ [data-preply-ds-theme='tokyo-ui'] *:lang(uk) {
911
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
912
+ }
913
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(uk),
914
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(uk),
915
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(uk),
916
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(uk),
917
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(uk),
918
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(uk),
919
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(uk),
920
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(uk),
921
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(uk),
922
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(uk),
923
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(uk),
924
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(uk) {
925
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
926
+ }
927
+
928
+ /* PORTUGUESE */
929
+ /* Standard Platform for Headings + Figtree for texts */
930
+ [data-preply-ds-theme='tokyo-ui'] *:lang(pt) {
931
+ font-family: 'Figtree', 'Figtree-fallback', 'Figtree-fallback-android', 'Noto Sans',
932
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
933
+ }
833
934
  [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(pt),
834
935
  [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(pt),
835
936
  [data-preply-ds-theme='tokyo-ui'] h1:lang(pt),
@@ -841,7 +942,16 @@
841
942
  [data-preply-ds-theme='tokyo-ui'] h4:lang(pt),
842
943
  [data-preply-ds-theme='tokyo-ui'] h4 *:lang(pt),
843
944
  [data-preply-ds-theme='tokyo-ui'] h5:lang(pt),
844
- [data-preply-ds-theme='tokyo-ui'] h5 *:lang(pt),
945
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(pt) {
946
+ font-family: 'Platform', 'Platform-fallback', 'Platform-fallback-android', 'Noto Sans',
947
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
948
+ }
949
+
950
+ /* TURKISH */
951
+ /* Platform for Headings + Noto Sans (NOT Figtree since some letters do not look good at all) for texts */
952
+ [data-preply-ds-theme='tokyo-ui'] *:lang(tr) {
953
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
954
+ }
845
955
  [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(tr),
846
956
  [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(tr),
847
957
  [data-preply-ds-theme='tokyo-ui'] h1:lang(tr),
@@ -857,3 +967,240 @@
857
967
  font-family: 'Platform', 'Platform-fallback', 'Platform-fallback-android', 'Noto Sans',
858
968
  'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
859
969
  }
970
+
971
+ /* INDONESIAN */
972
+ /* Standard Platform for Headings + Figtree for texts */
973
+ [data-preply-ds-theme='tokyo-ui'] *:lang(id) {
974
+ font-family: 'Figtree', 'Figtree-fallback', 'Figtree-fallback-android', 'Noto Sans',
975
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
976
+ }
977
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(id),
978
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(id),
979
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(id),
980
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(id),
981
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(id),
982
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(id),
983
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(id),
984
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(id),
985
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(id),
986
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(id),
987
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(id),
988
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(id) {
989
+ font-family: 'Platform', 'Platform-fallback', 'Platform-fallback-android', 'Noto Sans',
990
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
991
+ }
992
+
993
+ /* FRENCH */
994
+ /* Standard Platform for Headings + Figtree for texts */
995
+ [data-preply-ds-theme='tokyo-ui'] *:lang(fr) {
996
+ font-family: 'Figtree', 'Figtree-fallback', 'Figtree-fallback-android', 'Noto Sans',
997
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
998
+ }
999
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(fr),
1000
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(fr),
1001
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(fr),
1002
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(fr),
1003
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(fr),
1004
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(fr),
1005
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(fr),
1006
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(fr),
1007
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(fr),
1008
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(fr),
1009
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(fr),
1010
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(fr) {
1011
+ font-family: 'Platform', 'Platform-fallback', 'Platform-fallback-android', 'Noto Sans',
1012
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1013
+ }
1014
+
1015
+ /* ITALIAN */
1016
+ /* Standard Platform for Headings + Figtree for texts */
1017
+ [data-preply-ds-theme='tokyo-ui'] *:lang(it) {
1018
+ font-family: 'Figtree', 'Figtree-fallback', 'Figtree-fallback-android', 'Noto Sans',
1019
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1020
+ }
1021
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(it),
1022
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(it),
1023
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(it),
1024
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(it),
1025
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(it),
1026
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(it),
1027
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(it),
1028
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(it),
1029
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(it),
1030
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(it),
1031
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(it),
1032
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(it) {
1033
+ font-family: 'Platform', 'Platform-fallback', 'Platform-fallback-android', 'Noto Sans',
1034
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1035
+ }
1036
+
1037
+ /* SPANISH */
1038
+ /* Standard Platform for Headings + Figtree for texts */
1039
+ [data-preply-ds-theme='tokyo-ui'] *:lang(es) {
1040
+ font-family: 'Figtree', 'Figtree-fallback', 'Figtree-fallback-android', 'Noto Sans',
1041
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1042
+ }
1043
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(es),
1044
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(es),
1045
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(es),
1046
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(es),
1047
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(es),
1048
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(es),
1049
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(es),
1050
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(es),
1051
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(es),
1052
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(es),
1053
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(es),
1054
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(es) {
1055
+ font-family: 'Platform', 'Platform-fallback', 'Platform-fallback-android', 'Noto Sans',
1056
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1057
+ }
1058
+
1059
+ /* CHINESE */
1060
+ /* Noto Sans for everything due to symbols */
1061
+ [data-preply-ds-theme='tokyo-ui'] *:lang(zh) {
1062
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1063
+ }
1064
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(zh),
1065
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(zh),
1066
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(zh),
1067
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(zh),
1068
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(zh),
1069
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(zh),
1070
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(zh),
1071
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(zh),
1072
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(zh),
1073
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(zh),
1074
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(zh),
1075
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(zh) {
1076
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1077
+ }
1078
+
1079
+ /* JAPANESE */
1080
+ /* Noto Sans for everything due to symbols */
1081
+ [data-preply-ds-theme='tokyo-ui'] *:lang(ja) {
1082
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1083
+ }
1084
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(ja),
1085
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(ja),
1086
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(ja),
1087
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(ja),
1088
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(ja),
1089
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(ja),
1090
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(ja),
1091
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(ja),
1092
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(ja),
1093
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(ja),
1094
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(ja),
1095
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(ja) {
1096
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1097
+ }
1098
+
1099
+ /* KOREAN */
1100
+ /* Noto Sans for everything due to symbols */
1101
+ [data-preply-ds-theme='tokyo-ui'] *:lang(ko) {
1102
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1103
+ }
1104
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(ko),
1105
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(ko),
1106
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(ko),
1107
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(ko),
1108
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(ko),
1109
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(ko),
1110
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(ko),
1111
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(ko),
1112
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(ko),
1113
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(ko),
1114
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(ko),
1115
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(ko) {
1116
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1117
+ }
1118
+
1119
+ /* ARABIC */
1120
+ /* Noto Sans for everything due to symbols */
1121
+ [data-preply-ds-theme='tokyo-ui'] *:lang(ar) {
1122
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1123
+ }
1124
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(ar),
1125
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(ar),
1126
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(ar),
1127
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(ar),
1128
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(ar),
1129
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(ar),
1130
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(ar),
1131
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(ar),
1132
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(ar),
1133
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(ar),
1134
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(ar),
1135
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(ar) {
1136
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1137
+ }
1138
+
1139
+ /* DUTCH */
1140
+ /* Standard Platform for Headings + Figtree for texts */
1141
+ [data-preply-ds-theme='tokyo-ui'] *:lang(nl) {
1142
+ font-family: 'Figtree', 'Figtree-fallback', 'Figtree-fallback-android', 'Noto Sans',
1143
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1144
+ }
1145
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(nl),
1146
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(nl),
1147
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(nl),
1148
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(nl),
1149
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(nl),
1150
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(nl),
1151
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(nl),
1152
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(nl),
1153
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(nl),
1154
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(nl),
1155
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(nl),
1156
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(nl) {
1157
+ font-family: 'Platform', 'Platform-fallback', 'Platform-fallback-android', 'Noto Sans',
1158
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1159
+ }
1160
+
1161
+ /* ROMANIAN */
1162
+ /* Platform for Headings + Noto Sans (NOT Figtree since some letters do not look good at all) for texts */
1163
+ [data-preply-ds-theme='tokyo-ui'] *:lang(ro) {
1164
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1165
+ }
1166
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(ro),
1167
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(ro),
1168
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(ro),
1169
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(ro),
1170
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(ro),
1171
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(ro),
1172
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(ro),
1173
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(ro),
1174
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(ro),
1175
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(ro),
1176
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(ro),
1177
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(ro) {
1178
+ font-family: 'Platform', 'Platform-fallback', 'Platform-fallback-android', 'Noto Sans',
1179
+ 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1180
+ }
1181
+
1182
+ /* SWEDISH */
1183
+ /* Noto Sans for everything due to special characters */
1184
+ [data-preply-ds-theme='tokyo-ui'] *:lang(sv) {
1185
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1186
+ }
1187
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading:lang(sv),
1188
+ [data-preply-ds-theme='tokyo-ui'] .preply-ds-heading *:lang(sv),
1189
+ [data-preply-ds-theme='tokyo-ui'] h1:lang(sv),
1190
+ [data-preply-ds-theme='tokyo-ui'] h1 *:lang(sv),
1191
+ [data-preply-ds-theme='tokyo-ui'] h2:lang(sv),
1192
+ [data-preply-ds-theme='tokyo-ui'] h2 *:lang(sv),
1193
+ [data-preply-ds-theme='tokyo-ui'] h3:lang(sv),
1194
+ [data-preply-ds-theme='tokyo-ui'] h3 *:lang(sv),
1195
+ [data-preply-ds-theme='tokyo-ui'] h4:lang(sv),
1196
+ [data-preply-ds-theme='tokyo-ui'] h4 *:lang(sv),
1197
+ [data-preply-ds-theme='tokyo-ui'] h5:lang(sv),
1198
+ [data-preply-ds-theme='tokyo-ui'] h5 *:lang(sv) {
1199
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1200
+ }
1201
+
1202
+ /* ALL FUTURE LANGUAGES */
1203
+ /* Noto Sans for everything to stay on the safe side */
1204
+ [data-preply-ds-theme='tokyo-ui'] * {
1205
+ font-family: 'Noto Sans', 'NotoSans-fallback', 'NotoSans-fallback-android', sans-serif;
1206
+ }