`MercuryWidget`

Mercury Retrograde, from magick-components

Mercury's next or current retrograde, worked out in the browser on today's date and shown in the reader's own date format, under a picture of the planet. Rendered on the server, it leaves a blank line where the dates go.

import MercuryWidget from "magick-components/astrology/MercuryWidget";

magick-components is on npm, under MIT (how to install it), and its source is in the app's repository.

Example: With a picture

Props

background

padding

JSX

<MercuryWidget background="/night-sky.jpg" image="/pics/mercury.webp" />

Props

Prop	Type	Default	Description
`background`	`string`		The widget's background image, a URL, drawn to cover; none if omitted.
`image`	`string \| ImgHTMLAttributes<HTMLImageElement>`		Mercury's picture, drawn 85 px square and decorative: a URL, or `<img>` props for a responsive one (Next's `getImageProps()` gives them). None if omitted.
`padding`	`string`	`"10px 0 2px 0"`	Space around the picture, as CSS `padding`.

Magick.ly is open source. You can see the code used to generate this page in MercuryWidget.tsx, MercuryWidget.examples.tsx and Explorer.tsx.