@rescui/typography 0.13.0 → 0.15.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.
@@ -5,7 +5,7 @@ export declare type Texts = 'rs-text-1' | 'rs-text-2' | 'rs-text-3';
5
5
  export declare type Link = 'rs-link';
6
6
  export declare type OrderedList = 'rs-ol';
7
7
  export declare type UnorderedList = 'rs-ul';
8
- export declare type Others = 'rs-super-hero' | 'rs-digits-1' | 'rs-digits-2' | 'rs-hero' | 'rs-subtitle-1' | 'rs-h1' | 'rs-subtitle-2' | 'rs-h2' | 'rs-h3' | 'rs-h4' | 'rs-h5' | 'rs-overline' | 'rs-pre' | 'rs-code' | 'rs-link' | 'rs-article';
8
+ export declare type Others = 'rs-super-hero' | 'rs-middle-hero' | 'rs-digits-1' | 'rs-digits-2' | 'rs-hero' | 'rs-subtitle-1' | 'rs-h1' | 'rs-subtitle-2' | 'rs-h2' | 'rs-h3' | 'rs-h4' | 'rs-h5' | 'rs-overline' | 'rs-pre' | 'rs-code' | 'rs-link' | 'rs-article';
9
9
  export declare type Type = Texts | Link | OrderedList | Others | UnorderedList;
10
10
  export declare type Hardness = 'average' | 'hard' | 'pale';
