app-ui / layout / list-containers
Card With Dividers
02-card-with-dividers.jsx
const items = [{ id: 1 }, { id: 2 }, { id: 3 }]
export default function Example() {
return (
<div className="overflow-hidden rounded-md bg-white shadow-sm dark:bg-gray-800/50 dark:shadow-none dark:outline dark:-outline-offset-0 dark:outline-white/10">
<ul role="list" className="divide-y divide-gray-200 dark:divide-white/10">
{items.map((item) => (
<li key={item.id} className="px-6 py-4">
{/* Your content */}
</li>
))}
</ul>
</div>
)
}