Skip to content

Commit ece3e96

Browse files
authored
Merge pull request #4862 from JetBrains/main-extra-block
Add extra block to the main page
2 parents 624a6f4 + 6c6a188 commit ece3e96

File tree

8 files changed

+343
-17
lines changed

8 files changed

+343
-17
lines changed

blocks/main/kotlin-plus-ai/block-scheme.tsx

Lines changed: 85 additions & 0 deletions
Large diffs are not rendered by default.

blocks/main/kotlin-plus-ai/index.tsx

Lines changed: 78 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,78 @@
1+
import React from 'react';
2+
3+
import cn from 'classnames';
4+
5+
import { Button } from '@rescui/button';
6+
import { ThemeProvider } from '@rescui/ui-contexts';
7+
import { useTextStyles } from '@rescui/typography';
8+
import { useMS } from '@jetbrains/kotlin-web-site-ui/out/components/breakpoints';
9+
import { BlockScheme } from './block-scheme';
10+
11+
import styles from './kotlin-plus-ai.module.css';
12+
13+
function HighlightedList() {
14+
const textCn = useTextStyles();
15+
const textClass = cn(textCn('rs-text-2', { hardness: 'hard' }), styles.highlightItem);
16+
17+
return (
18+
<ul className={styles.highlight}>
19+
<li className={textClass}>Strong support across JetBrains AI tools like AI Assistant and Junie</li>
20+
<li className={textClass}>Robust functionality for building AI-powered apps on the JVM</li>
21+
<li className={textClass}>Native integration with tools like Spring AI and LangChain4j</li>
22+
<li className={textClass}>Open data and benchmarks for better code generation</li>
23+
</ul>
24+
);
25+
}
26+
27+
function KotlinPlusAI() {
28+
const textCn = useTextStyles();
29+
const textClass = cn(textCn('rs-text-2', { hardness: 'hard' }), styles.para);
30+
const introClass = cn(textClass, styles.intro);
31+
const classTitle = cn(textCn('rs-h2'), styles.title, styles.titleWide);
32+
const size = useMS() ? 'm' : 'l';
33+
34+
return (
35+
<ThemeProvider theme="dark">
36+
<div className={styles.wrapper} id="kotlin-plus-ai">
37+
<h2 className={cn(classTitle, styles.introTitle)}>Kotlin + AI</h2>
38+
<p className={introClass}>JetBrains is investing in AI models tailored for Kotlin, providing open data,
39+
benchmarks, and AI-native tooling integrated into your workflow.</p>
40+
<p className={introClass}>At the same time, Kotlin makes it easy to build your own AI-powered features
41+
with seamless backend integrations and a growing ecosystem.</p>
42+
43+
<div className={styles.getAI}>
44+
<h3 className={cn(textCn('rs-h3'), styles.title)}>What you get with Kotlin + AI</h3>
45+
<HighlightedList />
46+
</div>
47+
48+
<div className={styles.buttons}>
49+
<Button mode="rock" size={size} href="https://www.jetbrains.com/ai/">Learn about JetBrainsAI</Button>
50+
<Button mode="outline" size={size}
51+
href="/docs/kotlin-ai-apps-development-overview.html">Build AI apps with Kotlin</Button>
52+
</div>
53+
54+
<div className={styles.buildAgents}>
55+
<div className={styles.buildAgentsContent}>
56+
<h3 className={classTitle}>Build your own AI agents with&nbsp;Koog</h3>
57+
<p className={textClass}>Koog is JetBrains’ new Kotlin-native framework for creating powerful AI
58+
agents that run locally, interact with tools, and automate complex tasks. Whether you’re
59+
developing a simple chat assistant or an advanced multi-step workflow, Koog gives you full
60+
control with clean Kotlin code – no external services are required. Build, extend, and
61+
experiment with AI agents entirely in Kotlin.</p>
62+
<Button mode="rock" size={size} className={styles.getStarted} href="https://docs.koog.ai/">Get
63+
started</Button>
64+
</div>
65+
<BlockScheme className={styles.buildAgentsScheme} />
66+
</div>
67+
</div>
68+
</ThemeProvider>
69+
);
70+
}
71+
72+
export function KotlinPlusAiInfo() {
73+
return (
74+
<ThemeProvider theme="dark">
75+
<KotlinPlusAI />
76+
</ThemeProvider>
77+
);
78+
}
Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
@import "@jetbrains/kotlin-web-site-ui/out/components/breakpoints/media.pcss";
2+
3+
.wrapper {
4+
background: #19191C;
5+
border-radius: 8px;
6+
padding: 40px 32px;
7+
margin: 96px 0;
8+
9+
@media (--ktl-tm) {
10+
padding: 32px 24px;
11+
margin: 72px 0;
12+
}
13+
}
14+
15+
.title, .para {
16+
padding: 0;
17+
margin: 0;
18+
}
19+
20+
.title {
21+
margin-bottom: 16px;
22+
}
23+
24+
.intro {
25+
max-width: 757px;
26+
margin-bottom: 2ex;
27+
}
28+
29+
.introTitle {
30+
margin-bottom: 24px;
31+
}
32+
33+
.getAI {
34+
margin: 40px 0;
35+
}
36+
37+
.highlight {
38+
padding: 0;
39+
margin: 0;
40+
list-style: none;
41+
42+
display: grid;
43+
grid-gap: 9px;
44+
grid-template-columns: repeat(4, 1fr);
45+
46+
@media (--ktl-tm) {
47+
grid-template-columns: 1fr 1fr;
48+
}
49+
50+
@media (--ktl-ts) {
51+
grid-template-columns: 1fr;
52+
}
53+
}
54+
55+
.highlightItem {
56+
background: #7F52FF !important;
57+
border-radius: 8px;
58+
padding: 16px;
59+
}
60+
61+
.getStarted {
62+
margin-top: 32px;
63+
}
64+
65+
.buttons {
66+
display: flex;
67+
flex-wrap: wrap;
68+
margin-bottom: -16px;
69+
70+
> [type="button"] {
71+
margin-bottom: 16px;
72+
}
73+
74+
> [type="button"]:first-of-type {
75+
margin-right: 16px;
76+
}
77+
78+
@media (--ktl-ts) {
79+
> [type="button"]:first-of-type {
80+
margin-right: 0;
81+
}
82+
}
83+
}
84+
85+
.buildAgents {
86+
margin-top: 96px;
87+
display: grid;
88+
grid-template-columns: 1fr 1fr;
89+
gap: 27px;
90+
91+
@media (--ktl-ds) {
92+
grid-template-columns: 1fr;
93+
gap: 48px;
94+
95+
.buildAgentsScheme {
96+
grid-row: 1;
97+
margin: 0;
98+
}
99+
}
100+
101+
@media (--ktl-tm) {
102+
margin-top: 64px;
103+
}
104+
}
105+
106+
.buildAgentsScheme {
107+
margin: 16px;
108+
max-width: 100%;
109+
height: auto;
110+
}
111+
112+
.buildAgentsContent {
113+
max-width: 790px;
114+
}
115+
116+
@media (--ktl-tm) {
117+
.titleWide {
118+
font-size: 25px;
119+
}
120+
}

