@rescui/typography 0.4.0 → 0.5.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 (5) hide show
  1. package/lib/create-text-cn.d.ts +1 -1
  2. package/lib/create-text-cn.js +15 -10
  3. package/lib/index.css +138 -91
  4. package/lib/mixins.pcss +165 -100
  5. package/package.json +2 -2
package/lib/create-text-cn.d.ts CHANGED
@@ -10,7 +10,7 @@ export interface TextsParams {
10
10
  }
11
11
  export interface LinkParams extends Omit<TextsParams, 'paragraphOffsetAuto'> {
12
12
  external?: boolean;
13
- mode?: 'text' | 'clear' | 'standalone';
13
+ mode?: 'classic' | 'rock' | 'clear' | 'standalone';
14
14
  }
15
15
  export declare function createTextCn(theme: Theme): {
16
16
  (type: Texts, params?: TextsParams): string;
package/lib/create-text-cn.js CHANGED
@@ -7,17 +7,22 @@ function createTextCn(theme) {
7
7
 
8
8
  function textCn() {
9
9
  var type = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'rs-text-1';
10
- var params = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
11
- paragraphOffsetAuto: false,
12
- hardness: undefined,
13
- external: false,
14
- mode: undefined
15
- };
10
+
11
+ var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
12
+ _ref$paragraphOffsetA = _ref.paragraphOffsetAuto,
13
+ paragraphOffsetAuto = _ref$paragraphOffsetA === void 0 ? false : _ref$paragraphOffsetA,
14
+ _ref$hardness = _ref.hardness,
15
+ hardness = _ref$hardness === void 0 ? undefined : _ref$hardness,
16
+ _ref$external = _ref.external,
17
+ external = _ref$external === void 0 ? false : _ref$external,
18
+ _ref$mode = _ref.mode,
19
+ mode = _ref$mode === void 0 ? 'classic' : _ref$mode;
20
+
16
21
  return bemCnFast(type)({
17
- 'paragraph-offset-auto': params.paragraphOffsetAuto,
18
- hardness: params.hardness,
19
- external: params.external,
20
- mode: params.mode,
22
+ 'paragraph-offset-auto': paragraphOffsetAuto,
23
+ hardness: hardness,
24
+ external: external,
25
+ mode: type === 'rs-link' && mode,
21
26
  theme: theme
22
27
  });
23
28
  }
package/lib/index.css CHANGED
@@ -673,8 +673,8 @@
673
673
  width:100%;
674
674
  padding:12px 16px;
675
675
  word-wrap:normal;
676
- font-family:SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
677
- font-family:var(--rs-font-family-mono, SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
676
+ font-family:'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
677
+ font-family:var(--rs-font-family-mono, 'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
678
678
  font-size:16px;
679
679
  line-height:24px;
680
680
  color:#19191C;
@@ -700,8 +700,8 @@
700
700
  word-wrap:normal;
701
701
  background:transparent !important;
702
702
  color:inherit !important;
703
- font-family:SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
704
- font-family:var(--rs-font-family-mono, SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
703
+ font-family:'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
704
+ font-family:var(--rs-font-family-mono, 'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
705
705
  line-height:inherit;
706
706
  }
707
707
  .rs-pre_theme_dark{
@@ -724,8 +724,8 @@
724
724
  color:var(--rs-typography-pre-color, #19191C);
725
725
  background-color:rgba(25,25,28,0.1);
726
726
  background-color:var(--rs-typography-pre-bg-color, rgba(25,25,28,0.1));
727
- font-family:SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
728
- font-family:var(--rs-font-family-mono, SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
727
+ font-family:'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
728
+ font-family:var(--rs-font-family-mono, 'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
729
729
  font-size:90%;
730
730
  line-height:inherit;
731
731
  border-radius:4px;
@@ -750,8 +750,8 @@
750
750
  color:var(--rs-typography-pre-color, #19191C);
751
751
  background-color:rgba(25,25,28,0.1);
752
752
  background-color:var(--rs-typography-pre-bg-color, rgba(25,25,28,0.1));
753
- font-family:SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
754
- font-family:var(--rs-font-family-mono, SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
753
+ font-family:'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
754
+ font-family:var(--rs-font-family-mono, 'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
755
755
  font-size:90%;
756
756
  line-height:inherit;
757
757
  border-radius:4px;
@@ -764,34 +764,17 @@
764
764
  }
765
765
  .rs-link{
766
766
  --rs-link-color:var(--rs-typography-color-hard, #19191C);
767
- --rs-link-color-hover:var(--rs-typography-text-link-hover-color, #FFFFFF);
768
- --rs-underline-color:var(--rs-typography-color-hard, #19191C);
767
+ color:#19191C;
768
+ color:var(--rs-link-color);
769
769
  padding-bottom:1px;
770
770
  outline:none;
771
771
  cursor:pointer;
772
772
  text-decoration:none;
773
- color:#19191C;
774
- color:var(--rs-link-color);
775
773
  font-size:inherit;
776
774
  line-height:inherit;
777
- border-bottom:1px solid #19191C;
778
- border-bottom:1px solid var(--rs-underline-color);
779
- background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, #19191C), color-stop(0, transparent));
780
- background-image:linear-gradient(to bottom, #19191C 100%, transparent 0);
781
- background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, var(--rs-underline-color)), color-stop(0, transparent));
782
- background-image:linear-gradient(to bottom, var(--rs-underline-color) 100%, transparent 0);
783
- background-size:auto 0;
784
- background-repeat:repeat-x;
785
- background-position:left calc(100% + 4px);
786
- -webkit-transition:background-size 300ms, color 300ms;
787
- transition:background-size 300ms, color 300ms;
775
+ border-bottom-style:solid;
776
+ border-bottom-width:1px;
788
777
  }
789
- @media all and (-ms-high-contrast: none){
790
- .rs-link{
791
- -webkit-transition:none;
792
- transition:none;
793
- }
794
- }
795
778
  .rs-link:active,
796
779
  .rs-link:focus{
797
780
  color:#19191C;
@@ -799,9 +782,6 @@
799
782
  }
800
783
  .rs-link:hover{
801
784
  text-decoration:none;
802
- color:#FFFFFF;
803
- color:var(--rs-link-color-hover);
804
- background-size:auto calc(100% + 4px);
805
785
  }
806
786
  .rs-link:focus[data-focus-method='key']{
807
787
  -webkit-box-shadow:#4597ff 0 0 0 4px;
@@ -810,23 +790,26 @@
810
790
  box-shadow:var(--rs-color-primary-dim-light-theme, #4597ff) 0 0 0 4px;
811
791
  }
812
792
  [class*="rs-super-hero"] .rs-link{
813
- padding-bottom:0;
814
- border-bottom-width:5px;
793
+ border-bottom-width:4px;
815
794
  }
816
- @media screen and (max-width: 640px){
795
+ @media screen and (max-width: 1000px){
817
796
  [class*="rs-super-hero"] .rs-link{
818
- border-bottom-width:2px;
797
+ border-bottom-width:3px
819
798
  }
799
+ }
800
+ @media screen and (max-width: 640px){
801
+ [class*="rs-super-hero"] .rs-link{
802
+ border-bottom-width:2px
820
803
  }
804
+ }
821
805
  [class*="rs-hero"] .rs-link{
822
- padding-bottom:0;
823
- border-bottom-width:4px;
806
+ border-bottom-width:3px;
824
807
  }
825
808
  @media screen and (max-width: 640px){
826
809
  [class*="rs-hero"] .rs-link{
827
- border-bottom-width:2px;
828
- }
810
+ border-bottom-width:2px
829
811
  }
812
+ }
830
813
  [class*="rs-h1"] .rs-link,
831
814
  [class*="rs-h2"] .rs-link,
832
815
  [class*="rs-h3"] .rs-link,
@@ -835,7 +818,6 @@
835
818
  [class*="rs-overline"] .rs-link,
836
819
  [class*="rs-subtitle-1"] .rs-link,
837
820
  [class*="rs-subtitle-2"] .rs-link{
838
- padding-bottom:0;
839
821
  border-bottom-width:2px;
840
822
  }
841
823
  .rs-link_external:after{
@@ -844,17 +826,79 @@
844
826
  margin-right:0;
845
827
  margin-left:0;
846
828
  }
847
- .rs-link_mode_standalone{
829
+ .rs-link_mode_classic{
848
830
  --rs-link-color-hover:var(--rs-typography-color-hard, #19191C);
849
- --rs-link-standalone-border-offset:1.15em;
850
- border-bottom-color:transparent;
851
- background-image:none;
852
- background-size:initial;
853
- background-repeat:initial;
854
- background-position:initial;
831
+ --rs-underline-color:var(--rs-typography-classic-link-underline-color, rgba(25,25,28,0.4));
832
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #19191C);
833
+ border-bottom-color:rgba(25,25,28,0.4);
834
+ border-bottom-color:var(--rs-underline-color);
835
+ }
836
+ .rs-link_mode_classic:hover{
837
+ color:#19191C;
838
+ color:var(--rs-link-color-hover);
839
+ border-bottom-color:#19191C;
840
+ border-bottom-color:var(--rs-underline-color-hover);
841
+ border-bottom-width:2px;
842
+ padding-bottom:0;
843
+ }
844
+ [class*="rs-super-hero"] .rs-link_mode_classic:hover{
845
+ border-bottom-width:5px;
846
+ }
847
+ @media screen and (max-width: 1000px){
848
+ [class*="rs-super-hero"] .rs-link_mode_classic:hover{
849
+ border-bottom-width:4px
850
+ }
851
+ }
852
+ @media screen and (max-width: 640px){
853
+ [class*="rs-super-hero"] .rs-link_mode_classic:hover{
854
+ border-bottom-width:3px
855
+ }
856
+ }
857
+ [class*="rs-hero"] .rs-link_mode_classic:hover{
858
+ border-bottom-width:4px;
859
+ }
860
+ @media screen and (max-width: 640px){
861
+ [class*="rs-hero"] .rs-link_mode_classic:hover{
862
+ border-bottom-width:3px
863
+ }
864
+ }
865
+ [class*="rs-h1"] .rs-link_mode_classic:hover, [class*="rs-h2"] .rs-link_mode_classic:hover, [class*="rs-h3"] .rs-link_mode_classic:hover, [class*="rs-h4"] .rs-link_mode_classic:hover, [class*="rs-h5"] .rs-link_mode_classic:hover, [class*="rs-overline"] .rs-link_mode_classic:hover, [class*="rs-subtitle-1"] .rs-link_mode_classic:hover, [class*="rs-subtitle-2"] .rs-link_mode_classic:hover{
866
+ border-bottom-width:3px;
867
+ }
868
+ .rs-link_mode_rock{
869
+ --rs-link-color-hover:var(--rs-typography-rock-link-hover-color, #FFFFFF);
870
+ --rs-underline-color:var(--rs-typography-color-pale, #19191C);
871
+ border-bottom-color:#19191C;
872
+ border-bottom-color:var(--rs-underline-color);
873
+ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, #19191C), color-stop(0, transparent));
874
+ background-image:linear-gradient(to bottom, #19191C 100%, transparent 0);
875
+ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, var(--rs-underline-color)), color-stop(0, transparent));
876
+ background-image:linear-gradient(to bottom, var(--rs-underline-color) 100%, transparent 0);
877
+ background-size:auto 0;
878
+ background-repeat:repeat-x;
879
+ background-position:left calc(100% + 4px);
880
+ -webkit-transition:background-size 300ms, color 300ms;
881
+ transition:background-size 300ms, color 300ms;
882
+ }
883
+ @media all and (-ms-high-contrast: none){
884
+ .rs-link_mode_rock{
855
885
  -webkit-transition:none;
856
886
  transition:none;
857
887
  }
888
+ }
889
+ .rs-link_mode_rock:hover{
890
+ color:#FFFFFF;
891
+ color:var(--rs-link-color-hover);
892
+ background-size:auto calc(100% + 4px);
893
+ }
894
+ .rs-link_mode_standalone{
895
+ --rs-link-standalone-border-offset:1.15em;
896
+ --rs-link-color-hover:var(--rs-typography-color-hard, #19191C);
897
+ --rs-underline-color:transparent;
898
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #19191C);
899
+ border-bottom-color:transparent;
900
+ border-bottom-color:var(--rs-underline-color);
901
+ }
858
902
  .rs-link_mode_standalone:after{
859
903
  content:'\2192';
860
904
  display:inline;
@@ -867,13 +911,13 @@
867
911
  color:#19191C;
868
912
  color:var(--rs-link-color-hover);
869
913
  border-bottom-color:#19191C;
870
- border-bottom-color:var(--rs-underline-color);
914
+ border-bottom-color:var(--rs-underline-color-hover);
871
915
  -o-border-image:linear-gradient(to right, #19191C calc(100% - 1.1em), transparent 1.1em) 1;
872
916
  border-image:-webkit-gradient(linear, left top, right top, from(#19191C), color-stop(1.1em, transparent)) 1;
873
917
  border-image:linear-gradient(to right, #19191C calc(100% - 1.1em), transparent 1.1em) 1;
874
- -o-border-image:linear-gradient(to right, var(--rs-underline-color) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
875
- border-image:-webkit-gradient(linear, left top, right top, from(var(--rs-underline-color)), to(transparent)) 1;
876
- border-image:linear-gradient(to right, var(--rs-underline-color) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
918
+ -o-border-image:linear-gradient(to right, var(--rs-underline-color-hover) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
919
+ border-image:-webkit-gradient(linear, left top, right top, from(var(--rs-underline-color-hover)), to(transparent)) 1;
920
+ border-image:linear-gradient(to right, var(--rs-underline-color-hover) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
877
921
  }
878
922
  .rs-link_mode_standalone:hover:after{
879
923
  margin-right:0;
@@ -906,19 +950,17 @@
906
950
  .rs-link_mode_clear{
907
951
  --rs-link-color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
908
952
  --rs-link-color-hover:var(--rs-typography-color-hard, #19191C);
953
+ --rs-underline-color:transparent;
954
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #19191C);
909
955
  border-bottom-color:transparent;
910
- background-image:none;
911
- background-size:initial;
912
- background-repeat:initial;
913
- background-position:initial;
914
- -webkit-transition:none;
915
- transition:none;
956
+ border-bottom-color:var(--rs-underline-color);
916
957
  color:rgba(25,25,28,0.7);
917
958
  color:var(--rs-link-color);
918
959
  }
919
960
  .rs-link_mode_clear:hover{
920
961
  border-bottom-color:#19191C;
921
- border-bottom-color:var(--rs-underline-color);
962
+ border-bottom-color:var(--rs-underline-color-hover);
963
+
922
964
  color:#19191C;
923
965
  color:var(--rs-link-color-hover);
924
966
  }
@@ -933,26 +975,14 @@
933
975
  }
934
976
  .rs-link_theme_dark{
935
977
  --rs-link-color:var(--rs-typography-color-hard, #FFFFFF);
936
- --rs-link-color-hover:var(--rs-typography-text-link-hover-color, #19191C);
937
- --rs-underline-color:var(--rs-typography-color-hard, #FFFFFF);
938
978
  color:#FFFFFF;
939
979
  color:var(--rs-link-color);
940
- background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, #FFFFFF), color-stop(0, transparent));
941
- background-image:linear-gradient(to bottom, #FFFFFF 100%, transparent 0);
942
- background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, var(--rs-underline-color)), color-stop(0, transparent));
943
- background-image:linear-gradient(to bottom, var(--rs-underline-color) 100%, transparent 0);
944
- border-bottom-color:#FFFFFF;
945
- border-bottom-color:var(--rs-underline-color);
946
980
  }
947
981
  .rs-link_theme_dark:active,
948
982
  .rs-link_theme_dark:focus{
949
983
  color:#FFFFFF;
950
984
  color:var(--rs-link-color);
951
985
  }
952
- .rs-link_theme_dark:hover{
953
- color:#19191C;
954
- color:var(--rs-link-color-hover);
955
- }
956
986
  .rs-link_theme_dark:focus[data-focus-method='key']{
957
987
  -webkit-box-shadow:#428ad2 0 0 0 4px;
958
988
  -webkit-box-shadow:var(--rs-color-primary-dim-dark-theme, #428ad2) 0 0 0 4px;
@@ -961,35 +991,53 @@
961
991
  }
962
992
  [class*='_theme_dark'] .rs-link_theme_auto{
963
993
  --rs-link-color:var(--rs-typography-color-hard, #FFFFFF);
964
- --rs-link-color-hover:var(--rs-typography-text-link-hover-color, #19191C);
965
- --rs-underline-color:var(--rs-typography-color-hard, #FFFFFF);
966
994
  color:#FFFFFF;
967
995
  color:var(--rs-link-color);
968
- background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, #FFFFFF), color-stop(0, transparent));
969
- background-image:linear-gradient(to bottom, #FFFFFF 100%, transparent 0);
970
- background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, var(--rs-underline-color)), color-stop(0, transparent));
971
- background-image:linear-gradient(to bottom, var(--rs-underline-color) 100%, transparent 0);
972
- border-bottom-color:#FFFFFF;
973
- border-bottom-color:var(--rs-underline-color);
974
996
  }
975
997
  [class*='_theme_dark'] .rs-link_theme_auto:active,
976
998
  [class*='_theme_dark'] .rs-link_theme_auto:focus{
977
999
  color:#FFFFFF;
978
1000
  color:var(--rs-link-color);
979
1001
  }
980
- [class*='_theme_dark'] .rs-link_theme_auto:hover{
981
- color:#19191C;
982
- color:var(--rs-link-color-hover);
983
- }
984
1002
  [class*='_theme_dark'] .rs-link_theme_auto:focus[data-focus-method='key']{
985
1003
  -webkit-box-shadow:#428ad2 0 0 0 4px;
986
1004
  -webkit-box-shadow:var(--rs-color-primary-dim-dark-theme, #428ad2) 0 0 0 4px;
987
1005
  box-shadow:#428ad2 0 0 0 4px;
988
1006
  box-shadow:var(--rs-color-primary-dim-dark-theme, #428ad2) 0 0 0 4px;
989
1007
  }
1008
+ .rs-link_theme_dark.rs-link_mode_classic,
1009
+ [class*='_theme_dark'] .rs-link_theme_auto.rs-link_mode_classic{
1010
+ --rs-link-color-hover:var(--rs-typography-color-hard, #FFFFFF);
1011
+ --rs-underline-color:var(--rs-typography-classic-link-underline-color, rgba(255,255,255,0.4));
1012
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #FFFFFF);
1013
+ border-bottom-color:rgba(255,255,255,0.4);
1014
+ border-bottom-color:var(--rs-underline-color);
1015
+ }
1016
+ .rs-link_theme_dark.rs-link_mode_classic:hover, [class*='_theme_dark'] .rs-link_theme_auto.rs-link_mode_classic:hover{
1017
+ color:#FFFFFF;
1018
+ color:var(--rs-link-color-hover);
1019
+ border-bottom-color:#FFFFFF;
1020
+ border-bottom-color:var(--rs-underline-color-hover);
1021
+ }
1022
+ .rs-link_theme_dark.rs-link_mode_rock,
1023
+ [class*='_theme_dark'] .rs-link_theme_auto.rs-link_mode_rock{
1024
+ --rs-link-color-hover:var(--rs-typography-rock-link-hover-color, #19191C);
1025
+ --rs-underline-color:var(--rs-typography-color-hard, #FFFFFF);
1026
+ border-bottom-color:#FFFFFF;
1027
+ border-bottom-color:var(--rs-underline-color);
1028
+ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, #FFFFFF), color-stop(0, transparent));
1029
+ background-image:linear-gradient(to bottom, #FFFFFF 100%, transparent 0);
1030
+ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, var(--rs-underline-color)), color-stop(0, transparent));
1031
+ background-image:linear-gradient(to bottom, var(--rs-underline-color) 100%, transparent 0);
1032
+ }
1033
+ .rs-link_theme_dark.rs-link_mode_rock:hover, [class*='_theme_dark'] .rs-link_theme_auto.rs-link_mode_rock:hover{
1034
+ color:#19191C;
1035
+ color:var(--rs-link-color-hover);
1036
+ }
990
1037
  .rs-link_theme_dark.rs-link_mode_standalone,
991
1038
  [class*='_theme_dark'] .rs-link_theme_auto.rs-link_mode_standalone{
992
1039
  --rs-link-color-hover:var(--rs-typography-color-hard, #FFFFFF);
1040
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #FFFFFF);
993
1041
  background-image:none;
994
1042
  border-bottom-color:transparent;
995
1043
  }
@@ -997,28 +1045,27 @@
997
1045
  color:#FFFFFF;
998
1046
  color:var(--rs-link-color-hover);
999
1047
  border-bottom-color:#FFFFFF;
1000
- border-bottom-color:var(--rs-underline-color);
1048
+ border-bottom-color:var(--rs-underline-color-hover);
1001
1049
  -o-border-image:linear-gradient(to right, #FFFFFF calc(100% - 1.3em), transparent 1.3em) 1;
1002
1050
  border-image:-webkit-gradient(linear, left top, right top, from(#FFFFFF), color-stop(1.3em, transparent)) 1;
1003
1051
  border-image:linear-gradient(to right, #FFFFFF calc(100% - 1.3em), transparent 1.3em) 1;
1004
- -o-border-image:linear-gradient(to right, var(--rs-underline-color) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
1005
- border-image:-webkit-gradient(linear, left top, right top, from(var(--rs-underline-color)), to(transparent)) 1;
1006
- border-image:linear-gradient(to right, var(--rs-underline-color) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
1052
+ -o-border-image:linear-gradient(to right, var(--rs-underline-color-hover) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
1053
+ border-image:-webkit-gradient(linear, left top, right top, from(var(--rs-underline-color-hover)), to(transparent)) 1;
1054
+ border-image:linear-gradient(to right, var(--rs-underline-color-hover) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
1007
1055
  }
1008
1056
  .rs-link_theme_dark.rs-link_mode_clear,
1009
1057
  [class*='_theme_dark'] .rs-link_theme_auto.rs-link_mode_clear{
1010
1058
  --rs-link-color:var(--rs-typography-color-average, rgba(255,255,255,0.7));
1011
1059
  --rs-link-color-hover:var(--rs-typography-color-hard, #FFFFFF);
1012
- background-image:none;
1013
- border-bottom-color:transparent;
1060
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #FFFFFF);
1014
1061
  color:rgba(255,255,255,0.7);
1015
1062
  color:var(--rs-link-color);
1016
1063
  }
1017
1064
  .rs-link_theme_dark.rs-link_mode_clear:hover, [class*='_theme_dark'] .rs-link_theme_auto.rs-link_mode_clear:hover{
1018
- border-bottom-color:#FFFFFF;
1019
- border-bottom-color:var(--rs-underline-color);
1020
1065
  color:#FFFFFF;
1021
1066
  color:var(--rs-link-color-hover);
1067
+ border-bottom-color:#FFFFFF;
1068
+ border-bottom-color:var(--rs-underline-color-hover);
1022
1069
  }
1023
1070
  .rs-link_theme_dark.rs-link_hardness_hard,
1024
1071
  [class*='_theme_dark'] .rs-link_theme_auto.rs-link_hardness_hard{
package/lib/mixins.pcss CHANGED
@@ -4,7 +4,8 @@
4
4
  --rs-typography-color-pale:rgba(25,25,28,0.5);
5
5
  --rs-typography-pre-color:#19191C;
6
6
  --rs-typography-pre-bg-color:rgba(25,25,28,0.1);
7
- --rs-typography-text-link-hover-color:#FFFFFF;
7
+ --rs-typography-classic-link-underline-color:rgba(25,25,28,0.4);
8
+ --rs-typography-rock-link-hover-color:#FFFFFF;
8
9
  }
9
10
  @define-mixin rs-typography-dark{
10
11
  --rs-typography-color-hard:#FFFFFF;
@@ -12,7 +13,8 @@
12
13
  --rs-typography-color-pale:rgba(255,255,255,0.5);
13
14
  --rs-typography-pre-color:rgba(255,255,255,0.7);
14
15
  --rs-typography-pre-bg-color:rgba(255,255,255,0.1);
15
- --rs-typography-text-link-hover-color:#19191C;
16
+ --rs-typography-classic-link-underline-color:rgba(255,255,255,0.4);
17
+ --rs-typography-rock-link-hover-color:#19191C;
16
18
  }
17
19
  @define-mixin rs-font-smoothing{
18
20
  text-rendering:optimizeLegibility;
@@ -684,9 +686,9 @@
684
686
  background:transparent !important;
685
687
  color:inherit !important;
686
688
 
687
- font-family:SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
689
+ font-family:'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
688
690
 
689
- font-family:var(--rs-font-family-mono, SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
691
+ font-family:var(--rs-font-family-mono, 'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
690
692
  line-height:inherit;
691
693
  }
692
694
  @define-mixin rs-pre{
@@ -703,9 +705,9 @@
703
705
 
704
706
  word-wrap:normal;
705
707
 
706
- font-family:SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
708
+ font-family:'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
707
709
 
708
- font-family:var(--rs-font-family-mono, SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
710
+ font-family:var(--rs-font-family-mono, 'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
709
711
 
710
712
  font-size:16px;
711
713
  line-height:24px;
@@ -747,9 +749,9 @@
747
749
  background-color:rgba(25,25,28,0.1);
748
750
  background-color:var(--rs-typography-pre-bg-color, rgba(25,25,28,0.1));
749
751
 
750
- font-family:SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
752
+ font-family:'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace;
751
753
 
752
- font-family:var(--rs-font-family-mono, SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
754
+ font-family:var(--rs-font-family-mono, 'JetBrains Mono', SFMono-Regular, Consolas, 'Liberation Mono', Menlo, Courier, monospace);
753
755
 
754
756
  font-size:90%;
755
757
  line-height:inherit;
@@ -773,8 +775,9 @@
773
775
  }
774
776
  @define-mixin rs-link{
775
777
  --rs-link-color:var(--rs-typography-color-hard, #19191C);
776
- --rs-link-color-hover:var(--rs-typography-text-link-hover-color, #FFFFFF);
777
- --rs-underline-color:var(--rs-typography-color-hard, #19191C);
778
+
779
+ color:#19191C;
780
+ color:var(--rs-link-color);
778
781
 
779
782
  padding-bottom:1px;
780
783
 
@@ -782,28 +785,11 @@
782
785
 
783
786
  cursor:pointer;
784
787
  text-decoration:none;
785
- color:#19191C;
786
- color:var(--rs-link-color);
787
788
 
788
789
  font-size:inherit;
789
790
  line-height:inherit;
790
- border-bottom:1px solid #19191C;
791
- border-bottom:1px solid var(--rs-underline-color);
792
-
793
- background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, #19191C), color-stop(0, transparent));
794
-
795
- background-image:linear-gradient(to bottom, #19191C 100%, transparent 0);
796
- background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, var(--rs-underline-color)), color-stop(0, transparent));
797
- background-image:linear-gradient(to bottom, var(--rs-underline-color) 100%, transparent 0);
798
- background-size:auto 0;
799
- background-repeat:repeat-x;
800
- background-position:left calc(100% + 4px);
801
- -webkit-transition:background-size 300ms, color 300ms;
802
- transition:background-size 300ms, color 300ms;
803
- @media all and (-ms-high-contrast: none){
804
- -webkit-transition:none;
805
- transition:none;
806
- }
791
+ border-bottom-style:solid;
792
+ border-bottom-width:1px;
807
793
 
808
794
  &:active,
809
795
  &:focus{
@@ -813,9 +799,6 @@
813
799
 
814
800
  &:hover{
815
801
  text-decoration:none;
816
- color:#FFFFFF;
817
- color:var(--rs-link-color-hover);
818
- background-size:auto calc(100% + 4px);
819
802
  }
820
803
 
821
804
  &:focus[data-focus-method='key']{
@@ -826,12 +809,33 @@
826
809
  }
827
810
 
828
811
  [class*="rs-super-hero"] &{
829
- @mixin rs-link-border-5;
812
+ border-bottom-width:4px;
813
+ }
814
+
815
+ @media screen and (max-width: 1000px){
816
+
817
+ [class*="rs-super-hero"] &{
818
+ border-bottom-width:3px
830
819
  }
820
+ }
821
+
822
+ @media screen and (max-width: 640px){
823
+
824
+ [class*="rs-super-hero"] &{
825
+ border-bottom-width:2px
826
+ }
827
+ }
828
+
829
+ [class*="rs-hero"] &{
830
+ border-bottom-width:3px;
831
+ }
832
+
833
+ @media screen and (max-width: 640px){
831
834
 
832
835
  [class*="rs-hero"] &{
833
- @mixin rs-link-border-4;
836
+ border-bottom-width:2px
834
837
  }
838
+ }
835
839
 
836
840
  [class*="rs-h1"] &,
837
841
  [class*="rs-h2"] &,
@@ -841,7 +845,7 @@
841
845
  [class*="rs-overline"] &,
842
846
  [class*="rs-subtitle-1"] &,
843
847
  [class*="rs-subtitle-2"] &{
844
- @mixin rs-link-border-2;
848
+ border-bottom-width:2px;
845
849
  }
846
850
  }
847
851
  @define-mixin rs-link-external{
@@ -852,16 +856,84 @@
852
856
  margin-left:0;
853
857
  }
854
858
  }
855
- @define-mixin rs-link-mode-standalone{
859
+ @define-mixin rs-link-mode-classic{
856
860
  --rs-link-color-hover:var(--rs-typography-color-hard, #19191C);
861
+ --rs-underline-color:var(--rs-typography-classic-link-underline-color, rgba(25,25,28,0.4));
862
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #19191C);
863
+
864
+ border-bottom-color:rgba(25,25,28,0.4);
865
+ border-bottom-color:var(--rs-underline-color);
866
+
867
+ &:hover{
868
+ color:#19191C;
869
+ color:var(--rs-link-color-hover);
870
+ border-bottom-color:#19191C;
871
+ border-bottom-color:var(--rs-underline-color-hover);
872
+ border-bottom-width:2px;
873
+ padding-bottom:0;
874
+ }
875
+ [class*="rs-super-hero"] &:hover{
876
+ border-bottom-width:5px;
877
+ }
878
+
879
+ @media screen and (max-width: 1000px){
880
+ [class*="rs-super-hero"] &:hover{
881
+ border-bottom-width:4px
882
+ }
883
+ }
884
+
885
+ @media screen and (max-width: 640px){
886
+ [class*="rs-super-hero"] &:hover{
887
+ border-bottom-width:3px
888
+ }
889
+ }
890
+ [class*="rs-hero"] &:hover{
891
+ border-bottom-width:4px;
892
+ }
893
+
894
+ @media screen and (max-width: 640px){
895
+ [class*="rs-hero"] &:hover{
896
+ border-bottom-width:3px
897
+ }
898
+ }
899
+ [class*="rs-h1"] &:hover, [class*="rs-h2"] &:hover, [class*="rs-h3"] &:hover, [class*="rs-h4"] &:hover, [class*="rs-h5"] &:hover, [class*="rs-overline"] &:hover, [class*="rs-subtitle-1"] &:hover, [class*="rs-subtitle-2"] &:hover{
900
+ border-bottom-width:3px;
901
+ }
902
+ }
903
+ @define-mixin rs-link-mode-rock{
904
+ --rs-link-color-hover:var(--rs-typography-rock-link-hover-color, #FFFFFF);
905
+ --rs-underline-color:var(--rs-typography-color-pale, #19191C);
906
+
907
+ border-bottom-color:#19191C;
908
+ border-bottom-color:var(--rs-underline-color);
909
+ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, #19191C), color-stop(0, transparent));
910
+ background-image:linear-gradient(to bottom, #19191C 100%, transparent 0);
911
+ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, var(--rs-underline-color)), color-stop(0, transparent));
912
+ background-image:linear-gradient(to bottom, var(--rs-underline-color) 100%, transparent 0);
913
+ background-size:auto 0;
914
+ background-repeat:repeat-x;
915
+ background-position:left calc(100% + 4px);
916
+ -webkit-transition:background-size 300ms, color 300ms;
917
+ transition:background-size 300ms, color 300ms;
918
+ @media all and (-ms-high-contrast: none){
919
+ -webkit-transition:none;
920
+ transition:none;
921
+ }
922
+
923
+ &:hover{
924
+ color:#FFFFFF;
925
+ color:var(--rs-link-color-hover);
926
+ background-size:auto calc(100% + 4px);
927
+ }
928
+ }
929
+ @define-mixin rs-link-mode-standalone{
857
930
  --rs-link-standalone-border-offset:1.15em;
931
+ --rs-link-color-hover:var(--rs-typography-color-hard, #19191C);
932
+ --rs-underline-color:transparent;
933
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #19191C);
934
+
858
935
  border-bottom-color:transparent;
859
- background-image:none;
860
- background-size:initial;
861
- background-repeat:initial;
862
- background-position:initial;
863
- -webkit-transition:none;
864
- transition:none;
936
+ border-bottom-color:var(--rs-underline-color);
865
937
 
866
938
  &:after{
867
939
  content:'\2192';
@@ -876,13 +948,13 @@
876
948
  color:#19191C;
877
949
  color:var(--rs-link-color-hover);
878
950
  border-bottom-color:#19191C;
879
- border-bottom-color:var(--rs-underline-color);
951
+ border-bottom-color:var(--rs-underline-color-hover);
880
952
  -o-border-image:linear-gradient(to right, #19191C calc(100% - 1.1em), transparent 1.1em) 1;
881
953
  border-image:-webkit-gradient(linear, left top, right top, from(#19191C), color-stop(1.1em, transparent)) 1;
882
954
  border-image:linear-gradient(to right, #19191C calc(100% - 1.1em), transparent 1.1em) 1;
883
- -o-border-image:linear-gradient(to right, var(--rs-underline-color) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
884
- border-image:-webkit-gradient(linear, left top, right top, from(var(--rs-underline-color)), to(transparent)) 1;
885
- border-image:linear-gradient(to right, var(--rs-underline-color) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
955
+ -o-border-image:linear-gradient(to right, var(--rs-underline-color-hover) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
956
+ border-image:-webkit-gradient(linear, left top, right top, from(var(--rs-underline-color-hover)), to(transparent)) 1;
957
+ border-image:linear-gradient(to right, var(--rs-underline-color-hover) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
886
958
  }
887
959
 
888
960
  &:hover:after{
@@ -911,48 +983,23 @@
911
983
  @define-mixin rs-link-mode-clear{
912
984
  --rs-link-color:var(--rs-typography-color-average, rgba(25,25,28,0.7));
913
985
  --rs-link-color-hover:var(--rs-typography-color-hard, #19191C);
986
+ --rs-underline-color:transparent;
987
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #19191C);
914
988
 
915
989
  border-bottom-color:transparent;
916
- background-image:none;
917
- background-size:initial;
918
- background-repeat:initial;
919
- background-position:initial;
920
- -webkit-transition:none;
921
- transition:none;
990
+ border-bottom-color:var(--rs-underline-color);
922
991
 
923
992
  color:rgba(25,25,28,0.7);
924
993
  color:var(--rs-link-color);
925
994
 
926
995
  &:hover{
927
996
  border-bottom-color:#19191C;
928
- border-bottom-color:var(--rs-underline-color);
997
+ border-bottom-color:var(--rs-underline-color-hover);
998
+
929
999
  color:#19191C;
930
1000
  color:var(--rs-link-color-hover);
931
1001
  }
932
1002
  }
933
- @define-mixin rs-link-border-5{
934
- padding-bottom:0;
935
-
936
- border-bottom-width:5px;
937
-
938
- @media screen and (max-width: 640px){
939
- border-bottom-width:2px;
940
- }
941
- }
942
- @define-mixin rs-link-border-4{
943
- padding-bottom:0;
944
-
945
- border-bottom-width:4px;
946
-
947
- @media screen and (max-width: 640px){
948
- border-bottom-width:2px;
949
- }
950
- }
951
- @define-mixin rs-link-border-2{
952
- padding-bottom:0;
953
-
954
- border-bottom-width:2px;
955
- }
956
1003
  @define-mixin rs-link-hardness-hard-theme-dark{
957
1004
  --rs-link-color:var(--rs-typography-color-hard, #FFFFFF);
958
1005
  }
@@ -964,31 +1011,15 @@
964
1011
  }
965
1012
  @define-mixin rs-link-theme-dark{
966
1013
  --rs-link-color:var(--rs-typography-color-hard, #FFFFFF);
967
- --rs-link-color-hover:var(--rs-typography-text-link-hover-color, #19191C);
968
- --rs-underline-color:var(--rs-typography-color-hard, #FFFFFF);
969
-
970
1014
  color:#FFFFFF;
971
1015
  color:var(--rs-link-color);
972
1016
 
973
- background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, #FFFFFF), color-stop(0, transparent));
974
-
975
- background-image:linear-gradient(to bottom, #FFFFFF 100%, transparent 0);
976
- background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, var(--rs-underline-color)), color-stop(0, transparent));
977
- background-image:linear-gradient(to bottom, var(--rs-underline-color) 100%, transparent 0);
978
- border-bottom-color:#FFFFFF;
979
- border-bottom-color:var(--rs-underline-color);
980
-
981
1017
  &:active,
982
1018
  &:focus{
983
1019
  color:#FFFFFF;
984
1020
  color:var(--rs-link-color);
985
1021
  }
986
1022
 
987
- &:hover{
988
- color:#19191C;
989
- color:var(--rs-link-color-hover);
990
- }
991
-
992
1023
  &:focus[data-focus-method='key']{
993
1024
  -webkit-box-shadow:#428ad2 0 0 0 4px;
994
1025
  -webkit-box-shadow:var(--rs-color-primary-dim-dark-theme, #428ad2) 0 0 0 4px;
@@ -996,38 +1027,72 @@
996
1027
  box-shadow:var(--rs-color-primary-dim-dark-theme, #428ad2) 0 0 0 4px;
997
1028
  }
998
1029
  }
1030
+ @define-mixin rs-link-mode-classic-theme-dark{
1031
+ --rs-link-color-hover:var(--rs-typography-color-hard, #FFFFFF);
1032
+ --rs-underline-color:var(--rs-typography-classic-link-underline-color, rgba(255,255,255,0.4));
1033
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #FFFFFF);
1034
+
1035
+ border-bottom-color:rgba(255,255,255,0.4);
1036
+ border-bottom-color:var(--rs-underline-color);
1037
+
1038
+ &:hover{
1039
+ color:#FFFFFF;
1040
+ color:var(--rs-link-color-hover);
1041
+ border-bottom-color:#FFFFFF;
1042
+ border-bottom-color:var(--rs-underline-color-hover);
1043
+ }
1044
+ }
1045
+ @define-mixin rs-link-mode-rock-theme-dark{
1046
+ --rs-link-color-hover:var(--rs-typography-rock-link-hover-color, #19191C);
1047
+ --rs-underline-color:var(--rs-typography-color-hard, #FFFFFF);
1048
+
1049
+ border-bottom-color:#FFFFFF;
1050
+ border-bottom-color:var(--rs-underline-color);
1051
+
1052
+ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, #FFFFFF), color-stop(0, transparent));
1053
+
1054
+ background-image:linear-gradient(to bottom, #FFFFFF 100%, transparent 0);
1055
+ background-image:-webkit-gradient(linear, left top, left bottom, color-stop(100%, var(--rs-underline-color)), color-stop(0, transparent));
1056
+ background-image:linear-gradient(to bottom, var(--rs-underline-color) 100%, transparent 0);
1057
+
1058
+ &:hover{
1059
+ color:#19191C;
1060
+ color:var(--rs-link-color-hover);
1061
+ }
1062
+ }
999
1063
  @define-mixin rs-link-mode-standalone-theme-dark{
1000
1064
  --rs-link-color-hover:var(--rs-typography-color-hard, #FFFFFF);
1065
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #FFFFFF);
1001
1066
 
1002
1067
  background-image:none;
1003
1068
  border-bottom-color:transparent;
1069
+
1004
1070
  &:hover{
1005
1071
  color:#FFFFFF;
1006
1072
  color:var(--rs-link-color-hover);
1007
1073
  border-bottom-color:#FFFFFF;
1008
- border-bottom-color:var(--rs-underline-color);
1074
+ border-bottom-color:var(--rs-underline-color-hover);
1009
1075
  -o-border-image:linear-gradient(to right, #FFFFFF calc(100% - 1.3em), transparent 1.3em) 1;
1010
1076
  border-image:-webkit-gradient(linear, left top, right top, from(#FFFFFF), color-stop(1.3em, transparent)) 1;
1011
1077
  border-image:linear-gradient(to right, #FFFFFF calc(100% - 1.3em), transparent 1.3em) 1;
1012
- -o-border-image:linear-gradient(to right, var(--rs-underline-color) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
1013
- border-image:-webkit-gradient(linear, left top, right top, from(var(--rs-underline-color)), to(transparent)) 1;
1014
- border-image:linear-gradient(to right, var(--rs-underline-color) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
1078
+ -o-border-image:linear-gradient(to right, var(--rs-underline-color-hover) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
1079
+ border-image:-webkit-gradient(linear, left top, right top, from(var(--rs-underline-color-hover)), to(transparent)) 1;
1080
+ border-image:linear-gradient(to right, var(--rs-underline-color-hover) calc(100% - var(--rs-link-standalone-border-offset)), transparent var(--rs-link-standalone-border-offset)) 1;
1015
1081
  }
1016
1082
  }
1017
1083
  @define-mixin rs-link-mode-clear-theme-dark{
1018
1084
  --rs-link-color:var(--rs-typography-color-average, rgba(255,255,255,0.7));
1019
1085
  --rs-link-color-hover:var(--rs-typography-color-hard, #FFFFFF);
1086
+ --rs-underline-color-hover:var(--rs-typography-color-hard, #FFFFFF);
1020
1087
 
1021
- background-image:none;
1022
- border-bottom-color:transparent;
1023
1088
  color:rgba(255,255,255,0.7);
1024
1089
  color:var(--rs-link-color);
1025
1090
 
1026
1091
  &:hover{
1027
- border-bottom-color:#FFFFFF;
1028
- border-bottom-color:var(--rs-underline-color);
1029
1092
  color:#FFFFFF;
1030
1093
  color:var(--rs-link-color-hover);
1094
+ border-bottom-color:#FFFFFF;
1095
+ border-bottom-color:var(--rs-underline-color-hover);
1031
1096
  }
1032
1097
  }
1033
1098
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/typography",
3
- "version": "0.4.0",
3
+ "version": "0.5.0",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -40,5 +40,5 @@
40
40
  "build": "rescui-scripts build --no-css-modules && yarn run build-mixins && shx cp src/font-*.css lib",
41
41
  "build-mixins": "rescui-scripts postcss --glob mixins.pcss --config ./.postcssrc-mixins.js --no-clean-out && shx mv lib/mixins.css lib/mixins.pcss && shx rm lib/mixins.css.map"
42
42
  },
43
- "gitHead": "6b1d206de2641861028760d73f33dee214c07911"
43
+ "gitHead": "f07b6abc886028f74f129d1d7bfbf8fcfa5825af"
44
44
  }