danvics/soulsync
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 2

Dashboard: make the enrichment services cluster mobile-responsive

Browse source 
On mobile, worker-orbs is disabled so the enrichment buttons render as real
buttons. They were a ragged centered flex-wrap with the wide 'Manage Workers'
pill jammed inline. Now (<=768px, scoped to #dashboard-page so Settings etc.
are untouched): the 44px icon buttons spread evenly across the full width in an
auto-fit grid, and the Manage Workers pill gets its own full-width row.
This commit is contained in:
BoulderBadgeDad 2026-06-03 19:10:31 -07:00
parent 8723f9c433
commit 7706e1b16b
1 changed files with 17 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

19
webui/static/style.css
View file

@ -10156,10 +10156,25 @@ body.helper-mode-active #dashboard-activity-feed:hover {
padding: 16px;
}
.header-actions {
/* Dashboard enrichment service buttons: worker-orbs is disabled on mobile,
so these render as real buttons. Spread the 44px icon buttons across the
full width in an even auto-fit grid (no ragged centered rows), and give
the wider "Manage Workers" pill its own full-width row. Scoped to the
dashboard so other pages' .header-actions (e.g. Settings) are untouched. */
#dashboard-page .header-actions {
width: 100%;
display: grid;
grid-template-columns: repeat(auto-fit, minmax(44px, 1fr));
justify-items: center;
align-items: center;
gap: 12px 10px;
}
#dashboard-page .header-actions .em-manage-btn {
grid-column: 1 / -1;
width: 100%;
margin-left: 0;
justify-content: center;
gap: 6px;
}
.header-quick-nav {