export const ResultTile = (props: { home?: number; away?: number }) => {
  return (
    <div class="flex flex-col items-center justify-center bg-app/60 p-2 rounded-lg border border-line">
      <div class="flex items-center gap-1 font-mono text-xs font-bold">
        <span
          class={props.home > props.away ? "text-accent" : "text-ink"}
        >
          {props.home ?? "-"}
        </span>
        <span class="text-ink-faint">:</span>
        <span
          class={props.away > props.home ? "text-accent" : "text-ink"}
        >
          {props.away ?? "-"}
        </span>
      </div>
    </div>
  );
};