shadcn.io is not affiliated with official shadcn/ui
Desktop App Changelog Block for Vue
A desktop-app release page: a framed download panel with system tabs, a Stable and Beta switch, the file, its size, a copyable checksum and a Shine Button download link, beside the release's version, date and three changes.
Installation
Overview
A desktop app changelog for Vue with Ark UI, written for Deskbound, a fictional desktop notes app. A split puts a framed download panel first on a wide screen and just under the header on a phone. The panel has Tabs for macOS, Windows and Linux, a Segment Group for Stable and Beta, and for the chosen pair the version, the file name, its size, what it needs, a checksum with a Copy button and a Shine Button link, Download for macOS. Beside it the release's version, date and three changes carry a kind each. It's built from Guides, Tabs, Segment Group, Copy Button, Shine Button and Badge, with CSS transitions for the entrance. For release pages of apps people install. The builds and checksums are example values.
FAQ
Does the download button download anything?
No. The link goes to a placeholder address, and the checksums are example values; the note under the notes says so. Point the link at your files and replace the digests.
What does the Copy button copy?
The full SHA-256 checksum of the chosen build, although the panel shows only its start. The button has a name that says which file it is for and announces when it has copied.
What happens when I change the system or the channel?
The panel shows that build's version, file, size, requirements and checksum, and the button's label follows the system. All six panels share one grid cell with the others unseen, so the page never moves.