Quick View count fit
Proposed · 4.3.0Local mock, October 14, 2026. Built on the native 4.3.0 chrome-4 Quick View (markup, stylesheet and Inter fonts) for the page backlinko.com/hub/seo/seoquake-usage. Only the Words value changes between scenarios; every other count is the captured one. Design reference using captured markup and sample counts.
Recommendation
Page Info’s seven-column strip gives each value 66.6px at most, so every count from 10,000 up ends in an ellipsis. The fix lets a column grow only when its value needs the room.
- Grid: replace
grid-cols-7withgrid-cols-[repeat(7,minmax(max-content,1fr))]. Columns stay equal until a value is wider than its share; then only that column grows and the others give up the difference. - Value: remove
w-max max-w-[calc(100%+12px)] truncatefrom the strip’svalueClassName. - Unchanged: the 16px tile padding, the 20px values, the blue clickable tiles and the strip’s left edge, which stays aligned with the boxes above and below.
Under each frame, the readout measures the strip as rendered: the width of every column, left to right, and whether Words shows in full.
Five digits10,028 words
The reported case. Any count from 10,000 to 99,999 renders the same way.
Six digits123,456 words
Long documentation, legal and archive pages. This is where an 8px padding cut with equal columns stops working.
Seven digits1,234,567 words
A stress test, such as a full book on one page. The remaining counts stay at the captured values.
Implementation notes
| Change | Where (chrome-4 component) | Notes |
|---|---|---|
| Content-sized columns | src/components/popup/panels/page-info/PageSummary.tsx | On the strip’s grid, replace grid-cols-7 with grid-cols-[repeat(7,minmax(max-content,1fr))]. Keep divide-x! and divide-gray-light. |
| No truncation | PageSummary.tsx | Change the strip’s valueClassName from block w-max max-w-[calc(100%+12px)] truncate text-left to block text-left. The full value and its accessible name are unchanged. |
| Padding | No change | The tiles keep px-4. An 8px padding cut is not needed once the columns size to their content, and it would move the strip’s labels 8px left of every box above and below. |
| Checks | Rebuilt extension | At 640 × 600px, check Words at 0, 4,204, 9,999, 10,028, 99,999, 100,000, 999,999 and 1,234,567 with the other reference counts unchanged. Also check combined large counts. Within the available width, require complete values, no ellipsis or divider overlap, accurate accessible names and preserved alignment. Verify the generated Tailwind class. Repeat at 125% and 150% zoom, with a larger minimum font size, and on Windows; this mock does not establish those results. |
| Known limit | Accepted for 4.3.0 | Combined large counts—for example, multiple four- or five-digit counts alongside six-digit Words—can exceed the available width. This limit is accepted for 4.3.0; no compact fallback is planned. |