Style for synonyms

[saubin78]

Style for synonyms

Requirements :

• visualy slightly different from prefered names : same nature (terms) but different status (prefered vs alternative)
• visualy clearly different from web links or clickable objects
• clear separation between two synonmys
• compactness : possibly long lists to handle
• display all languages
• accessibility rules

Solution proposed :
With a little help from Argo : https://chatbot.argo.inrae.fr/s/6758a5b8-f11f-4324-bae0-60920762b71a (prompt, suggested code, explanation)

1. The synonyms are displayed as chips (small rounded blocks) that take up very little vertical space.
2. The text of synonyms is : same size as prefered name ; texte color = dark grey to black (same as prefered names) ; background color = light‑gray (or light portal main color)
3. When the list exceeds the display capacity (ex 10 chips), a “+X” chip appears; clicking it opens a modal dialog that contains the full list, which is keyboard‑accessible (Enter / Space).
4. The chips are flexible on small screens they wrap onto multiple lines, but they remain much more compact than a conventional bulleted list.
5. keeping the compact chip presentation for synonyms while clearly indicating the language of every piece of information.

1 & 2 .

3 .

4.

5. Multilinguism

[maboukerfa]

I put together this first proposal, feedback is very welcome!

Here’s what I focused on:

• Slightly different from preferred names. Same text colour and size (inherited), differentiated only by the light rounded chip.
• Clearly not a link. Dark text, no italic, no underline and the old portal-green italic is gone.
• Clear separation. Per-chip background, subtle border, and a 6px gap.
• All languages. Language-keyed data renders every language, each chip tagged.

[jonquet]

Quick screenshots based assessment tells me it's nice.

[jonquet]

mou j'aime bien le résultat... mais cela donne (comme chez BioPortal) encore beaucoup d'importance visuelle au synonyms, presque au depend du pref label... @saubin78 on se demandait si il faudrait pas mettre le pref lavel en gras ?