# Move Action Buttons to Top

**Date:** 2026-05-25

## Requests

> on the popup window, there are buttons at the bottom (after the playlists). move them to the top (so the user doesn't need to scroll to access the actions).

> put a small space between the buttons and the first playlist

> when the buttons wrap onto another line (row), add a (smaller) space between the rows of buttons

> also add a very small (horizontal) space between the buttons

## Changes

- **`popup/popup.html`**: Moved the `export-container` div (containing Export Playlists, Import Playlists, History, Save Channel, Wiki/Insp buttons) from after all view containers to just before the `playlists-container`. The buttons now appear immediately below the header on the main playlists view.
- **`popup/popup.css`**: Added `.export-container` rule with:
  - `display: flex; flex-wrap: wrap` — enables wrapping layout
  - `row-gap: 6px` — small space between wrapped rows of buttons
  - `column-gap: 4px` — very small horizontal space between buttons
  - `margin-bottom: 12px` — gap between the button bar and the first playlist