1"use client";
2
3const highlights = [
4 {
5 title: "Improving Cursor Tab with online RL",
6 description:
7 "Our new Tab model makes 21% fewer suggestions while having 28% higher accept rate.",
8 category: "Research",
9 date: "Sep 12, 2025",
10 },
11 {
12 title: "1.5x faster MoE training with custom MXFPβ kernels",
13 description:
14 "Achieving a 3.5x MoE layer speedup with a complete rebuild for Blackwell GPUs.",
15 category: "Research",
16 date: "Aug 29, 2025",
17 },
18 {
19 title: "Series C and Scale",
20 description:
21 "We've raised $900m to push the frontier of AI coding research.",
22 category: "Company",
23 date: "Jun 7, 2025",
24 },
25];
26
27export const RecentHighlights = () => {
28 return (
29 <div className="w-full min-h-screen bg-[#1B1913] flex items-center justify-center p-8 md:p-16">
30 <div className="max-w-5xl w-full">
31 <div className="grid grid-cols-1 lg:grid-cols-[200px_1fr] gap-12 lg:gap-20">
32 <h2 className="text-white/90 text-md font-medium">Recent highlights</h2>
33
34 <div className="space-y-3">
35 {highlights.map((highlight, index) => (
36 <div key={index} className="space-y-3 bg-[#24221c73] p-4 border border-[#4b4840]/20 hover:bg-[#26241E] rounded">
37 <h3 className="text-white text-md font-medium leading-tight">
38 {highlight.title}
39 </h3>
40
41 <p className="text-white/60 text-base leading-relaxed">
42 {highlight.description}
43 </p>
44
45 <p className="text-white/50 text-sm">
46 {highlight.category} · {highlight.date}
47 </p>
48 </div>
49 ))}
50
51 <div className="pt-4">
52 <a
53 href="#"
54 className="inline-flex items-center gap-2 text-[#FF6B35] hover:text-[#FF8C5A] transition-colors text-base font-medium"
55 >
56 View more posts
57 <svg
58 className="w-4 h-4"
59 fill="none"
60 stroke="currentColor"
61 viewBox="0 0 24 24"
62 >
63 <path
64 strokeLinecap="round"
65 strokeLinejoin="round"
66 strokeWidth={2}
67 d="M9 5l7 7-7 7"
68 />
69 </svg>
70 </a>
71 </div>
72 </div>
73 </div>
74 </div>
75 </div>
76 );
77};
78