Files
website/components/infobox.tsx
2025-09-12 23:20:36 +02:00

25 lines
732 B
TypeScript

"use client";
import React from "react";
import { cn } from "@/lib/utils";
interface InfoBoxProps extends React.HTMLAttributes<HTMLDivElement> {
title: string;
}
export function InfoBox({ title, children, className, ...props }: InfoBoxProps) {
return (
<aside
className={cn(
"not-prose relative mt-4 mb-8 p-4 border rounded-lg shadow-sm bg-card text-card-foreground",
// --- FIX IS HERE: Tell the InfoBox to clear the left float on desktop ---
"md:float-right md:w-64 md:ml-4 md:mb-4 md:clear-left",
className
)}
{...props}
>
<h3 className="font-bold mt-0 mb-2 text-lg">{title}</h3>
<div className="text-sm space-y-2">{children}</div>
</aside>
);
}