48 lines
1.3 KiB
TypeScript
48 lines
1.3 KiB
TypeScript
import { JSX } from "preact/jsx-runtime";
|
|
import { EggbugImg, Main, render_and_copy } from "./common.tsx";
|
|
|
|
const GolfBall = () => (
|
|
<div
|
|
style={{
|
|
resize: "both",
|
|
overflow: "hidden",
|
|
position: "relative",
|
|
// TODO: V REMOVE ME V
|
|
outline: "1px solid red",
|
|
width: "10rem",
|
|
height: "10rem",
|
|
transition: "all 5s",
|
|
gridArea: "1 / 1",
|
|
}}
|
|
>
|
|
<EggbugImg
|
|
type="golfball"
|
|
style={{
|
|
margin: 0,
|
|
position: "absolute",
|
|
right: 0,
|
|
bottom: 0,
|
|
width: "5rem",
|
|
height: "5rem",
|
|
pointerEvents: "none",
|
|
}}
|
|
/>
|
|
</div>
|
|
);
|
|
|
|
render_and_copy(
|
|
<Main style={{ display: "grid" }}>
|
|
<GolfBall />
|
|
</Main>
|
|
);
|
|
|
|
// OOOO: score with like a dial thing and an arrow pointing to it
|
|
// TWO DIALS WILL LOOK EVEN COOLER
|
|
// lower is better, just have to add the dials
|
|
// might be possible to have multiple holes with a details element that comes into frame hm
|
|
|
|
// hm this kinda sucks. you just drag it to the hole, there's no challenge
|
|
// i could have the ball be in a different place but then that would feel bad
|
|
// i think i'll go for the toy angle.
|
|
// keep the dials, have a "course"
|