11
11
  export declare type TextsParams = {
@@ -1,7 +1,7 @@
1
1
  import _includesInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/includes";
2
2
  import { useTheme } from '@rescui/ui-contexts';
3
3
  import bemCnFast from 'bem-cn-fast';
4
- var THEMED_TYPES = ['rs-super-hero', 'rs-digits-1', 'rs-digits-2', 'rs-hero', 'rs-subtitle-1', 'rs-h1', 'rs-subtitle-2', 'rs-h2', 'rs-h3', 'rs-h4', 'rs-h5', 'rs-overline', 'rs-pre', 'rs-code', 'rs-link', 'rs-article', 'rs-text-1', 'rs-text-2', 'rs-text-3', 'rs-link'];
4
+ var THEMED_TYPES = ['rs-super-hero', 'rs-middle-hero', 'rs-digits-1', 'rs-digits-2', 'rs-hero', 'rs-subtitle-1', 'rs-h1', 'rs-subtitle-2', 'rs-h2', 'rs-h3', 'rs-h4', 'rs-h5', 'rs-overline', 'rs-pre', 'rs-code', 'rs-link', 'rs-article', 'rs-text-1', 'rs-text-2', 'rs-text-3', 'rs-link'];
5
5
 
6
6
  function createTextCn(theme) {
7
7
  if (!theme) {
package/lib/index.css CHANGED
@@ -18,16 +18,16 @@
18
18
  }
19
19
  @media screen and (max-width: 1000px){
20
20
  .rs-super-hero{
21
- --rs-super-hero-font-size:var(--rs-hero-font-size, 72px);
22
- --rs-super-hero-line-height:var(--rs-hero-line-height, 72px);
23
- letter-spacing:-0.005em;
21
+ --rs-super-hero-font-size:var(--rs-middle-hero-font-size, 92px);
22
+ --rs-super-hero-line-height:var(--rs-middle-hero-line-height, 92px);
23
+ letter-spacing:-0.008em;
24
24
  }
25
25
  }
26
26
  @media screen and (max-width: 640px){
27
27
  .rs-super-hero{
28
- --rs-super-hero-font-size:var(--rs-hero-font-size-mobile, 42px);
29
- --rs-super-hero-line-height:var(--rs-hero-line-height-mobile, 50px);
30
- letter-spacing:-0.001em;
28
+ --rs-super-hero-font-size:var(--rs-middle-hero-font-size-mobile, 58px);
29
+ --rs-super-hero-line-height:var(--rs-middle-hero-line-height-mobile, 62px);
30
+ letter-spacing:-0.0007em;
31
31
  }
32
32
  }
33
33
  .rs-reset-letter-spacing .rs-super-hero{
@@ -45,6 +45,41 @@
45
45
  color:#FFFFFF;
46
46
  color:var(--rs-typography-color-hard, #FFFFFF);
47
47
  }
48
+ .rs-middle-hero{
49
+ letter-spacing:-0.008em;
50
+ font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
51
+ font-family:var(--rs-font-family-headers, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
52
+ -webkit-font-feature-settings:"kern", "liga", "calt";
53
+ font-feature-settings:"kern", "liga", "calt";
54
+ font-size:92px;
55
+ font-size:var(--rs-middle-hero-font-size, 92px);
56
+ font-weight:600;
57
+ font-weight:var(--rs-font-weight-semi-bold, 600);
58
+ line-height:92px;
59
+ line-height:var(--rs-middle-hero-line-height, 92px);
60
+ }
61
+ @media screen and (max-width: 640px){
62
+ .rs-middle-hero{
63
+ --rs-middle-hero-font-size:var(--rs-middle-hero-font-size-mobile, 58px);
64
+ --rs-middle-hero-line-height:var(--rs-middle-hero-line-height-mobile, 62px);
65
+ letter-spacing:-0.0007em;
66
+ }
67
+ }
68
+ .rs-reset-letter-spacing .rs-middle-hero{
69
+ letter-spacing:normal;
70
+ }
71
+ .rs-middle-hero {
72
+ color:#19191C;
73
+ color:var(--rs-typography-color-hard, #19191C);
74
+ }
75
+ .rs-middle-hero_theme_dark{
76
+ color:#FFFFFF;
77
+ color:var(--rs-typography-color-hard, #FFFFFF);
78
+ }
79
+ [class*='_theme_dark'] .rs-middle-hero_theme_auto{
80
+ color:#FFFFFF;
81
+ color:var(--rs-typography-color-hard, #FFFFFF);
82
+ }
48
83
  .rs-digits-1{
49
84
  letter-spacing:-0.005em;
50
85
  font-variant-numeric:tabular-nums;
@@ -886,6 +921,14 @@
886
921
  border-bottom-width:2px
887
922
  }
888
923
  }
924
+ [class*="rs-middle-hero"] .rs-link{
925
+ border-bottom-width:3px;
926
+ }
927
+ @media screen and (max-width: 640px){
928
+ [class*="rs-middle-hero"] .rs-link{
929
+ border-bottom-width:2px
930
+ }
931
+ }
889
932
  [class*="rs-hero"] .rs-link{
890
933
  border-bottom-width:3px;
891
934
  }
@@ -938,6 +981,14 @@
938
981
  border-bottom-width:3px
939
982
  }
940
983
  }
984
+ [class*="rs-middle-hero"] .rs-link_mode_classic:hover{
985
+ border-bottom-width:4px;
986
+ }
987
+ @media screen and (max-width: 640px){
988
+ [class*="rs-middle-hero"] .rs-link_mode_classic:hover{
989
+ border-bottom-width:3px
990
+ }
991
+ }
941
992
  [class*="rs-hero"] .rs-link_mode_classic:hover{
942
993
  border-bottom-width:4px;
943
994
  }
@@ -1008,6 +1059,7 @@
1008
1059
  margin-left:0.3em;
1009
1060
  }
1010
1061
  [class*="rs-super-hero"] .rs-link_mode_standalone,
1062
+ [class*="rs-middle-hero"] .rs-link_mode_standalone,
1011
1063
  [class*="rs-hero"] .rs-link_mode_standalone,
1012
1064
  [class*="rs-h1"] .rs-link_mode_standalone,
1013
1065
  [class*="rs-h2"] .rs-link_mode_standalone{
@@ -1023,6 +1075,7 @@
1023
1075
  content:'\2197';
1024
1076
  }
1025
1077
  [class*="rs-super-hero"] .rs-link_mode_standalone.rs-link_external,
1078
+ [class*="rs-middle-hero"] .rs-link_mode_standalone.rs-link_external,
1026
1079
  [class*="rs-hero"] .rs-link_mode_standalone.rs-link_external,
1027
1080
  [class*="rs-h1"] .rs-link_mode_standalone.rs-link_external,
1028
1081
  [class*="rs-h2"] .rs-link_mode_standalone.rs-link_external{
package/lib/mixins.p.css CHANGED
@@ -65,15 +65,15 @@
65
65
  line-height:var(--rs-super-hero-line-height, 142px);
66
66
 
67
67
  @media screen and (max-width: 1000px){
68
- --rs-super-hero-font-size:var(--rs-hero-font-size, 72px);
69
- --rs-super-hero-line-height:var(--rs-hero-line-height, 72px);
70
- letter-spacing:-0.005em;
68
+ --rs-super-hero-font-size:var(--rs-middle-hero-font-size, 92px);
69
+ --rs-super-hero-line-height:var(--rs-middle-hero-line-height, 92px);
70
+ letter-spacing:-0.008em;
71
71
  }
72
72
 
73
73
  @media screen and (max-width: 640px){
74
- --rs-super-hero-font-size:var(--rs-hero-font-size-mobile, 42px);
75
- --rs-super-hero-line-height:var(--rs-hero-line-height-mobile, 50px);
76
- letter-spacing:-0.001em;
74
+ --rs-super-hero-font-size:var(--rs-middle-hero-font-size-mobile, 58px);
75
+ --rs-super-hero-line-height:var(--rs-middle-hero-line-height-mobile, 62px);
76
+ letter-spacing:-0.0007em;
77
77
  }
78
78
 
79
79
  .rs-reset-letter-spacing &{
@@ -91,6 +91,46 @@
91
91
  margin-top:96px;
92
92
  margin-top:calc(var(--rs-flow-unit, 8px)*12);
93
93
  }
94
+ @define-mixin rs-middle-hero-base{
95
+ letter-spacing:-0.008em;
96
+
97
+ font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
98
+
99
+ font-family:var(--rs-font-family-headers, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
100
+ -webkit-font-feature-settings:"kern", "liga", "calt";
101
+ font-feature-settings:"kern", "liga", "calt";
102
+
103
+ font-size:92px;
104
+
105
+ font-size:var(--rs-middle-hero-font-size, 92px);
106
+ font-weight:600;
107
+ font-weight:var(--rs-font-weight-semi-bold, 600);
108
+
109
+ line-height:92px;
110
+
111
+ line-height:var(--rs-middle-hero-line-height, 92px);
112
+
113
+ @media screen and (max-width: 640px){
114
+ --rs-middle-hero-font-size:var(--rs-middle-hero-font-size-mobile, 58px);
115
+ --rs-middle-hero-line-height:var(--rs-middle-hero-line-height-mobile, 62px);
116
+ letter-spacing:-0.0007em;
117
+ }
118
+
119
+ .rs-reset-letter-spacing &{
120
+ letter-spacing:normal;
121
+ }
122
+ }
123
+ @define-mixin rs-middle-hero{
124
+ @mixin rs-middle-hero-base;
125
+ @mixin rs-text-hardness-hard;
126
+ }
127
+ @define-mixin rs-middle-hero-theme-dark{
128
+ @mixin rs-text-hardness-hard-theme-dark;
129
+ }
130
+ @define-mixin rs-middle-hero-offset-top{
131
+ margin-top:96px;
132
+ margin-top:calc(var(--rs-flow-unit, 8px)*12);
133
+ }
94
134
  @define-mixin rs-digits-1-base{
95
135
  letter-spacing:-0.005em;
96
136
 
@@ -892,6 +932,17 @@
892
932
  }
893
933
  }
894
934
 
935
+ [class*="rs-middle-hero"] &{
936
+ border-bottom-width:3px;
937
+ }
938
+
939
+ @media screen and (max-width: 640px){
940
+
941
+ [class*="rs-middle-hero"] &{
942
+ border-bottom-width:2px
943
+ }
944
+ }
945
+
895
946
  [class*="rs-hero"] &{
896
947
  border-bottom-width:3px;
897
948
  }
@@ -953,6 +1004,15 @@
953
1004
  border-bottom-width:3px
954
1005
  }
955
1006
  }
1007
+ [class*="rs-middle-hero"] &:hover{
1008
+ border-bottom-width:4px;
1009
+ }
1010
+
1011
+ @media screen and (max-width: 640px){
1012
+ [class*="rs-middle-hero"] &:hover{
1013
+ border-bottom-width:3px
1014
+ }
1015
+ }
956
1016
  [class*="rs-hero"] &:hover{
957
1017
  border-bottom-width:4px;
958
1018
  }
package/lib/mixins.pcss CHANGED
@@ -65,15 +65,15 @@
65
65
  line-height:var(--rs-super-hero-line-height, 142px);
66
66
 
67
67
  @media screen and (max-width: 1000px){
68
- --rs-super-hero-font-size:var(--rs-hero-font-size, 72px);
69
- --rs-super-hero-line-height:var(--rs-hero-line-height, 72px);
70
- letter-spacing:-0.005em;
68
+ --rs-super-hero-font-size:var(--rs-middle-hero-font-size, 92px);
69
+ --rs-super-hero-line-height:var(--rs-middle-hero-line-height, 92px);
70
+ letter-spacing:-0.008em;
71
71
  }
72
72
 
73
73
  @media screen and (max-width: 640px){
74
- --rs-super-hero-font-size:var(--rs-hero-font-size-mobile, 42px);
75
- --rs-super-hero-line-height:var(--rs-hero-line-height-mobile, 50px);
76
- letter-spacing:-0.001em;
74
+ --rs-super-hero-font-size:var(--rs-middle-hero-font-size-mobile, 58px);
75
+ --rs-super-hero-line-height:var(--rs-middle-hero-line-height-mobile, 62px);
76
+ letter-spacing:-0.0007em;
77
77
  }
78
78
 
79
79
  .rs-reset-letter-spacing &{
@@ -91,6 +91,46 @@
91
91
  margin-top:96px;
92
92
  margin-top:calc(var(--rs-flow-unit, 8px)*12);
93
93
  }
94
+ @define-mixin rs-middle-hero-base{
95
+ letter-spacing:-0.008em;
96
+
97
+ font-family:'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
98
+
99
+ font-family:var(--rs-font-family-headers, var(--rs-font-family-jb-sans, 'JetBrains Sans', Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif));
100
+ -webkit-font-feature-settings:"kern", "liga", "calt";
101
+ font-feature-settings:"kern", "liga", "calt";
102
+
103
+ font-size:92px;
104
+
105
+ font-size:var(--rs-middle-hero-font-size, 92px);
106
+ font-weight:600;
107
+ font-weight:var(--rs-font-weight-semi-bold, 600);
108
+
109
+ line-height:92px;
110
+
111
+ line-height:var(--rs-middle-hero-line-height, 92px);
112
+
113
+ @media screen and (max-width: 640px){
114
+ --rs-middle-hero-font-size:var(--rs-middle-hero-font-size-mobile, 58px);
115
+ --rs-middle-hero-line-height:var(--rs-middle-hero-line-height-mobile, 62px);
116
+ letter-spacing:-0.0007em;
117
+ }
118
+
119
+ .rs-reset-letter-spacing &{
120
+ letter-spacing:normal;
121
+ }
122
+ }
123
+ @define-mixin rs-middle-hero{
124
+ @mixin rs-middle-hero-base;
125
+ @mixin rs-text-hardness-hard;
126
+ }
127
+ @define-mixin rs-middle-hero-theme-dark{
128
+ @mixin rs-text-hardness-hard-theme-dark;
129
+ }
130
+ @define-mixin rs-middle-hero-offset-top{
131
+ margin-top:96px;
132
+ margin-top:calc(var(--rs-flow-unit, 8px)*12);
133
+ }
94
134
  @define-mixin rs-digits-1-base{
95
135
  letter-spacing:-0.005em;
96
136
 
@@ -892,6 +932,17 @@
892
932
  }
893
933
  }
894
934
 
935
+ [class*="rs-middle-hero"] &{
936
+ border-bottom-width:3px;
937
+ }
938
+
939
+ @media screen and (max-width: 640px){
940
+
941
+ [class*="rs-middle-hero"] &{
942
+ border-bottom-width:2px
943
+ }
944
+ }
945
+
895
946
  [class*="rs-hero"] &{
896
947
  border-bottom-width:3px;
897
948
  }
@@ -953,6 +1004,15 @@
953
1004
  border-bottom-width:3px
954
1005
  }