package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@
1212
"@jetbrains/babel-preset-jetbrains": "^2.3.1",
1313
"@jetbrains/kotlin-web-site-ui": "^4.9.0",
1414
"@react-hook/resize-observer": "1.2.5",
15-
"@rescui/button": "^0.10.0",
15+
"@rescui/button": "0.18.0",
1616
"@rescui/card": "^0.8.1",
1717
"@rescui/checkbox": "^0.4.13",
1818
"@rescui/colors": "^0.1.6",
@@ -26,7 +26,7 @@
2626
"@rescui/tag": "^0.6.2",
2727
"@rescui/tooltip": "^0.5.1",
2828
"@rescui/typography": "^0.11.0",
29-
"@rescui/ui-contexts": "^0.4.3",
29+
"@rescui/ui-contexts": "^0.5.0",
3030
"@rescui/use-resize-observer": "0.1.4",
3131
"@rollup/plugin-buble": "0.21.3",
3232
"algoliasearch": "4.10.2",

pages/index.tsx

Lines changed: 15 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,13 +33,15 @@ import AtlassianLogo from '../public/images/companies/atlassian.svg';
3333
import GoogleLogo from '../public/images/companies/google.svg';
3434
import JetbrainsLogo from '../assets/jetbrains-logo-dark.svg';
3535
import TouchlabLogo from '../public/images/companies/touchlab.svg';
36-
import KotzillaLogo from '../public/images/companies/kotzilla-logo.svg'
36+
import KotzillaLogo from '../public/images/companies/kotzilla-logo.svg';
3737

3838
import McDonaldsLogo from '../public/images/companies/mcdonalds.svg';
3939
import AWSLogo from '../public/images/companies/aws.svg';
4040
import PhilipsLogo from '../public/images/companies/philips.svg';
4141
import AdobeLogo from '../public/images/companies/adobe.svg';
4242
import ForbesLogo from '../public/images/companies/forbes.svg';
43+
import MetaLogo from '../public/images/companies/meta.svg';
44+
import BlockLogo from '../public/images/companies/block.svg';
4345

4446
import styles from './index.module.css';
4547

@@ -48,6 +50,7 @@ import searchConfig from '../search-config.json';
4850

4951
import releasesDataRaw from '../data/releases.yml';
5052
import Script from 'next/script';
53+
import { KotlinPlusAiInfo } from '../blocks/main/kotlin-plus-ai';
5154

5255
const releasesData: ReleasesData = releasesDataRaw as ReleasesData;
5356

@@ -107,6 +110,11 @@ const kotlinFoundationCompanies = [
107110
logo: GoogleLogo,
108111
link: 'https://about.google/'
109112
},
113+
{
114+
name: 'Meta',
115+
logo: MetaLogo,
116+
link: 'https://www.meta.com/'
117+
},
110118
{
111119
name: 'Gradle',
112120
logo: GradleLogo,
@@ -127,7 +135,11 @@ const kotlinFoundationCompanies = [
127135
logo: KotzillaLogo,
128136
link: 'https://kotzilla.io/'
129137
},
130-
138+
{
139+
name: 'Block',
140+
logo: BlockLogo,
141+
link: 'https://block.xyz/'
142+
},
131143
];
132144

