Air traffic control strip menu
Sections are flight progress strips in a control tower rack: the chosen one slides out of the row, just as a controller does.
Settings
Code
<nav class="uvq12-at" aria-label="Control tower"><p class="hd" aria-hidden="true"><span>Control tower</span><span>RWY 36L</span></p><ol><li><a href="#" style="--c:#fde68a" aria-current="page"><span class="cs" aria-hidden="true"><b>IBE3141</b><small>A320</small></span><span class="nm">Overview</span><span class="rt" aria-hidden="true">MAD LIS</span></a></li><li><a href="#" style="--c:#bfdbfe"><span class="cs" aria-hidden="true"><b>VLG7012</b><small>A321</small></span><span class="nm">Flights</span><span class="rt" aria-hidden="true">BCN ORY</span></a></li><li><a href="#" style="--c:#fecaca"><span class="cs" aria-hidden="true"><b>AEA1024</b><small>B738</small></span><span class="nm">Passengers</span><span class="rt" aria-hidden="true">PMI MAD</span></a></li><li><a href="#" style="--c:#bbf7d0"><span class="cs" aria-hidden="true"><b>RYR4410</b><small>B38M</small></span><span class="nm">Baggage</span><span class="rt" aria-hidden="true">AGP STN</span></a></li><li><a href="#" style="--c:#e9d5ff"><span class="cs" aria-hidden="true"><b>TAP1013</b><small>A20N</small></span><span class="nm">Reports</span><span class="rt" aria-hidden="true">LIS OPO</span></a></li></ol></nav>Prompt for AI
Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.
More in Navigation
See all NavigationWhere to use it
A vertical menu inspired by the paper strips air traffic controllers keep in a rack. Each section is a coloured strip with a callsign, aircraft type and route printed in monospace, and the chosen one slides out of the row with a red marker, the way a controller flags the flight they are handling. Arrow keys move between strips. It suits dashboards, logistics tools and admin panels.
The main color sets the active marker and the secondary color the metal rack. Give each strip its own paper colour in the data, and keep the printed codes as decoration next to a clear section name.