KTL-3868: Move KMP landing page - hero block #5193
Conversation
zoobestik
requested review from
berezinant,
krutilov and
nikpachoo
as code owners
zoobestik
force-pushed
the
ktl-3875-kmp-landing-page
branch
2 times, most recently
from
6bb6927 to
bae21ac
Compare
| padding-block: 24px; | ||
|
|
||
| @media (--ktl-ts-in) { | ||
| /* @mixin rs-hero-sm-*; */ |
There was a problem hiding this comment.
I tried to add mixins.p.css from rescui, but I see there is no way to get sm value if you are higher than 640px. Ask for help.
There was a problem hiding this comment.
Do you want to get font-size and line height, right?
Have you tried @mixin rs-typography-hero-sm?
There was a problem hiding this comment.
@nikpachoo where do you find it? I found:
@define-mixin rs-super-hero { /* ... */ }
@define-mixin rs-hero { /* ... */ }
blocks/multiplatform/hero/index.tsx
Outdated
|
|
||
| import styles from './hero.module.css'; | ||
|
|
||
| const platforms = [ |
There was a problem hiding this comment.
JIC: We have some platform types declared in the case studies module here. Probably it's worth extracting it to some common place (or maybe not)
Anyway, there is a difference in names for platforms on different pages (frontend + backend on case studies, web + server on this kmp landing) and there is still a discussion what options are better.
Not sure if there are any certain action points here, so just to share some context
There was a problem hiding this comment.
@berezinant This is an interesting question. In your version it is frontend in my figma it's web 🤔
zoobestik
force-pushed
the
ktl-3875-kmp-landing-page
branch
from
bae21ac to
1003266
Compare
# Conflicts: # pages/multiplatform/index.tsx
- Update `@jetbrains/kotlin-web-site-ui` to version 4.13.0-alpha.3 - Modify a Hero section to leverage new breakpoint hooks - Adjust responsive styles for improved layout behavior
… responsiveness - Upgrade `@jetbrains/kotlin-web-site-ui` to `4.13.0-alpha.4` - Update `@rescui/colors` dependency to `0.1.11` - Refactor Hero section layout with updated breakpoints and styling adjustments
zoobestik
force-pushed
the
ktl-3875-kmp-landing-page-layout
branch
2 times, most recently
from
2b3b054 to
8c45052
Compare
…ources - Migrate Hero icons from inline SVGs to static assets under `/public/images/multiplatform/hero` - Update `HeroBanner` component to reference new image paths - Refactor `hero.module.css` to use new CSS classes for platform-specific styles
zoobestik
force-pushed
the
ktl-3875-kmp-landing-page-layout
branch
from
8c45052 to
10ec632
Compare
This pull request introduces a new, visually enhanced multiplatform hero banner for the Kotlin website landing page, replacing the previous static layout.
Hero banner implementation:
HeroBannerReact component inblocks/multiplatform/hero/index.tsxthat displays the Kotlin Multiplatform hero section, including a title, subtitle, platform icons, and a "Get Started" button. The component uses imported SVG icons and applies custom styles.Landing page integration:
pages/multiplatform/index.tsxto import and use the newHeroBannercomponent, wrapped in a dark theme provider, and replaced the previous static layout. Also updated constants for menu items and URLs.ThemeProviderand updated the "Get started" button to link directly to the multiplatform getting started documentation.