Top Bar Components

The top bar (.app-header, .top-bar) contains navigation, database selection, and window controls.

Database Selector (.db-selector)

• Database dropdown to select active database
• Create new database button
• Import existing database button
• Import JSON records button
• Active media files button

Window Controls (.window-controls)

• Close button
• Minimize button
• Maximize button

Navigation Buttons

Back Button

Button with left arrow icon. Hover shows navigation history dropdown.

Title: "Go back (Alt+Left)"

Forward Button

Button with right arrow icon.

Title: "Go forward (Alt+Right)"

Browse Button

Grid icon button to browse records.

Title: "Browse records"

Previous Button

Up arrow button for previous in list.

Title: "Previous in list (Alt+Up)"

Random Button

Random/shuffle icon for random selection.

Title: "Random in list (Alt+R)"

Next Button

Down arrow button for next in list.

Title: "Next in list (Alt+Down)"

Help Button

Question mark icon for walkthrough tour.

Title: "Walkthrough Tour"

Navigation Dropdown (.nav-dropdown-btn)

Opens a dropdown menu with grouped navigation options. Text label "Navigate" with down arrow.

When opened, shows: - Navigation group with options - History section

Screenshot Files

File	Description
db-selector.png	Database selector with all buttons
window-controls.png	Window close/min/max buttons
back-button.png	Back navigation button
back-button-hover.png	Back button with history dropdown visible
forward-button.png	Forward navigation button
browse-icon-btn.png	Grid icon for browse view
prev-btn.png	Previous in list button
random-btn.png	Random selection button
next-btn.png	Next in list button
help-btn.png	Help/walkthrough button
nav-dropdown-btn.png	Navigation dropdown trigger button