Pill and running-dot visual polish

- Fixed-width pill: the title gets a fixed 150px centered box instead of
  a cap, so every app's pill is identical and the minimize/close buttons
  sit at the same screen position in every app — they're operated by
  muscle memory, like any titlebar's controls.
- Give the pill title line-height 1.35: overflow:hidden (needed for the
  ellipsis) also clips vertically, and at line-height 1 it cut the
  descenders off g/p/y.
- More air around the tile running dot: label margin 6px → 10px and the
  dot 2px lower (tile row height 78px → 82px to keep the label line in
  budget — the pager layout reads the CSS var, so it follows). The
  icon's 1.08x hover growth no longer touches the dot.
This commit is contained in:
jelveh
2026-07-22 14:15:55 -07:00
parent 6ccb343523
commit 0051855045
+9 -1
View File
@@ -4328,7 +4328,15 @@ body.dashboard-mode .window-dashboard-headless .window-body-app {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 168px;
/* FIXED title box (not a cap): every app's pill is the same width, so
the minimize/close buttons sit at the same screen position in every
app — they're operated by muscle memory. Short titles center in
the box like a classic titlebar. The collapse animation still
drives max-width to 0. */
flex: none;
width: 150px;
max-width: 150px;
text-align: center;
margin: 0 6px 0 4px;
transition: max-width 0.22s ease, opacity 0.15s ease, margin 0.22s ease;
}