search

avalonmediasystem / avalon

Avalon Media System – Samvera Application
http://www.avalonmediasystem.org/
Apache License 2.0
93 stars 51 forks source link

Long playlist description overflows when expanded #5884

Closed elynema closed 1 day ago

elynema commented 2 weeks ago

Description

In #5857, we added a 'show more' and 'show less' toggle for long playlist descriptions and only show 4 lines of the description by default. However, we still have formatting issues when a user expands the playlist description, especially if the font size is magnified for accessibility.

Example playlist: https://avalon-dev.dlib.indiana.edu/playlists/98 (log in as archivist1@example.com).

For longer descriptions (~120 words, the Playlist items get hidden, and only the title is visible)

Screenshot 2024-06-26 at 10 36 49 AM

For more than 150 words, the text starts to overflow beyond the page edge.

Screenshot 2024-06-26 at 10 40 02 AM

Potential solutions

  1. Expand the page so that even when the playlist description is shown, the Playlist Items block is included above the page footer and users just have to scroll to see it.
  2. Instead of show more / shore less for the playlist description, use a scrolling element.
elynema commented 2 weeks ago

I think I vote for #1 if possible myself. We already have a lot of scrolling elements to deal with.

elynema commented 1 week ago

Pushing the footer down might be the harder solution. Scrolling element would be easiest. Ok to implement the easiest solution for now.

Could have show more expand larger to footer and then enable scrolling.

joncameron commented 1 day ago

👍