19 lines
631 B
TypeScript
19 lines
631 B
TypeScript
import { VNode, toChildArray } from "preact";
|
|
|
|
export function OL(props: {children?: VNode | VNode[], color?: string;}) {
|
|
const childs = toChildArray(props.children);
|
|
props.color = props.color || 'bg-sky';
|
|
return (
|
|
<ol>
|
|
{childs.map((c,i) => (
|
|
<li class="flex gap-4 p-1 even:bg-black/10">
|
|
<div class={`w-16 h-16 relative p-2 ${props.color} rounded-md text-white`}>
|
|
<span class="text-6xl font-pixel absolute -bottom-1 right-0 text-smoke-800/30">{i+1}</span>
|
|
<span class="text-5xl font-pixel">{i+1}</span>
|
|
</div>
|
|
{c}
|
|
</li>
|
|
))}
|
|
</ol>
|
|
)
|
|
} |