class vs className

This commit is contained in:
2025-01-02 10:39:30 -06:00
parent 3e97becf67
commit 3de98ca7e2

View File

@@ -17,7 +17,7 @@ const Badge = ({
return ( return (
<span <span
id="badge-dismiss-dark" id="badge-dismiss-dark"
class={cn( className={cn(
"inline-flex align-middle items-center px-2 py-1 me-2 text-sm leading-none font-medium text-zinc-800 bg-zinc-100 rounded dark:bg-zinc-700 dark:text-zinc-300", "inline-flex align-middle items-center px-2 py-1 me-2 text-sm leading-none font-medium text-zinc-800 bg-zinc-100 rounded dark:bg-zinc-700 dark:text-zinc-300",
className className
)} )}
@@ -26,11 +26,16 @@ const Badge = ({
<button <button
type="button" type="button"
onClick={onClick} onClick={onClick}
class="inline-flex items-center ms-1 text-sm text-zinc-400 bg-transparent rounded-sm hover:bg-zinc-200 hover:text-zinc-900 dark:hover:bg-zinc-600 dark:hover:text-zinc-300" className="inline-flex items-center ms-1 text-sm text-zinc-400 bg-transparent rounded-sm hover:bg-zinc-200 hover:text-zinc-900 dark:hover:bg-zinc-600 dark:hover:text-zinc-300"
data-dismiss-target="#badge-dismiss-dark" data-dismiss-target="#badge-dismiss-dark"
aria-label="Remove" aria-label="Remove"
> >
<svg class="w-2 h-2" aria-hidden="true" fill="none" viewBox="0 0 14 14"> <svg
className="w-2 h-2"
aria-hidden="true"
fill="none"
viewBox="0 0 14 14"
>
<path <path
stroke="currentColor" stroke="currentColor"
stroke-linecap="round" stroke-linecap="round"
@@ -39,7 +44,7 @@ const Badge = ({
d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6" d="m1 1 6 6m0 0 6 6M7 7l6-6M7 7l-6 6"
/> />
</svg> </svg>
<span class="sr-only">{screenReaderLabel ?? "Remove"}</span> <span className="sr-only">{screenReaderLabel ?? "Remove"}</span>
</button> </button>
</span> </span>
); );