search

mitodl / open-discussions

BSD 3-Clause "New" or "Revised" License
10 stars 2 forks source link

Podcasts: Ideally There Would be Two Lines for the Podcast Title before the Ellipsis (...) #2865

Open odlbot opened 4 years ago

odlbot commented 4 years ago

As a postcast listener, I'd like to see more of the podcast title if it's long. Carey pointed to this as potential help: http://hackingui.com/front-end/a-pure-css-solution-for-multiline-text-truncation/

Designs and Mockups

See attached Invision

Acceptance Criteria:

Out of Scope

┆Attachments: Open Courses_Learning Podcast_Search_Episodes Only-With_Drawer_Player Mock | https://projects.invisionapp.com/share/2RWOR84EJVY#/screens/413779851_Open_Courses_Learning_Podcast_Search_Episodes_Only-With_Drawer_Player_Mock | Desktop Player

alicewriteswrongs commented 4 years ago

is this referring to the display of the title in the drawer, on the podcasts landing page, or on the search? I think the current implementation supports up to two lines in both the podcast drawer and the podcast cards:

Screenshot from 2020-04-30 16-29-50

gumaerc commented 4 years ago

This is referring to the title in the Audio Player. In the Invision design, it shows a long episode title wrapping around and then being truncated on the second line. It isn't possible to use pure CSS to deal with this per what's described in the link above, but it can be done with Javascript. I was more posing the question of whether it's worth introducing JS to do this or if we were okay with just truncating it after one line.

gumaerc commented 4 years ago

Although, for what it's worth, I can't find that mock on Invision anymore...

odlbot commented 4 years ago

➤ Brian Grossman commented:

gumaerc Are the Invision links (above) working for you? I just added a second example.

gumaerc commented 4 years ago

I can see the mock you posted on the card, but it's not the one I remember. The one I saw wrapped around and had an ellipsis (...) at the end of the second line.