mirror of
https://github.com/massbug/judge4c.git
synced 2025-05-18 07:16:34 +00:00
feat(mdx/content): add AccordionComponent for collapsible sections with lightbulb icon
This commit is contained in:
parent
fbe0ef63d8
commit
671f29b66a
31
src/components/content/accordion.tsx
Normal file
31
src/components/content/accordion.tsx
Normal file
@ -0,0 +1,31 @@
|
||||
import { ReactNode } from "react";
|
||||
import {
|
||||
Accordion,
|
||||
AccordionContent,
|
||||
AccordionItem,
|
||||
AccordionTrigger,
|
||||
} from "@/components/ui/accordion";
|
||||
import { LightbulbIcon } from "lucide-react";
|
||||
|
||||
interface AccordionProps {
|
||||
title: string;
|
||||
children: ReactNode;
|
||||
}
|
||||
|
||||
export const AccordionComponent = ({ title, children }: AccordionProps) => {
|
||||
return (
|
||||
<Accordion type="single" collapsible>
|
||||
<AccordionItem value={title}>
|
||||
<AccordionTrigger className="py-0">
|
||||
<div className="flex items-center gap-2">
|
||||
<div className="h-5 w-5 p-0.5">
|
||||
<LightbulbIcon className="h-4 w-4" />
|
||||
</div>
|
||||
{title}
|
||||
</div>
|
||||
</AccordionTrigger>
|
||||
<AccordionContent className="pl-7 pb-0">{children}</AccordionContent>
|
||||
</AccordionItem>
|
||||
</Accordion>
|
||||
);
|
||||
};
|
Loading…
Reference in New Issue
Block a user