import { render_and_copy } from "./common.tsx";

const Star = () => (
    <div
        class="star same-place"
        style={{
            transform: `translate(calc(${(Math.random() * 50 - 25).toFixed(
                2
            )}rem * var(--tw-border-opacity, 0)), calc(${(
                Math.random() * 50 -
                25
            ).toFixed(2)}rem * var(--tw-border-opacity, 0)))`,
        }}
    >
        *
    </div>
);
const Stars = ({ n }: { n: number }) => (
    <div id="stars" class="same-place">
        {...Array.from({ length: n }, Star)}
    </div>
);

render_and_copy(<Stars n={150} />);
