diff --git a/bundled-addons/aegis/panel.html b/bundled-addons/aegis/panel.html index a0e7f1e5..d8e1c6e9 100644 --- a/bundled-addons/aegis/panel.html +++ b/bundled-addons/aegis/panel.html @@ -443,18 +443,34 @@ "0" and "0.000123" right-align identically, actions are fixed to 46px. Net result: columns look like a table, not a flex mess. */ /* 0.9.8: five columns for the five cells the row actually renders — - icon · label · copy · amount · menu. The template still described the - pre-0.9.2 layout (six columns, including an address cell that no + icon · label · copy · amount · menu. The template used to describe + the pre-0.9.2 layout (six columns, including an address cell that no longer exists), so every cell sat one column left of where it - belonged: copy landed in the label's space, the amount in the old - label column, and the ⋯ in the amount column instead of the edge. - That is what made copy and amount collide. - The label is the flexible column so it takes the slack and truncates - rather than squeezing the number, and the menu is pinned right. */ + belonged, which is what made copy and amount collide. + 0.9.9: the columns are declared ONCE on the list and every row + inherits them via subgrid. Previously each row was its own grid, so + the `auto` amount column resolved per row — a row holding + 0.3066756 got a narrower column than one holding 0.43789841, and the + copy button landed at a different x on every line. Column widths + must be shared to line up, and subgrid is what shares them. */ + /* Column gap lives on the parent: a subgrid takes its gutters in the + subgridded axis from the grid it inherits, so setting it on the row + would be ignored. */ + .wstrip .walist { display: grid; + grid-template-columns: 16px minmax(0,1fr) 24px auto 26px; + column-gap: 8px; row-gap: 2px; } .wstrip .warow { display: grid; - grid-template-columns: 16px minmax(0,1fr) 24px auto 26px; - gap: 8px; align-items: center; padding: 5px 6px; + grid-template-columns: subgrid; grid-column: 1 / -1; + align-items: center; padding: 5px 6px; border-radius: 6px; border: 1px solid transparent; cursor: pointer; min-height: 30px; } + /* Fallback for a host without subgrid: pin the amount column to a fixed + width so the copy column still lines up. Wide enough for eight + decimals of BCH plus its ticker. */ + @supports not (grid-template-columns: subgrid) { + .wstrip .walist { display: block; } + .wstrip .warow { grid-template-columns: 16px minmax(0,1fr) 24px 104px 26px; + grid-column: auto; gap: 8px; } + } .wstrip .warow:hover { background: rgba(255,255,255,.04); } .wstrip .warow.on { background: rgb(from var(--acid, #d6ff3d) r g b / .10); border-color: rgb(from var(--acid, #d6ff3d) r g b / .35); } diff --git a/bundled-addons/aegis/panel.js b/bundled-addons/aegis/panel.js index 82bc2fd8..0aca5ff8 100644 --- a/bundled-addons/aegis/panel.js +++ b/bundled-addons/aegis/panel.js @@ -2588,7 +2588,7 @@ function renderInlineCoinList(el, groupKey, group) { ${totalFiat ? `(${esc(totalFiat)})` : ""}` : ""} ${errLine} - ${rows} +
${rows}
`;