Featured Release Footer Block for React

The title and the artist are the caption text ("Salt glass", "Lark Pell"). LISTEN is the three links under the cover. GROUPS and LEGAL are the columns and the policies. Point each href at its page.

The links say Streaming, Download and Vinyl, so the footer stays useful whatever the label uses this month. The icon set has no brand marks. To name a service, change the label in LISTEN and keep the link's text as its accessible name.

No. Each bar bounces four times, at 0.8 seconds a bounce, and the last bar starts a fraction later, so the motion ends in under four seconds and then rests. When the visitor has asked for reduced motion, the bars stay still. The bars are hidden from assistive technology; the title and the artist are the caption.

Yes. Cover is one svg of a disc and its grooves, in the theme's foreground and muted tones. Replace that svg with an img of the sleeve, keep the frame around it, and give the image a text alternative. Leave the svg as one component: splitting the shapes into nested components breaks the ports.

The wordmark, the sentence and the release come first, then a rule, then the two columns, then the legal row. From lg the release sits beside the columns and the divider runs through the legal band. The cover is a small square, so the row stays short. Nothing scrolls sideways at 320 pixels.

It is the current year, read when the footer renders, so it never goes stale. The block is a server component with no state, so on a server-rendered site the year is the server's when the page was built or rendered.