955
1006
  }
1007
+ [class*="rs-middle-hero"] &:hover{
1008
+ border-bottom-width:4px;
1009
+ }
1010
+
1011
+ @media screen and (max-width: 640px){
1012
+ [class*="rs-middle-hero"] &:hover{
1013
+ border-bottom-width:3px
1014
+ }
1015
+ }
956
1016
  [class*="rs-hero"] &:hover{
957
1017
  border-bottom-width:4px;
958
1018
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rescui/typography",
3
- "version": "0.13.0",
3
+ "version": "0.15.0",
4
4
  "description": "",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
@@ -19,7 +19,7 @@
19
19
  },
20
20
  "dependencies": {
21
21
  "@babel/runtime-corejs3": "^7.14.0",
22
- "@rescui/colors": "^0.1.10",
22
+ "@rescui/colors": "^0.1.11",
23
23
  "bem-cn-fast": "^1.0.2",
24
24
  "inter-ui": "^3.15.1"
25
25
  },
@@ -29,7 +29,7 @@
29
29
  },
30
30
  "devDependencies": {
31
31
  "@rescui/postcss-preset-library": "^0.1.1",
32
- "@rescui/scripts": "^0.2.2",
32
+ "@rescui/scripts": "^0.2.3",
33
33
  "@rescui/visual-regression": "^0.1.1",
34
34
  "case": "^1.6.3",
35
35
  "fs-extra": "^7.0.1",
@@ -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.p.css --config ./.postcssrc-mixins.js --no-clean-out && shx mv lib/mixins.css lib/mixins.p.css && shx cp lib/mixins.p.css lib/mixins.pcss && shx rm lib/mixins.css.map"
42
42
  },
43
- "gitHead": "498f4f71458e1323b14f9182713a7bf213e4333a"
43
+ "gitHead": "e21b6f80037993b094ceaff022db6d4cd176a88d"
44
44
  }