search

cessda / cessda.cdc.versions

Issue track and wiki for the CESSDA Data Catalogue
https://datacatalogue.cessda.eu/
Apache License 2.0
0 stars 0 forks source link

Overflow issues on small screen and underflow on short pages on large screen #611

Closed markusjt closed 10 months ago

markusjt commented 1 year ago

Slight overflow on front page with "Study description available in" and "Access data" taking a bit too much space next to each other so they also need to be wrapped. Need to check what it looks like after adding the wrap when there's enough languages that they also start wrapping, just in case there's more than the usual one or two languages.

Varying overflow on detail view depending on the metadata, e.g. https://datacatalogue.cessda.eu/detail?lang=en&q=633d030b1b97f77d90a549629cf6dc5c93c3d0167bd65cafa964edb65b4f609d overflows heavily due to extremely long texts (links) in Related publications. Can be fixed by adding word-wrap: break-word; and I don't really see any big downsides with using it. Copying the link is still easy and spaces don't get added in the places were the word was broken.

Underflow happens on pages that don't have enough content to fill the screen on big resolution, e.g. About. Not a big issue but doesn't look great and should be able to be fixed fairly easily.

markusjt commented 10 months ago

@MortenSikt I closed #415 on Tuesday and now opened PR for this. This one also includes a small change to what was added in #415 as I realized that keywords was showing "Not available" on result list if there wasn't any for the study and I don't think it's needed. Especially because it doesn't actually tell what is not available since there's no "Keywords" text on result list like there is on detail view. Now there is a check so "Not available" doesn't show up on result list when there's no keywords.

Copy pasting here what I added on the PR also for these overflow and underflow fixes: Fixing the underflow, e.g. looking at About page on a large screen, required setting quite a few min-height and height in addition to making .sk-layout also flex so it then required some additional changes to fix some elements that got broken like showing selected filters on mobile. I don't think I missed any but I can't really check all kinds of browsers and devices so hopefully there aren't any that would behave very differently with these changes.

MortenSikt commented 10 months ago

Agree that it does not make sense to show "not available" in the result list. This has also been a general comment from the UG on all fields, but that is a different discussion.

When you say you have added this to PR, that does not mean the staging iteration of CDC right? Because I can not see these changes there.

markusjt commented 10 months ago

When you say you have added this to PR, that does not mean the staging iteration of CDC right? Because I can not see these changes there.

I don't actually know since I just use my own dev server. I'd assume staging usually has what is on the main branch and these still have the pull request from development branch open so I can merge these changes now and then just start a new development branch if needed. I'm not sure how quickly the changes will show up on staging or if it actually requires some manual work but @matthew-morris-cessda can confirm how it works.

Edit: Oh right, merging automatically closes this as completed but we can open it again if needed. I didn't find any issues and Matthew also approved the changes on Friday.

MortenSikt commented 10 months ago

If you have checked the changes and there were no errors there I think we can say that this is good. No need to reopen.