| import { Link } from 'react-router-dom'; |
| import { Button } from '@/components/ui/button'; |
| import SectionBadge from './SectionBadge'; |
| import HLSVideo from './HLSVideo'; |
|
|
| export default function ChessSection() { |
| return ( |
| <section className="py-32 px-4 max-w-6xl mx-auto"> |
| <div className="grid lg:grid-cols-2 gap-20 items-center"> |
| {/* Left — Video */} |
| <div className="liquid-glass rounded-3xl aspect-[4/3] overflow-hidden"> |
| <HLSVideo |
| src="https://stream.mux.com/1CCfG6mPC7LbMOAs6iBOfPeNd3WaKlZuHuKHp00G62j8.m3u8" |
| className="w-full h-full object-cover" |
| /> |
| </div> |
| |
| {/* Right — Content */} |
| <div> |
| <SectionBadge label="Inline AI" action="New" /> |
| <h2 className="text-hero-heading text-3xl sm:text-4xl font-semibold leading-tight mt-6"> |
| Code Completions That |
| <br /> |
| Actually Understand Context |
| </h2> |
| <p className="text-hero-sub mt-4 leading-relaxed"> |
| Powered by ASI-1 Mini, get intelligent inline suggestions that consider your entire |
| workspace — not just the current file. Accept with Tab, dismiss with Escape. |
| </p> |
| <ul className="mt-6 space-y-3"> |
| {[ |
| 'Full workspace context awareness', |
| 'Framework-specific suggestions', |
| 'Learns your coding patterns', |
| ].map((item) => ( |
| <li key={item} className="flex items-center gap-3"> |
| <span className="w-1.5 h-1.5 rounded-full bg-primary shrink-0" /> |
| <span className="text-foreground/80">{item}</span> |
| </li> |
| ))} |
| </ul> |
| <div className="flex gap-4 mt-8"> |
| <Link to="/ide"> |
| <Button variant="hero">Try It Now</Button> |
| </Link> |
| <Button variant="heroSecondary">Read the Docs</Button> |
| </div> |
| </div> |
| </div> |
| </section> |
| ); |
| } |
|
|
