amadan
home: labelled method rows lead with the label (#1141)
'1Password Eleven key' over 'Passkey · added 3 Jul' — the distinguisher earns the bold; unlabelled rows keep the kind on top.
Co-authored-by: Claude Fable 5 <noreply@anthropic.com>
1 file changed,
+13
−7
home/web/static/home.js+13 −7
diff --git a/home/web/static/home.js b/home/web/static/home.js| index c19b053..7314c4f 100644 |
| --- a/home/web/static/home.js |
| +++ b/home/web/static/home.js |
| @@ -1268,21 +1268,27 @@ function methodRow(a) { |
| const label = def ? def.name : a.kind; |
| const tag = methodLabel(key); // "" when unlabelled, or the vault is sealed |
| const added = methodAdded(a.created_at); |
| - const longName = label + (tag ? ", " + tag : "") + (added ? ", " + added : ""); // for the aria labels |
| + // A labelled row leads with the label — the distinguisher earns the bold |
| + // ("1Password Eleven key" over "Passkey · added 3 Jul"); unlabelled rows |
| + // keep the kind on top. The aria name reads in the same order. |
| + const longName = (tag ? tag + ", " + label : label) + (added ? ", " + added : ""); |
| const main = document.createElement("div"); |
| main.className = "method-main"; |
| const name = document.createElement("span"); |
| name.className = "method-name"; |
| - name.textContent = label; |
| + name.textContent = tag || label; |
| main.append(name); |
| if (editingLabel === key) { |
| main.append(labelEditor(key, tag, longName)); |
| - } else if (tag || added) { |
| - const sub = document.createElement("span"); |
| - sub.className = "method-added"; |
| - sub.textContent = tag && added ? tag + " · " + added : tag || added; |
| - main.append(sub); |
| + } else { |
| + const subText = (tag ? [label, added] : [added]).filter(Boolean).join(" · "); |
| + if (subText) { |
| + const sub = document.createElement("span"); |
| + sub.className = "method-added"; |
| + sub.textContent = subText; |
| + main.append(sub); |
| + } |
| } |
| li.append(main); |