Zaki/Password-Manager
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(list): stop the folder/tag chips drifting row to row

Browse Source 
.entry-meta and the first order-6 action both had margin-left:auto, so the
free space was SPLIT between them — the chips landed at a different x on
every row depending on how wide the rest of the row was. .entry-meta is
always present (empty when the entry has no chips), so its auto alone puts
the actions at the far edge and right-aligns the chips against them.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
r-zakarya
2026-07-22 11:56:48 +01:00
parent a0b6c5c67a
commit 72ef034459
1 changed files with 5 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files
css/style.css
+5 -7
View File
@@ -938,7 +938,7 @@ input[type="range"]::-webkit-slider-thumb {
order: 5; order: 5;
/* Absorb the free space freed up by the now-fixed title, pushing tags/ /* Absorb the free space freed up by the now-fixed title, pushing tags/
folder + the order-6 actions to the far right while pw stays put. folder + the order-6 actions to the far right while pw stays put.
(When a row has no meta, the order-6 rule below carries the auto.) */ Sole auto margin in the row — see the note below the order-6 block. */
margin: 0 0 0 auto; margin: 0 0 0 auto;
flex-shrink: 0; flex-shrink: 0;
max-width: 220px; max-width: 220px;
@@ -960,12 +960,10 @@ input[type="range"]::-webkit-slider-thumb {
order: 6; order: 6;
flex-shrink: 0; flex-shrink: 0;
} }
/* First trailing action floats right too, so rows WITHOUT an entry-meta /* NOTE: no margin-left:auto here. .entry-meta is always in the DOM (empty
still push their actions to the far edge (margin-left:auto on the first when the entry has no chips) and already carries the auto, so it absorbs
flex item consumes the free space; later ones are no-ops). */ all the free space. A second auto margin would SPLIT the free space
.entry-grid.is-list .entry-fav, between the two, drifting the chips left/right depending on row width. */
.entry-grid.is-list .entry-kebab-wrap,
.entry-grid.is-list .entry-head .icon-btn { margin-left: auto; }
/* Selection checkbox overlay — nested INSIDE the avatar (.entry-avatar /* Selection checkbox overlay — nested INSIDE the avatar (.entry-avatar
is position:relative) so it covers the avatar 1:1, no overlap with the is position:relative) so it covers the avatar 1:1, no overlap with the
avatar's footprint. Hidden by default; appears on card hover OR when avatar's footprint. Hidden by default; appears on card hover OR when