RetroControlStrip

The Mac OS 9 Control Strip: a collapsible bottom-left strip of module buttons with pop-up menus.

Installation

npx shadcn@latest add "https://nostalgia-ui.com/r/retro-control-strip.json"

Setup: installing any component also installs nostalgia-theme (the --os9-* tokens and os9-* utilities) via registryDependencies. To add the theme on its own: npx shadcn@latest add https://nostalgia-ui.com/r/nostalgia-theme.json

Import

import { RetroControlStrip } from "@/components/ui/retro-control-strip"

Usage

<RetroControlStrip className="absolute bottom-4 left-0">
  <RetroControlStripModule
    icon={<SpeakerIcon />}
    label="Sound Volume"
    menu={<RetroDropdownMenuItem>Mute</RetroDropdownMenuItem>}
  />
  <RetroControlStripModule icon={<CDIcon />} label="Eject" onClick={eject} />
</RetroControlStrip>

On the desktop

Click the ridged tab to collapse or expand the strip. Modules with a small triangle open a pop-up menu.

Volume: 5 · Depth: thousands · AppleTalk: on · Last action: —

Collapsed by default, right side