review and cleanup frontend page(s)

[xmo-odoo]

The front page is big (45k network, 550k) but the CSS and JS (bootstrap and "default" frontend stuff) are not exactly light (ignoring the stuff under 10k uncompressed):

	network (kB)	actual (kB)
fontawesome	77	77
frontend.css	122	700
frontend.js	9	23
favicon	184	184
frontend_lazy.js	546	1860

Now to be fair most of the load time is from the HTML, because it's also slow to generate (would be a good idea to do some profiling).

But it would probably make sense to get rid of the existing JS and bootstrap CSS and have only the styles we need (a fair amount of the mergebot CSS being to reconfigure either bootstrap or other odoo frontend style). While at it,

• the mobile view is really quite poor, the full height of the per-branch staging tables requires scrolling quite a bit to switch between branch, and while horizontally the cutoff makes it ok the staging lists should probably be scrollable instead, so there's a way to see more than nothing
  • maybe the branches should be foldable with indicator lights next to the branch names?
  • the per-branch list is entirely unusable on mobile as well
  • while limiting the hsize on mobile is a good idea, it shouldn't be done by cutting off the stagings list in the backend, instead there should be a reasonable number of stagings rendered (probably 8~16 as the current max of 6 gets a bit ridiculous on viewports wider than FHD) then the cells should be properly sized and have some sort of overflow e.g. either a dropdown if that's possible or a horizontal scroll.
• being able to access batch / PR backends from the dashboard would be nice
• being able to see PR titles on mobile would also be nice (currently they're visible on hover of the PR numbers)
  • can put links in <summary> and they are clickable independent on opening / closing the <details> itself
  • especially with a hook to close the <details> when clicking elsewhere
  • additionally / alternatively details/@name allows linking details elements so only one is open at a time...
• might make sense to cut off or somehow fold the "noise" of branch names e.g. trigram, fw tag, repo, branch (for fws it could also make sense to highlight all linked fws through the branches? idk)
• in the backend, contrast is severely lacking in dark mode

Possibly useful resources for non-js interactivity, and cleaner CSS organisation

• https://lyra.horse/blog/2025/08/you-dont-need-js/
• https://developer.mozilla.org/en-US/docs/Web/CSS/@layer
• https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dialog
• https://developer.mozilla.org/en-US/docs/Web/CSS/@container
• https://www.joshwcomeau.com/css/subgrid/ (about subgrids, but also a few snippets using grid)
• https://css-tricks.com/pure-css-tabs-with-details-grid-and-subgrid/ something like that would allow folding the batches part of the stagings of a branch (by default, possibly with a memory).

[xmo-odoo]

Ideas: allow cancelling staging & deleting splits directly from the frontend

[xmo-odoo]

https://oat.ink/