wing-ops/frontend/src/tabs/showcase/sections/ButtonSection.tsx

22 lines
846 B
TypeScript

const Section = ({ title, desc, children }: { title: string; desc?: string; children: React.ReactNode }) => (
<div className="mb-8">
<h2 className="wing-section-header mb-1">{title}</h2>
{desc && <p className="wing-section-desc mb-4">{desc}</p>}
<div>{children}</div>
</div>
);
const ButtonSection = () => (
<Section title="Button" desc="wing-btn 변형">
<div className="flex gap-2 flex-wrap items-center">
<button className="wing-btn wing-btn-primary">Primary</button>
<button className="wing-btn wing-btn-secondary">Secondary</button>
<button className="wing-btn wing-btn-outline">Outline</button>
<button className="wing-btn wing-btn-danger">Danger</button>
<button className="wing-btn wing-btn-primary" disabled>Disabled</button>
</div>
</Section>
);
export default ButtonSection;