mirror of
https://github.com/HeyPuter/puter.git
synced 2026-08-24 15:07:17 +00:00
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:
@@ -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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user