fix: align list header search and actions on one row with top spacing

[bbrands02]

Summary

• .listHeader was missing display: flex, causing the search field and ... actions menu to stack vertically instead of appearing side by side
• Added padding-block-start: 8px for top spacing between the Nextcloud header bar and the search row
• flex: 1; min-width: 0 on .searchField so it expands to fill remaining width without overflowing
• flex-shrink: 0 on .listHeaderActions so the dots button stays at its natural size

Applies to all 8 list sidebars at once (Endpoints, Synchronizations, Jobs, Mappings, Consumers, Webhooks, Rules, Events) via the shared CSS classes.

The flex layout is defined in src/assets/app.css (compiled via webpack, always cache-busted on build). The border-bottom and padding-inline-start: 65px (toggle button clearance) remain in css/main.css where they were already correctly defined.

Test plan

• Open any list sidebar (e.g. Endpoints, Jobs, Synchronizations)
• Confirm search field and ... menu appear on the same horizontal row
• Confirm there is visible top spacing between the Nextcloud header and the search bar
• Confirm search field expands to fill available width with the dots button flush to the right

🤖 Generated with Claude Code

[github-actions]

Quality Report — ConductionNL/openconnector @ ed365cd

Check	PHP	Vue	Security	License	Tests
lint	✅
phpcs	❌
phpmd	✅
psalm	✅
phpstan	✅
phpmetrics	✅
eslint		❌
stylelint		❌
composer			✅	✅ 148/148
npm			❌	❌ 1/573 denied
PHPUnit					⏭️
Newman					⏭️
Playwright					⏭️

❌ Denied npm licenses

Package	Version	License
@fortawesome/free-solid-svg-icons	6.7.2	(CC-BY-4.0 AND MIT)

---

Quality workflow — 2026-04-24 15:02 UTC

Download the full PDF report from the workflow artifacts.