search

ProjectSidewalk / SidewalkWebpage

Project Sidewalk web page
http://projectsidewalk.org
MIT License
80 stars 23 forks source link

3464 truncate gallery tags #3554

Open nehaa2426 opened 1 month ago

nehaa2426 commented 1 month ago

Resolves #3464 Before:

after 3464

After:

before 3464

Looked in the gallery/Cards class to see how the Cards worked and then made changes in public/javascripts/Gallery/css/cards.css to make it so that the tags of the cards were properly truncated. Difference can be seen in the before and after pictures with the before overflowing out of the card and the after picture having ellipses instead of overflowing in the tag.

nehaa2426 commented 3 weeks ago

I worked on fixing the problem with the ellipses by playing around with the pixels of the tags, had it call the class gallery-tag instead of gallery-tag thumbnail-tag and I think that fixed the problem. I tested the code with multiple cities and refreshed the page multiple times to check that it worked and i believe that it now does!

misaugstad commented 2 weeks ago

worked on fixing the problem with the ellipses by playing around with the pixels of the tags, had it call the class gallery-tag instead of gallery-tag thumbnail-tag and I think that fixed the problem.

The biggest issue here is that this totally changes the style of the text! The thumbnail-tag class was added specifically for these tags, so I don't think that that's the answer!