yonlu/yellowjacket
1
1
Fork 0
Code Issues 55 Pull Requests 6 Actions Packages Projects Releases 12 Wiki Activity

Desktop: rework the top bar — centre the search, swap the library selector, replace the wordmark with "YJ" #48

New Issue
Open
opened 2026-08-18 05:58:15 +00:00 by logan · 0 comments
logan commented 2026-08-18 05:58:15 +00:00
Collaborator
Copy Link
Copy Source

Report

Swap the positions of the search bar and the library selection dropdown in the top bar so the search bar is centred. Also remove the "YellowJacket" text from the top left and replace it with a simple "YJ" that links to the home page.

Findings

  • The header holds the wordmark + subtitle (an hgroup; the subtitle is a <p> and .title zeroes both margins because the flex-centred block was being clipped by the 4em bar), the library filter, the search box and the job indicator.
  • The search box keeps its slot everywhere and is disabled where it cannot serve — its appearing/disappearing used to move the library filter and the job indicator on every navigation. Any reordering must preserve that.
  • Below 900px the subtitle is hidden and the sidebar collapses to icons; below 600px the header's controls shrink or stand down. A centred element in a three-part bar needs equal-width outer columns with min-width: 0 or it will drift.
  • The skip link is the first thing Tab reaches and is position: absolute in both states — do not make it an in-flow grid child.

Direction

Three-column header: mark + library selector | search | job indicator + queue toggle. "YJ" becomes a real link/button to Home with an accessible name of "YellowJacket — Home" (not "YJ"). Pairs with the logo issue — the mark may become the icon rather than letters.

**Report** Swap the positions of the search bar and the library selection dropdown in the top bar so the search bar is centred. Also remove the "YellowJacket" text from the top left and replace it with a simple "YJ" that links to the home page. **Findings** - The header holds the wordmark + subtitle (an `hgroup`; the subtitle is a `<p>` and `.title` zeroes both margins because the flex-centred block was being clipped by the 4em bar), the library filter, the search box and the job indicator. - The search box **keeps its slot everywhere and is disabled** where it cannot serve — its appearing/disappearing used to move the library filter and the job indicator on every navigation. Any reordering must preserve that. - Below 900px the subtitle is hidden and the sidebar collapses to icons; below 600px the header's controls shrink or stand down. A centred element in a three-part bar needs equal-width outer columns with `min-width: 0` or it will drift. - The skip link is the first thing Tab reaches and is `position: absolute` in both states — do not make it an in-flow grid child. **Direction** Three-column header: mark + library selector | search | job indicator + queue toggle. "YJ" becomes a real link/button to Home with an accessible name of "YellowJacket — Home" (not "YJ"). Pairs with the logo issue — the mark may become the icon rather than letters.
logan added the Area/Shell-NavKind/EnhancementPlatform/Desktop
Priority
Low
4
 labels 2026-08-18 14:36:12 +00:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
Area/Design
Area/Downloads
Area/Explore
Area/Library-UI
Area/Metadata
Area/Packaging
Area/Player
Area/Queue
Area/Settings
Area/Shell-Nav
Compat/Breaking
Breaking change that won't be backward compatible
 Kind/Bug
Something is not working
 Kind/Documentation
Documentation changes
 Kind/Enhancement
Improve existing functionality
 Kind/Feature
New functionality
 Kind/Security
This is security issue
 Kind/Testing
Issue or pull request related to testing
 Platform/Android
Platform/Desktop
Priority
Critical
1
The priority is critical
Priority
High
2
The priority is high
Priority
Medium
3
The priority is medium
Priority
Low
4
The priority is low
Reviewed
Confirmed
1
Issue has been confirmed
Reviewed
Duplicate
2
This issue or pull request already exists
Reviewed
Invalid
3
Invalid issue
Reviewed
Won't Fix
3
This issue won't be fixed
Status
Blocked
1
Something is blocking this issue or pull request
Status
Need More Info
2
Feedback is required to reproduce issue or to continue work
Status
Abandoned
3
Somebody has started to work on this but abandoned work
Status
In Progress
Somebody is actively working on this right now
No labels Area/Shell-Nav Kind/Enhancement Platform/Desktop
Priority
Low
4
Milestone
No items
No Milestone
Projects
Clear projects
No projects
Assignees
Clear assignees
logan yonlu
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: yonlu/yellowjacket#48