| Volker_E | |
| Mar 15 2023, 12:19 PM |
| F57288610: Screenshot 2024-08-23 at 09.59.56.png | |
| Aug 23 2024, 2:03 PM |
| F38219994: image.png | |
| Oct 13 2023, 6:04 AM |
| F36914734: Table_03.png | |
| Mar 16 2023, 6:10 PM |
The tokens table presentation could use some improvements, as we have received feedback that it is difficult to review many tokens at once, especially the colors, and some information might be redundant, unnecessary, or lacking hierarchical importance. It's also not accessible, missing a caption.
| Subject | Repo | Branch | Lines +/- | |
|---|---|---|---|---|
| [WIP] docs: Deemphasize token meta information and change copy button | design/codex | main | +13 -12 |
@Volker_E I've been working on some proposals to improve the tokens table in the demo and I lean towards with this one:
Change 965619 had a related patch set uploaded (by VolkerE; author: VolkerE):
[design/codex@main] [WIP] docs: Deemphasize token meta information and change copy button
- Align deprecated and values tags: Menlo 12px, Regular and color-base
I'd restrain from making the second most important information, the token value smaller.
- Use an icon-only progressive button for the copy value
Done in a first iteration. Not sure about the clarity of that icon. I think it's more confusing than a textual label and shouldn't go icon-only.
- Increase the paddings between the value on top, the representation and the info below the representation to 32px
- Use Small text 12px for the text in the info below the representation
The comments are valuable too:
- If possible, update the value tag background to #EAECF0 with opacity-medium so these tags are less prominent in the demo
From T374706:
In the color table the second column contains multiple value types. A good table has one type per cell. Two column headers are already hinted to as "Defined in" and Refers to" are repeated in each cell, so those should clearly be column headers. Similarly, the hex code and the sample could be in their own columns. A "Notes" column also seems to be needed.
This will make the table easier to read, more compact, easier to copy values from and easier to parse.
(This issue is inspired from a discussion in the Wikimedia Hackathon Telegram channel, where it was noted that one needs to page down 40 times to get to the bottom of the table that only has 68 rows.)