Sasaki's React Pinboard

Pin components inside a fixed component with optional fixed aspect ratio

Install

yarn add @strategies/react-pinboard

Example

import { Pinboard, Pin } from '@strategies/react-pinboard'

<Pinboard aspect={4/3}>
    <img src={baseImage} alt="An unpinned element inside the pinboard" />

    <Pin x={.3} y={.25}>
        <YourComponent />
    </Pin>

    <Pin x={.5} y={1}>
        <YourComponent />
    </Pin>

    <Pin x={.65} y={.1}>
        <YourOtherComponent />
    </Pin>
</Pinboard>