@jetbrains/kotlin-web-site-ui 4.10.1-alpha.1 → 4.10.2
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.
- package/out/components/footer/index.css +0 -24
- package/out/components/footer-compact/index.css +0 -24
- package/out/components/header/index.css +0 -55
- package/out/components/header/index.js +1 -1
- package/out/components/header/nav-scheme.js +3 -11
- package/out/components/top-menu/index.css +0 -16
- package/out/components/typography/index.css +0 -8
- package/out/components/youtube-player/index.css +0 -8
- package/package.json +1 -1
- package/out/components/sub-navigation/horizontal-menu/horizontal-menu.js +0 -42
- package/out/components/sub-navigation/horizontal-menu/horizontal-menu.module.pcss.js +0 -6
- package/out/components/sub-navigation/index.css +0 -147
- package/out/components/sub-navigation/index.js +0 -3
- package/out/components/sub-navigation/sub-navigation.js +0 -34
- package/out/components/sub-navigation/sub-navigation.module.pcss.js +0 -6
|
@@ -41,14 +41,6 @@
|
|
|
41
41
|
--ktl-header-height-mobile: 52px;
|
|
42
42
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
43
43
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
44
|
-
|
|
45
|
-
}
|
|
46
|
-
|
|
47
|
-
:root {
|
|
48
|
-
--website-ui-text-color: #19191c;
|
|
49
|
-
--website-ui-text-color-dark: #fff;
|
|
50
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
51
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
52
44
|
}
|
|
53
45
|
|
|
54
46
|
:root {
|
|
@@ -114,14 +106,6 @@
|
|
|
114
106
|
--ktl-header-height-mobile: 52px;
|
|
115
107
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
116
108
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
117
|
-
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
:root {
|
|
121
|
-
--website-ui-text-color: #19191c;
|
|
122
|
-
--website-ui-text-color-dark: #fff;
|
|
123
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
124
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
125
109
|
}
|
|
126
110
|
|
|
127
111
|
:root {
|
|
@@ -206,14 +190,6 @@
|
|
|
206
190
|
--ktl-header-height-mobile: 52px;
|
|
207
191
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
208
192
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
209
|
-
|
|
210
|
-
}
|
|
211
|
-
|
|
212
|
-
:root {
|
|
213
|
-
--website-ui-text-color: #19191c;
|
|
214
|
-
--website-ui-text-color-dark: #fff;
|
|
215
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
216
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
217
193
|
}
|
|
218
194
|
|
|
219
195
|
:root {
|
|
@@ -34,14 +34,6 @@
|
|
|
34
34
|
--ktl-header-height-mobile: 52px;
|
|
35
35
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
36
36
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
37
|
-
|
|
38
|
-
}
|
|
39
|
-
|
|
40
|
-
:root {
|
|
41
|
-
--website-ui-text-color: #19191c;
|
|
42
|
-
--website-ui-text-color-dark: #fff;
|
|
43
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
44
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
45
37
|
}
|
|
46
38
|
|
|
47
39
|
:root {
|
|
@@ -114,14 +106,6 @@
|
|
|
114
106
|
--ktl-header-height-mobile: 52px;
|
|
115
107
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
116
108
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
117
|
-
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
:root {
|
|
121
|
-
--website-ui-text-color: #19191c;
|
|
122
|
-
--website-ui-text-color-dark: #fff;
|
|
123
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
124
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
125
109
|
}
|
|
126
110
|
|
|
127
111
|
:root {
|
|
@@ -194,14 +178,6 @@
|
|
|
194
178
|
--ktl-header-height-mobile: 52px;
|
|
195
179
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
196
180
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
197
|
-
|
|
198
|
-
}
|
|
199
|
-
|
|
200
|
-
:root {
|
|
201
|
-
--website-ui-text-color: #19191c;
|
|
202
|
-
--website-ui-text-color-dark: #fff;
|
|
203
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
204
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
205
181
|
}
|
|
206
182
|
|
|
207
183
|
:root {
|
|
@@ -42,14 +42,6 @@
|
|
|
42
42
|
--ktl-header-height-mobile: 52px;
|
|
43
43
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
44
44
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
45
|
-
|
|
46
|
-
}
|
|
47
|
-
|
|
48
|
-
:root {
|
|
49
|
-
--website-ui-text-color: #19191c;
|
|
50
|
-
--website-ui-text-color-dark: #fff;
|
|
51
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
52
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
53
45
|
}
|
|
54
46
|
|
|
55
47
|
:root {
|
|
@@ -115,14 +107,6 @@
|
|
|
115
107
|
--ktl-header-height-mobile: 52px;
|
|
116
108
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
117
109
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
118
|
-
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
:root {
|
|
122
|
-
--website-ui-text-color: #19191c;
|
|
123
|
-
--website-ui-text-color-dark: #fff;
|
|
124
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
125
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
126
110
|
}
|
|
127
111
|
|
|
128
112
|
:root {
|
|
@@ -287,14 +271,6 @@
|
|
|
287
271
|
--ktl-header-height-mobile: 52px;
|
|
288
272
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
289
273
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
290
|
-
|
|
291
|
-
}
|
|
292
|
-
|
|
293
|
-
:root {
|
|
294
|
-
--website-ui-text-color: #19191c;
|
|
295
|
-
--website-ui-text-color-dark: #fff;
|
|
296
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
297
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
298
274
|
}
|
|
299
275
|
|
|
300
276
|
:root {
|
|
@@ -773,14 +749,6 @@
|
|
|
773
749
|
--ktl-header-height-mobile: 52px;
|
|
774
750
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
775
751
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
776
|
-
|
|
777
|
-
}
|
|
778
|
-
|
|
779
|
-
:root {
|
|
780
|
-
--website-ui-text-color: #19191c;
|
|
781
|
-
--website-ui-text-color-dark: #fff;
|
|
782
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
783
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
784
752
|
}
|
|
785
753
|
|
|
786
754
|
:root {
|
|
@@ -859,14 +827,6 @@
|
|
|
859
827
|
--ktl-header-height-mobile: 52px;
|
|
860
828
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
861
829
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
862
|
-
|
|
863
|
-
}
|
|
864
|
-
|
|
865
|
-
:root {
|
|
866
|
-
--website-ui-text-color: #19191c;
|
|
867
|
-
--website-ui-text-color-dark: #fff;
|
|
868
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
869
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
870
830
|
}
|
|
871
831
|
|
|
872
832
|
:root {
|
|
@@ -940,14 +900,6 @@
|
|
|
940
900
|
--ktl-header-height-mobile: 52px;
|
|
941
901
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
942
902
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
943
|
-
|
|
944
|
-
}
|
|
945
|
-
|
|
946
|
-
:root {
|
|
947
|
-
--website-ui-text-color: #19191c;
|
|
948
|
-
--website-ui-text-color-dark: #fff;
|
|
949
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
950
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
951
903
|
}
|
|
952
904
|
|
|
953
905
|
:root {
|
|
@@ -974,13 +926,6 @@
|
|
|
974
926
|
border-bottom: 1px solid rgba(255, 255, 255, 0.3);
|
|
975
927
|
}
|
|
976
928
|
|
|
977
|
-
.ktl-menu-list-module_menu-item-group_mFvUE + .ktl-menu-list-module_menu-item-group_mFvUE {
|
|
978
|
-
margin-top: 0;
|
|
979
|
-
padding-top: 0;
|
|
980
|
-
|
|
981
|
-
border-top: none;
|
|
982
|
-
}
|
|
983
|
-
|
|
984
929
|
.ktl-logo-small-module_logo-small_iGY12 {
|
|
985
930
|
flex-grow: 1;
|
|
986
931
|
display: flex;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import './index.css';
|
|
2
2
|
import { Header } from './header.js';
|
|
3
3
|
export { Header as default } from './header.js';
|
|
4
|
-
export { ANDROID_TITLE, ANDROID_URL, API_OVERVIEW_TITLE, API_OVERVIEW_URL, API_TITLE, COMMUNITY_TITLE, COMMUNITY_URL, CORE_API_TITLE, CORE_API_URL, COROUTINES_API_TITLE, COROUTINES_API_URL, DATA_SCIENCE_TITLE, DATA_SCIENCE_URL, DATETIME_API_TITLE, DATETIME_API_URL,
|
|
4
|
+
export { ANDROID_TITLE, ANDROID_URL, API_OVERVIEW_TITLE, API_OVERVIEW_URL, API_TITLE, COMMUNITY_TITLE, COMMUNITY_URL, CORE_API_TITLE, CORE_API_URL, COROUTINES_API_TITLE, COROUTINES_API_URL, DATA_SCIENCE_TITLE, DATA_SCIENCE_URL, DATETIME_API_TITLE, DATETIME_API_URL, DOCS_TITLE, DOCS_URL, HOME_TITLE, HOME_URL, IO_API_TITLE, IO_API_URL, KGP_TITLE, KGP_URL, KMM_DOCS_TITLE, KMM_DOCS_URL, KOTLIN_DOCS_TITLE, KOTLIN_DOCS_URL, KTOR_TITLE, KTOR_URL, METADATA_JVM_TITLE, METADATA_JVM_URL, MULTIPLATFORM_LIBRARIES_TITLE, MULTIPLATFORM_LIBRARIES_URL, MULTIPLATFORM_MOBILE_TITLE, MULTIPLATFORM_MOBILE_URL, PLAY_EXAMPLES_TITLE, PLAY_EXAMPLES_URL, PLAY_KOANS_TITLE, PLAY_KOANS_URL, PLAY_TITLE, PLAY_TITLE_FULL, PLAY_URL, SERIALIZATION_API_TITLE, SERIALIZATION_API_URL, SERVER_SIDE_TITLE, SERVER_SIDE_URL, SOLUTIONS_TITLE, TEACH_TITLE, TEACH_URL, TEST_API_TITLE, TEST_API_URL, getNavScheme } from './nav-scheme.js';
|
|
@@ -5,7 +5,7 @@ const SOLUTIONS_TITLE = 'Solutions';
|
|
|
5
5
|
const MULTIPLATFORM_MOBILE_TITLE = 'Multiplatform';
|
|
6
6
|
const MULTIPLATFORM_MOBILE_URL = `/lp/mobile/`;
|
|
7
7
|
const SERVER_SIDE_TITLE = 'Server-side';
|
|
8
|
-
const SERVER_SIDE_URL = `/
|
|
8
|
+
const SERVER_SIDE_URL = `/server-side/`;
|
|
9
9
|
const MULTIPLATFORM_LIBRARIES_TITLE = 'Multiplatform libraries';
|
|
10
10
|
const MULTIPLATFORM_LIBRARIES_URL = '/docs/multiplatform-library.html';
|
|
11
11
|
const DATA_SCIENCE_TITLE = 'Data science';
|
|
@@ -50,13 +50,6 @@ const KGP_TITLE = 'Kotlin Gradle plugins';
|
|
|
50
50
|
const KGP_URL = '/api/kotlin-gradle-plugin/';
|
|
51
51
|
const KTOR_TITLE = 'Ktor';
|
|
52
52
|
const KTOR_URL = 'https://api.ktor.io/';
|
|
53
|
-
const DOCS_NAVIGATION_ITEMS = [{
|
|
54
|
-
url: '/docs/home.html',
|
|
55
|
-
title: 'Language guide'
|
|
56
|
-
}, {
|
|
57
|
-
url: '/docs/multiplatform/get-started.html',
|
|
58
|
-
title: 'Multiplatform development'
|
|
59
|
-
}];
|
|
60
53
|
const navScheme = [{
|
|
61
54
|
title: HOME_TITLE,
|
|
62
55
|
url: HOME_URL
|
|
@@ -78,8 +71,7 @@ const navScheme = [{
|
|
|
78
71
|
}]
|
|
79
72
|
}, {
|
|
80
73
|
title: DOCS_TITLE,
|
|
81
|
-
url: KOTLIN_DOCS_URL
|
|
82
|
-
items: DOCS_NAVIGATION_ITEMS
|
|
74
|
+
url: KOTLIN_DOCS_URL
|
|
83
75
|
}, {
|
|
84
76
|
title: API_TITLE,
|
|
85
77
|
url: null,
|
|
@@ -189,4 +181,4 @@ function makeExternalUrl(url, currentUrl, isPlayground) {
|
|
|
189
181
|
return url;
|
|
190
182
|
}
|
|
191
183
|
|
|
192
|
-
export { ANDROID_TITLE, ANDROID_URL, API_OVERVIEW_TITLE, API_OVERVIEW_URL, API_TITLE, COMMUNITY_TITLE, COMMUNITY_URL, CORE_API_TITLE, CORE_API_URL, COROUTINES_API_TITLE, COROUTINES_API_URL, DATA_SCIENCE_TITLE, DATA_SCIENCE_URL, DATETIME_API_TITLE, DATETIME_API_URL,
|
|
184
|
+
export { ANDROID_TITLE, ANDROID_URL, API_OVERVIEW_TITLE, API_OVERVIEW_URL, API_TITLE, COMMUNITY_TITLE, COMMUNITY_URL, CORE_API_TITLE, CORE_API_URL, COROUTINES_API_TITLE, COROUTINES_API_URL, DATA_SCIENCE_TITLE, DATA_SCIENCE_URL, DATETIME_API_TITLE, DATETIME_API_URL, DOCS_TITLE, DOCS_URL, HOME_TITLE, HOME_URL, IO_API_TITLE, IO_API_URL, KGP_TITLE, KGP_URL, KMM_DOCS_TITLE, KMM_DOCS_URL, KOTLIN_DOCS_TITLE, KOTLIN_DOCS_URL, KTOR_TITLE, KTOR_URL, METADATA_JVM_TITLE, METADATA_JVM_URL, MULTIPLATFORM_LIBRARIES_TITLE, MULTIPLATFORM_LIBRARIES_URL, MULTIPLATFORM_MOBILE_TITLE, MULTIPLATFORM_MOBILE_URL, PLAY_EXAMPLES_TITLE, PLAY_EXAMPLES_URL, PLAY_KOANS_TITLE, PLAY_KOANS_URL, PLAY_TITLE, PLAY_TITLE_FULL, PLAY_URL, SERIALIZATION_API_TITLE, SERIALIZATION_API_URL, SERVER_SIDE_TITLE, SERVER_SIDE_URL, SOLUTIONS_TITLE, TEACH_TITLE, TEACH_URL, TEST_API_TITLE, TEST_API_URL, getNavScheme };
|
|
@@ -18,14 +18,6 @@
|
|
|
18
18
|
--ktl-header-height-mobile: 52px;
|
|
19
19
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
20
20
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
21
|
-
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
:root {
|
|
25
|
-
--website-ui-text-color: #19191c;
|
|
26
|
-
--website-ui-text-color-dark: #fff;
|
|
27
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
28
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
29
21
|
}
|
|
30
22
|
|
|
31
23
|
:root {
|
|
@@ -118,14 +110,6 @@
|
|
|
118
110
|
--ktl-header-height-mobile: 52px;
|
|
119
111
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
120
112
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
121
|
-
|
|
122
|
-
}
|
|
123
|
-
|
|
124
|
-
:root {
|
|
125
|
-
--website-ui-text-color: #19191c;
|
|
126
|
-
--website-ui-text-color-dark: #fff;
|
|
127
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
128
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
129
113
|
}
|
|
130
114
|
|
|
131
115
|
:root {
|
|
@@ -18,14 +18,6 @@
|
|
|
18
18
|
--ktl-header-height-mobile: 52px;
|
|
19
19
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
20
20
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
21
|
-
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
:root {
|
|
25
|
-
--website-ui-text-color: #19191c;
|
|
26
|
-
--website-ui-text-color-dark: #fff;
|
|
27
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
28
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
29
21
|
}
|
|
30
22
|
|
|
31
23
|
:root {
|
|
@@ -18,14 +18,6 @@
|
|
|
18
18
|
--ktl-header-height-mobile: 52px;
|
|
19
19
|
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
20
20
|
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
21
|
-
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
:root {
|
|
25
|
-
--website-ui-text-color: #19191c;
|
|
26
|
-
--website-ui-text-color-dark: #fff;
|
|
27
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
28
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
29
21
|
}
|
|
30
22
|
|
|
31
23
|
:root {
|
package/package.json
CHANGED
|
@@ -1,42 +0,0 @@
|
|
|
1
|
-
import React, { useCallback } from 'react';
|
|
2
|
-
import classNames from 'classnames';
|
|
3
|
-
import styles from './horizontal-menu.module.pcss.js';
|
|
4
|
-
import { useTextStyles } from '@rescui/typography';
|
|
5
|
-
|
|
6
|
-
const HorizontalMenuItem = ({
|
|
7
|
-
item,
|
|
8
|
-
isActive,
|
|
9
|
-
linkHandler
|
|
10
|
-
}) => {
|
|
11
|
-
useTextStyles();
|
|
12
|
-
const handleLink = useCallback(event => linkHandler(event, item.url), [item]);
|
|
13
|
-
return isActive ? React.createElement("span", {
|
|
14
|
-
key: item.url,
|
|
15
|
-
className: styles.itemActive
|
|
16
|
-
}, item.title) : React.createElement("a", {
|
|
17
|
-
href: item.url,
|
|
18
|
-
key: item.url,
|
|
19
|
-
className: styles.item,
|
|
20
|
-
onClick: handleLink,
|
|
21
|
-
target: item.isExternal ? '_blank' : undefined,
|
|
22
|
-
rel: "noreferrer"
|
|
23
|
-
}, item.title);
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
const HorizontalMenu = ({
|
|
27
|
-
items,
|
|
28
|
-
activeIndex,
|
|
29
|
-
linkHandler
|
|
30
|
-
}) => {
|
|
31
|
-
const textCn = useTextStyles();
|
|
32
|
-
return React.createElement("nav", {
|
|
33
|
-
className: classNames(styles.horizontalMenu, textCn('rs-text-2'))
|
|
34
|
-
}, items.map((item, index) => React.createElement(HorizontalMenuItem, {
|
|
35
|
-
key: item.url,
|
|
36
|
-
isActive: index === activeIndex,
|
|
37
|
-
item: item,
|
|
38
|
-
linkHandler: linkHandler
|
|
39
|
-
})));
|
|
40
|
-
};
|
|
41
|
-
|
|
42
|
-
export { HorizontalMenu };
|
|
@@ -1,147 +0,0 @@
|
|
|
1
|
-
:root {
|
|
2
|
-
--ktl-light-grey: #f4f4f4;
|
|
3
|
-
--ktl-dark-100: rgba(39, 40, 44, 1);
|
|
4
|
-
--ktl-dark-bg-hard: rgba(27, 27, 27, 1);
|
|
5
|
-
--ktl-icon-color-dark: rgba(39, 40, 44, 0.75);
|
|
6
|
-
--ktl-color-white-light: rgba(255, 255, 255, 0.75);
|
|
7
|
-
--ktl-transition-xfast: 100ms;
|
|
8
|
-
--ktl-transition-fast: 300ms;
|
|
9
|
-
--ktl-color-primary-light-theme: #7f52ff;
|
|
10
|
-
--ktl-color-dark-40: rgba(39, 40, 44, 0.4);
|
|
11
|
-
--ktl-light-text-hard: rgba(39, 40, 44, 1);
|
|
12
|
-
--ktl-light-dark-20: rgba(39, 40, 44, 0.2);
|
|
13
|
-
--ktl-divider-color: rgba(25, 25, 28, .2);
|
|
14
|
-
--ktl-overlay-z-index: 900;
|
|
15
|
-
--ktl-top-menu-z-index: 905;
|
|
16
|
-
--ktl-header-z-index: 906;
|
|
17
|
-
--ktl-mobile-dropdown-list-z-index: 907;
|
|
18
|
-
--ktl-header-height-mobile: 52px;
|
|
19
|
-
--ktl-font-family-inter: Inter, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Droid Sans', 'Helvetica Neue', Arial, sans-serif;
|
|
20
|
-
--ktl-focus-outline: rgba(107,87,255,.8) 0 0 0 4px;
|
|
21
|
-
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
:root {
|
|
25
|
-
--website-ui-text-color: #19191c;
|
|
26
|
-
--website-ui-text-color-dark: #fff;
|
|
27
|
-
--website-ui-focus-outline-color: rgba(48, 127, 255, 0.5);
|
|
28
|
-
--website-ui-focus-outline: 4px solid var(--website-ui-focus-outline-color);
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
:root {
|
|
32
|
-
--ktl-box-block-s: 4px;
|
|
33
|
-
--ktl-box-block-m: 8px;
|
|
34
|
-
--ktl-box-block-l: 16px;
|
|
35
|
-
|
|
36
|
-
--ktl-box-section-s: 24px;
|
|
37
|
-
--ktl-box-section-m: 32px;
|
|
38
|
-
--ktl-box-section-l: 48px;
|
|
39
|
-
|
|
40
|
-
--ktl-box-page-s: 64px;
|
|
41
|
-
--ktl-box-page-m: 72px;
|
|
42
|
-
--ktl-box-page-l: 96px;
|
|
43
|
-
}
|
|
44
|
-
|
|
45
|
-
:root {
|
|
46
|
-
--sub-navigation-text-color: var(--website-ui-text-color);
|
|
47
|
-
--sub-navigation-background-color: #fff;
|
|
48
|
-
}
|
|
49
|
-
|
|
50
|
-
.ktl-sub-navigation-module_sub-navigation_dGfIT {
|
|
51
|
-
position: relative;
|
|
52
|
-
display: flex;
|
|
53
|
-
align-items: center;
|
|
54
|
-
gap: 32px;
|
|
55
|
-
height: 64px;
|
|
56
|
-
background-color: var(--sub-navigation-background-color);
|
|
57
|
-
padding: 0 32px;
|
|
58
|
-
overflow: auto;
|
|
59
|
-
}
|
|
60
|
-
|
|
61
|
-
@media (max-width: 640px) {
|
|
62
|
-
|
|
63
|
-
.ktl-sub-navigation-module_sub-navigation_dGfIT {
|
|
64
|
-
height: var(--ktl-header-height-mobile);
|
|
65
|
-
padding: 0 6px 0 4px;
|
|
66
|
-
gap: 16px
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
.ktl-sub-navigation-module_sub-navigation-dark-theme_s4fQ7 {
|
|
71
|
-
--sub-navigation-background-color: rgba(16, 16, 16, 1);
|
|
72
|
-
--sub-navigation-text-color: var(--website-ui-text-color-dark);
|
|
73
|
-
color: var(--sub-navigation-text-color);
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
.ktl-sub-navigation-module_logo_Jm6Jd {
|
|
77
|
-
flex-shrink: 1;
|
|
78
|
-
overflow: hidden;
|
|
79
|
-
text-overflow: ellipsis;
|
|
80
|
-
white-space: nowrap;
|
|
81
|
-
color: var(--sub-navigation-text-color) !important;
|
|
82
|
-
text-decoration: none;
|
|
83
|
-
}
|
|
84
|
-
|
|
85
|
-
.ktl-sub-navigation-module_logo_Jm6Jd:focus-visible {
|
|
86
|
-
outline: var(--website-ui-focus-outline);
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
@media (max-width: 640px) {
|
|
90
|
-
|
|
91
|
-
.ktl-sub-navigation-module_logo_Jm6Jd {
|
|
92
|
-
display: none
|
|
93
|
-
}
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
:root {
|
|
97
|
-
--horizontal-menu-item-padding: 12px;
|
|
98
|
-
}
|
|
99
|
-
|
|
100
|
-
.ktl-horizontal-menu-module_horizontal-menu_bRQN9 {
|
|
101
|
-
display: flex;
|
|
102
|
-
flex-grow: 1;
|
|
103
|
-
justify-content: flex-end;
|
|
104
|
-
align-items: center;
|
|
105
|
-
height: 100%;
|
|
106
|
-
}
|
|
107
|
-
|
|
108
|
-
.ktl-horizontal-menu-module_item_vmotC, .ktl-horizontal-menu-module_item-active_gSpD6 {
|
|
109
|
-
position: relative;
|
|
110
|
-
display: flex;
|
|
111
|
-
align-items: center;
|
|
112
|
-
height: 100%;
|
|
113
|
-
box-sizing: border-box;
|
|
114
|
-
text-align: center;
|
|
115
|
-
white-space: nowrap;
|
|
116
|
-
padding: var(--horizontal-menu-item-padding);
|
|
117
|
-
text-decoration: none;
|
|
118
|
-
color: var(--sub-navigation-text-color) !important;
|
|
119
|
-
}
|
|
120
|
-
|
|
121
|
-
.ktl-horizontal-menu-module_item_vmotC:focus-visible, .ktl-horizontal-menu-module_item-active_gSpD6:focus-visible {
|
|
122
|
-
outline: var(--website-ui-focus-outline);
|
|
123
|
-
outline-offset: -4px;
|
|
124
|
-
}
|
|
125
|
-
|
|
126
|
-
.ktl-horizontal-menu-module_item_vmotC:after, .ktl-horizontal-menu-module_item-active_gSpD6:after {
|
|
127
|
-
content: '';
|
|
128
|
-
display: none;
|
|
129
|
-
height: 2px;
|
|
130
|
-
position: absolute;
|
|
131
|
-
bottom: 4px;
|
|
132
|
-
left: var(--horizontal-menu-item-padding);
|
|
133
|
-
right: var(--horizontal-menu-item-padding);
|
|
134
|
-
background-color: var(--sub-navigation-text-color);
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
.ktl-horizontal-menu-module_item_vmotC:hover {
|
|
138
|
-
background-color: rgba(255, 255, 255, 0.10);
|
|
139
|
-
}
|
|
140
|
-
|
|
141
|
-
.ktl-horizontal-menu-module_item-active_gSpD6 {
|
|
142
|
-
cursor: default;
|
|
143
|
-
}
|
|
144
|
-
|
|
145
|
-
.ktl-horizontal-menu-module_item-active_gSpD6:after {
|
|
146
|
-
display: block;
|
|
147
|
-
}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { useTheme } from '@rescui/ui-contexts';
|
|
3
|
-
import classNames from 'classnames';
|
|
4
|
-
import styles from './sub-navigation.module.pcss.js';
|
|
5
|
-
import { useTextStyles } from '@rescui/typography';
|
|
6
|
-
import { HorizontalMenu } from './horizontal-menu/horizontal-menu.js';
|
|
7
|
-
|
|
8
|
-
const SubNavigation = ({
|
|
9
|
-
homeUrl,
|
|
10
|
-
title,
|
|
11
|
-
activeIndex,
|
|
12
|
-
items,
|
|
13
|
-
linkHandler = () => null,
|
|
14
|
-
className,
|
|
15
|
-
children
|
|
16
|
-
}) => {
|
|
17
|
-
const theme = useTheme();
|
|
18
|
-
const textCn = useTextStyles();
|
|
19
|
-
return React.createElement("div", {
|
|
20
|
-
className: classNames(styles.subNavigation, className, {
|
|
21
|
-
[styles.subNavigationDarkTheme]: theme === 'dark'
|
|
22
|
-
})
|
|
23
|
-
}, title && React.createElement("a", {
|
|
24
|
-
href: homeUrl,
|
|
25
|
-
className: classNames(styles.logo, textCn('rs-text-2')),
|
|
26
|
-
onClick: event => linkHandler(event, homeUrl)
|
|
27
|
-
}, title), React.createElement(HorizontalMenu, {
|
|
28
|
-
items: items,
|
|
29
|
-
activeIndex: activeIndex,
|
|
30
|
-
linkHandler: linkHandler
|
|
31
|
-
}), children);
|
|
32
|
-
};
|
|
33
|
-
|
|
34
|
-
export { SubNavigation };
|