54 lines
2.7 KiB
TypeScript
54 lines
2.7 KiB
TypeScript
import JavaText from "./java_tutorial.json"
|
|
import {
|
|
Carousel,
|
|
CarouselContent,
|
|
CarouselItem,
|
|
CarouselNext,
|
|
CarouselPrevious,
|
|
} from "@/components/ui/carousel"
|
|
import {Cabin} from "next/dist/compiled/@next/font/dist/google";
|
|
|
|
|
|
export default function MainPage() {
|
|
const JavaContent = JavaText
|
|
return (
|
|
<>
|
|
{JavaContent.sections.map((section, index) => (
|
|
<section key={index} id={section.id} className={`py-12 md:py-24 w-full ${index % 2 === 0 ? 'bg-muted' : ''}`}>
|
|
<div className="container mx-auto px-4 md:px-6">
|
|
<h2 className="text-3xl font-bold mb-8">{section.title}</h2>
|
|
<p className="text-lg mb-8">{section.description}</p>
|
|
<div className="grid md:grid-cols-2 gap-16">
|
|
{section.items.map((item, itemIndex) => (
|
|
<div key={itemIndex}>
|
|
<h3 className="text-2xl font-bold mb-4">{item.title}</h3>
|
|
<p className="text-muted-foreground mb-6">{item.description}</p>
|
|
<div className="bg-background rounded-lg p-6 shadow-2xl my-4">
|
|
<Carousel className="max-w px-8">
|
|
<CarouselContent>
|
|
<CarouselItem>
|
|
<pre className="text-sm font-mono">
|
|
<code className="text-pretty">{item.code}</code>
|
|
</pre>
|
|
</CarouselItem>
|
|
<CarouselItem>
|
|
<pre className="text-sm font-mono">
|
|
<code className="text-pretty">{item.result}</code>
|
|
</pre>
|
|
</CarouselItem>
|
|
</CarouselContent>
|
|
<CarouselPrevious className="mx-6"/>
|
|
<CarouselNext className="mx-6"/>
|
|
</Carousel>
|
|
</div>
|
|
<p className="text-pretty">{item.explanation}</p>
|
|
</div>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</section>
|
|
))}
|
|
</>
|
|
)
|
|
}
|