There is something weird going on with different input fields in the OPAC. Examples: - OPAC > Advanced search: The search fields are suddenly as wide as the screen. - When OpacAddMastheadLibraryPulldown is active, it is much wider than the longest entry. I noticed these on 20.05.03 - so it would be nice to have a fix for these things with 20.05.04
On 20.11.03 I also see that the pull downs all have a wrong serif font. I cleaned out OpacUserJs and OpacUserCSS for testing.
Are you using Firefox? Could the serif font issue be the same issue of bug 27566? I would have guessed that the input fields issue was related to the bootstrap upgrade and the new form-control class but perhaps not if it's appearing in 20.05...
Sorry Henry, just noticed my typo in the first comment. It's 20.11.03 I have confirmed it in and master. bug 27566 could help - I'll try to test, thx for pointing it out! I think the form fields being too long is a different issue tho.
Created attachment 118336 [details] [review] Bug 27889: Adjust responsive width of OPAC advanced search form This patch tweaks the CSS for the advanced search form in the OPAC so that it adjusts well at various browser widths, including preventing the form from taking up the whole width of the page at higher browser widths. To test, apply the patch and rebuild the OPAC CSS (https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client). - In the OPAC, go to the advanced search page. - Test the appearance of the fields in the first "Search for" section, confirming that everything adjusts well at all widths large and small. - Click the "More options" button and test that configuration as well.
Created attachment 118343 [details] [review] Bug 27889: (follow-up) Adjust width of OpacAddMastheadLibraryPulldown This patch adds some responsive classes to the OpacAddMastheadLibraryPulldown container so that it will adjust better at various browser widths.
Created attachment 119059 [details] [review] Bug 27889: Adjust responsive width of OPAC advanced search form This patch tweaks the CSS for the advanced search form in the OPAC so that it adjusts well at various browser widths, including preventing the form from taking up the whole width of the page at higher browser widths. To test, apply the patch and rebuild the OPAC CSS (https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client). - In the OPAC, go to the advanced search page. - Test the appearance of the fields in the first "Search for" section, confirming that everything adjusts well at all widths large and small. - Click the "More options" button and test that configuration as well. Signed-off-by: David Nind <david@davidnind.com>
Created attachment 119060 [details] [review] Bug 27889: (follow-up) Adjust width of OpacAddMastheadLibraryPulldown This patch adds some responsive classes to the OpacAddMastheadLibraryPulldown container so that it will adjust better at various browser widths. Signed-off-by: David Nind <david@davidnind.com>
The changes worked fine on the latest Firefox on Ubuntu 18.04. One minor thing I noticed was that in the OPAC advanced search with more options, if one of the values (such as Subject and broader terms) is selected, the form doesn't display it in full and it gets cut off. (The drop down list is fine).
David I'm not sure I understand what you mean. Could you attach a screenshot?
Created attachment 119085 [details] Buge 27889 - Screenshots of more options display Hi Owen. Before and after screenshots showing what I tried to explain! After an advanced search option is selected it does not display to the full width of the option text. David
Updatingbug descripton - we have taken care of the fonts on bug 27566.
Created attachment 119152 [details] [review] Bug 27889: Adjust responsive width of OPAC advanced search form This patch tweaks the CSS for the advanced search form in the OPAC so that it adjusts well at various browser widths, including preventing the form from taking up the whole width of the page at higher browser widths. To test, apply the patch and rebuild the OPAC CSS (https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client). - In the OPAC, go to the advanced search page. - Test the appearance of the fields in the first "Search for" section, confirming that everything adjusts well at all widths large and small. - Click the "More options" button and test that configuration as well. Signed-off-by: David Nind <david@davidnind.com> Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Created attachment 119153 [details] [review] Bug 27889: (follow-up) Adjust width of OpacAddMastheadLibraryPulldown This patch adds some responsive classes to the OpacAddMastheadLibraryPulldown container so that it will adjust better at various browser widths. Signed-off-by: David Nind <david@davidnind.com> Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
The length of the input fields looks ok to me on different screen sizes. I could not replicate what David showed in the screenshots. Might need some fine-tuning later, but I believe this is already a fix for the regression.
Pushed to master for 21.05, thanks to everybody involved!
(In reply to Jonathan Druart from comment #16) > Pushed to master for 21.05, thanks to everybody involved! This also appears in 20.11, could it please be backported?
Pushed to 20.11.x for 20.11.05
(In reply to Fridolin Somers from comment #18) > Pushed to 20.11.x for 20.11.05 Thanks Frido!
Issues not present in 20.05, not backported. Please chime in if I'm wrong and this is needed.