@jetbrains/kotlin-web-site-ui 4.3.0-next-layout.5 → 4.3.0-next-layout.7

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/out/components/breakpoints/constants.js +1 -1
  2. package/out/components/breakpoints/media.pcss +2 -2
  3. package/out/components/footer/index.css +3 -0
  4. package/out/components/header/index.css +4 -0
  5. package/out/components/layout/index.css +29 -26
  6. package/out/components/top-menu/index.css +2 -0
  7. package/out/components/typography/index.css +1 -0
  8. package/out/components/youtube-player/index.css +1 -0
  9. package/package.json +1 -1
package/out/components/breakpoints/constants.js CHANGED
@@ -1,5 +1,5 @@
1
1
  const POINTS = {
2
- MS: 376,
2
+ MS: 374,
3
3
  MM: 472,
4
4
  TS: 616,
5
5
  TM: 808,
package/out/components/breakpoints/media.pcss CHANGED
@@ -1,11 +1,11 @@
1
- @custom-media --ktl-ms-min (min-width: 377px);
1
+ @custom-media --ktl-ms-min (min-width: 375px);
2
2
  @custom-media --ktl-mm-min (min-width: 473px);
3
3
  @custom-media --ktl-ts-min (min-width: 617px);
4
4
  @custom-media --ktl-tm-min (min-width: 809px);
5
5
  @custom-media --ktl-tl-min (min-width: 1001px);
6
6
  @custom-media --ktl-ds-min (min-width: 1191px);
7
7
  @custom-media --ktl-dm-min (min-width: 1145px);
8
- @custom-media --ktl-ms (max-width: 376px);
8
+ @custom-media --ktl-ms (max-width: 374px);
9
9
  @custom-media --ktl-mm (max-width: 472px);
10
10
  @custom-media --ktl-ts (max-width: 616px);
11
11
  @custom-media --ktl-tm (max-width: 808px);
package/out/components/footer/index.css CHANGED
@@ -26,6 +26,7 @@
26
26
  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
27
27
  --ktl-light-text-hard: rgba(39, 40, 44, 1);
28
28
  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
29
+ --ktl-divider-color: rgba(25, 25, 28, .2);
29
30
  --ktl-overlay-z-index: 900;
30
31
  --ktl-top-menu-z-index: 905;
31
32
  --ktl-header-z-index: 906;
@@ -82,6 +83,7 @@
82
83
  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
83
84
  --ktl-light-text-hard: rgba(39, 40, 44, 1);
84
85
  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
86
+ --ktl-divider-color: rgba(25, 25, 28, .2);
85
87
  --ktl-overlay-z-index: 900;
86
88
  --ktl-top-menu-z-index: 905;
87
89
  --ktl-header-z-index: 906;
@@ -138,6 +140,7 @@
138
140
  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
139
141
  --ktl-light-text-hard: rgba(39, 40, 44, 1);
140
142
  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
143
+ --ktl-divider-color: rgba(25, 25, 28, .2);
141
144
  --ktl-overlay-z-index: 900;
142
145
  --ktl-top-menu-z-index: 905;
143
146
  --ktl-header-z-index: 906;
package/out/components/header/index.css CHANGED
@@ -35,6 +35,7 @@
35
35
  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
36
36
  --ktl-light-text-hard: rgba(39, 40, 44, 1);
37
37
  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
38
+ --ktl-divider-color: rgba(25, 25, 28, .2);
38
39
  --ktl-overlay-z-index: 900;
39
40
  --ktl-top-menu-z-index: 905;
40
41
  --ktl-header-z-index: 906;
@@ -81,6 +82,7 @@
81
82
  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
82
83
  --ktl-light-text-hard: rgba(39, 40, 44, 1);
83
84
  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
85
+ --ktl-divider-color: rgba(25, 25, 28, .2);
84
86
  --ktl-overlay-z-index: 900;
85
87
  --ktl-top-menu-z-index: 905;
86
88
  --ktl-header-z-index: 906;
@@ -223,6 +225,7 @@
223
225
  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
224
226
  --ktl-light-text-hard: rgba(39, 40, 44, 1);
225
227
  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
228
+ --ktl-divider-color: rgba(25, 25, 28, .2);
226
229
  --ktl-overlay-z-index: 900;
227
230
  --ktl-top-menu-z-index: 905;
228
231
  --ktl-header-z-index: 906;
@@ -689,6 +692,7 @@
689
692
  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
690
693
  --ktl-light-text-hard: rgba(39, 40, 44, 1);
691
694
  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
695
+ --ktl-divider-color: rgba(25, 25, 28, .2);
692
696
  --ktl-overlay-z-index: 900;
693
697
  --ktl-top-menu-z-index: 905;
694
698
  --ktl-header-z-index: 906;
package/out/components/layout/index.css CHANGED
@@ -1,49 +1,52 @@
1
- :root {
2
- --ktl-layout-spacing: 72px;
3
- --ktl-layout-width: 1144px;
4
- }
1
+ .ktl-layout {
2
+ --ktl-layout-spacing: 72px;
3
+ --ktl-layout-width: 1144px;
4
+ }
5
5
 
6
- @media (max-width: 1190px) {:root {
7
- --ktl-layout-width: 952px
8
- }
6
+ @media (max-width: 1190px) {.ktl-layout {
7
+ --ktl-layout-width: 952px;
9
8
  }
9
+ }
10
10
 
11
- @media (max-width: 1000px) {:root {
12
- --ktl-layout-width: 760px
13
- }
11
+ @media (max-width: 1000px) {.ktl-layout {
12
+ --ktl-layout-spacing: 48px;
13
+ --ktl-layout-width: 760px;
14
14
  }
15
+ }
15
16
 
16
- @media (max-width: 808px) {:root {
17
- --ktl-layout-width: 568px
18
- }
17
+ @media (max-width: 808px) {.ktl-layout {
18
+ --ktl-layout-width: 568px;
19
19
  }
20
+ }
20
21
 
21
- @media (max-width: 616px) {:root {
22
- --ktl-layout-width: 424px
23
- }
22
+ @media (max-width: 616px) {.ktl-layout {
23
+ --ktl-layout-width: 424px;
24
24
  }
25
+ }
25
26
 
26
- @media (max-width: 472px) {:root {
27
- --ktl-layout-width: 328px
28
- }
27
+ @media (max-width: 472px) {.ktl-layout {
28
+ --ktl-layout-width: 328px;
29
29
  }
30
+ }
30
31
 
31
- @media (max-width: 376px) {:root {
32
- --ktl-layout-width: 272px
33
- }
32
+ @media (max-width: 374px) {.ktl-layout {
33
+ --ktl-layout-width: 272px;
34
34
  }
35
- .ktl-layout {
35
+ }
36
+
37
+ .ktl-layout {
38
+
36
39
  box-sizing: border-box;
37
40
  width: var(--ktl-layout-width);
38
41
 
39
42
  transition: width 200ms;
40
43
  will-change: width;
41
- }
42
- .ktl-layout--center {
44
+ }
45
+ .ktl-layout--center {
43
46
  margin-left: auto;
44
47
  margin-right: auto;
45
48
  }
46
- .ktl-layout--spacing {
49
+ .ktl-layout--spacing {
47
50
  margin-top: var(--ktl-layout-spacing);
48
51
  margin-bottom: var(--ktl-layout-spacing);
49
52
  }
package/out/components/top-menu/index.css CHANGED
@@ -10,6 +10,7 @@
10
10
  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
11
11
  --ktl-light-text-hard: rgba(39, 40, 44, 1);
12
12
  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
13
+ --ktl-divider-color: rgba(25, 25, 28, .2);
13
14
  --ktl-overlay-z-index: 900;
14
15
  --ktl-top-menu-z-index: 905;
15
16
  --ktl-header-z-index: 906;
@@ -93,6 +94,7 @@
93
94
  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
94
95
  --ktl-light-text-hard: rgba(39, 40, 44, 1);
95
96
  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
97
+ --ktl-divider-color: rgba(25, 25, 28, .2);
96
98
  --ktl-overlay-z-index: 900;
97
99
  --ktl-top-menu-z-index: 905;
98
100
  --ktl-header-z-index: 906;
package/out/components/typography/index.css CHANGED
@@ -10,6 +10,7 @@
10
10
  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
11
11
  --ktl-light-text-hard: rgba(39, 40, 44, 1);
12
12
  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
13
+ --ktl-divider-color: rgba(25, 25, 28, .2);
13
14
  --ktl-overlay-z-index: 900;
14
15
  --ktl-top-menu-z-index: 905;
15
16
  --ktl-header-z-index: 906;
package/out/components/youtube-player/index.css CHANGED
@@ -10,6 +10,7 @@
10
10
  --ktl-color-dark-40: rgba(39, 40, 44, 0.4);
11
11
  --ktl-light-text-hard: rgba(39, 40, 44, 1);
12
12
  --ktl-light-dark-20: rgba(39, 40, 44, 0.2);
13
+ --ktl-divider-color: rgba(25, 25, 28, .2);
13
14
  --ktl-overlay-z-index: 900;
14
15
  --ktl-top-menu-z-index: 905;
15
16
  --ktl-header-z-index: 906;
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@jetbrains/kotlin-web-site-ui",
3
3
  "description": "UI components for Kotlin web sites development",
4
- "version": "4.3.0-next-layout.5",
4
+ "version": "4.3.0-next-layout.7",
5
5
  "license": "Apache-2.0",
6
6
  "author": "JetBrains",
7
7
  "files": [