[FIX] #47001 UI: Reimplements legacy presentation table important field listing

[matheuszych]

https://mantis.ilias.de/view.php?id=47001

Aims to reimplement legacy presentation table important field listing.
@oliversamoila @thojou

[oliversamoila]

Hello together,
from a UX and UI perspective, the result looks good. Thank you very much for your contribution.
I'm forwarding this to @thibsy for code review. He may contact you with change requests or incorporate the changes directly (That includes cherry picking too.)

Kind regards,
@oliversamoila (as UI coordinator)

[thibsy]

Hi @matheuszych,

Thx a lot for your contribution to the UI framework!

Actually, I believe this makes accessibility worse than before. We should avoid actual characters like | for separation of properties, or at least make them invisible to assistive technologies. To improve accessibility and hereby usability, I think we should use a description list element, which seems semantically correct here. @Annett7811 please correct me if I am wrong.

Please implement the following changes:

• Description list: please implement the presentation table header fields, and its label and value pairs, using the appropriate description list elements.

Kind regards,
@thibsy (as UI coordinator)

[matheuszych]

Hallo @thibsy ,

thank you for your feedback. I adjusted the code accordingly. Please take a look again.

Best regards
@matheuszych

[Annett7811]

Hello!

@thibsy: In my opinion, switching to a semantic implementation using description lists (dl, dt, dd) makes sense here. The previous solution with separators such as “|” is purely visual and not recommended from an accessibility perspective.
I therefore support the proposed implementation.

Best regards
Annett