133145
export async function getStaticProps() {
@@ -191,7 +203,7 @@ function Index() {
191203
media={<img src={MultiplatformPreviewImage.src} alt="" />}
192204
/>
193205

194-
<DividerLine />
206+
<KotlinPlusAiInfo/>
195207

196208
<InfoBlock
197209
title={'Big, friendly and helpful community'}

public/images/companies/block.svg

Lines changed: 3 additions & 0 deletions
Loading

public/images/companies/meta.svg

Lines changed: 23 additions & 0 deletions
Loading

yarn.lock

Lines changed: 17 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1668,14 +1668,13 @@
16681668
"@types/raf-schd" "^4.0.0"
16691669
raf-schd "^4.0.2"
16701670

1671-
"@rescui/button@^0.10.0":
1672-
version "0.10.0"
1673-
resolved "https://registry.yarnpkg.com/@rescui/button/-/button-0.10.0.tgz#1ac1b4b3f787bbb1bb3d8ce3e211b54cd19a2b7f"
1674-
integrity sha512-9HGXV2SGJT2EGCCXh4Bl3dDy8n9PurzlZ4XrW5O18QMLknA5KH2BP5mnZdd8tS4aqP1F8IJb9TmsBZFT+Klm2Q==
1671+
"@rescui/button@0.18.0":
1672+
version "0.18.0"
1673+
resolved "https://registry.yarnpkg.com/@rescui/button/-/button-0.18.0.tgz#c7693562a5bad9738862dbe5659a7e4bcee0371c"
1674+
integrity sha512-5B+aVvL4/9KVWWatGyYcpn191ELgPNn3NSQwFnLTVsrhKjhJt6XxFRdl8jtMKzCsBT8BFGEdRsd79asAoVvDug==
16751675
dependencies:
16761676
"@babel/runtime-corejs3" "^7.14.0"
1677-
"@rescui/icons" "^0.13.0"
1678-
"@rescui/use-resize-observer" "^0.1.6"
1677+
"@rescui/use-resize-observer" "^0.2.4"
16791678
classnames "^2.2.6"
16801679
core-js "^3.9.1"
16811680

@@ -1872,13 +1871,12 @@
18721871
bem-cn-fast "^1.0.2"
18731872
inter-ui "^3.15.1"
18741873

1875-
"@rescui/ui-contexts@^0.4.3":
1876-
version "0.4.3"
1877-
resolved "https://registry.yarnpkg.com/@rescui/ui-contexts/-/ui-contexts-0.4.3.tgz#eef6d7f730f0c163a8190b7b6e59c831d86b1495"
1878-
integrity sha512-/rEYPlzCGYAvvJViCr/PX/LWHi9V5Jgk9KfZxX+JXp0WuxujI/jQ9hHDw1YFQQnh/tcaGi+ymxjccraFcqaK5Q==
1874+
"@rescui/ui-contexts@^0.5.0":
1875+
version "0.5.7"
1876+
resolved "https://registry.yarnpkg.com/@rescui/ui-contexts/-/ui-contexts-0.5.7.tgz#3a4b45cfc0bf56f311307303c534bb509a033cfa"
1877+
integrity sha512-3pknPFCz3Jdjk5+buZJLfe9Iyjeapo7ASeNjvQFDe8Wx6i6tjQOFHdahvdYhEZcKCUqKCkfqAGRcGTK9ccFBAw==
18791878
dependencies:
1880-
"@babel/runtime-corejs3" "^7.14.0"
1881-
core-js "^3.9.1"
1879+
"@babel/runtime-corejs3" "^7.26.0"
18821880

18831881
"@rescui/[email protected]", "@rescui/use-resize-observer@^0.1.4":
18841882
version "0.1.4"
@@ -1896,6 +1894,13 @@
18961894
"@babel/runtime-corejs3" "^7.14.0"
18971895
core-js "^3.9.1"
18981896

1897+
"@rescui/use-resize-observer@^0.2.4":
1898+
version "0.2.7"
1899+
resolved "https://registry.yarnpkg.com/@rescui/use-resize-observer/-/use-resize-observer-0.2.7.tgz#a9e3637b23218c1412f848d09aa1f04b314917f1"
1900+
integrity sha512-//li3RTpX+i+Ke2qwBEcAt5oWhib3O/STPSYsGkA3LVw9rHrXLz34fEq3GcjpmSCEIl0vLtvJnV6LEFm4zmWSg==
1901+
dependencies:
1902+
"@babel/runtime-corejs3" "^7.26.0"
1903+
18991904
19001905
version "0.21.3"
19011906
resolved "https://registry.yarnpkg.com/@rollup/plugin-buble/-/plugin-buble-0.21.3.tgz#1649a915b1d051a4f430d40e7734a7f67a69b33e"

0 commit comments

Comments
 (0)