Created attachment 144221 [details] [review] The bibliographic display of a record in the opac on a mobile is not correct Items table columns are too thin This patch fix this problem by making the table responsive To test: 1- Go to the OPAC 2- Open mobile mode 3- Go to a bibliographic record detail page in the OPAC (opac-detail.pl?biblionumber=X) 4- Check the Holdings table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> we see very narrow columns --> unreadable text 5- Apply the patch and perform previous step (1-4). 6- Confirm that the table are displayed correctly and responsive Hey Hammat, Good to see these mobile bugs being addressed! A couple things: -Since you are changing a OPAC scss your test plan should probably mention that running 'yarn build --view opac' is required to see the changes. -The QA tool wants your commit title to be formatted like "Bug XXXXX:" * Commit title does not start with 'Bug XXXXX: ' - fbed8f082a1 Created attachment 144546 [details] [review] Bug 32341: Some OPAC tables are not displayed well in mobile mode Some OPAC tables are not displayed well in mobile mode, it is absolutely necessary to scroll to the right to read the content properly This patch fix this problem by making the tables responsive To test: 1- Go to the OPAC 2- Open mobile mode 3- Go to a bibliographic record detail page in the OPAC (opac-detail.pl?biblionumber=X) 4- Check the Holdings table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> we see very narrow columns --> unreadable text 5- Go to to the page 'Summary' (opac-user.pl) 6- Check the 'Checked out' table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 7- Check the 'Overdue' table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 8- Go to the page 'Charges' (opac-account.pl) 9- Click on 'Show all transactions' --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 10- Go to the page 'Search history' (opac-search-history.pl) --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 11- Apply the patch 12- Execute 'yarn build --view opac' 13- Clean your cache or open your navigator on private mode (to load updated css files) 14- Perform previous step (1-10) 15- Confirm that the tables are now displayed correctly and is now responsive. Created attachment 144768 [details] [review] Bug 32341: Some OPAC tables are not displayed well in mobile mode Some OPAC tables are not displayed well in mobile mode, it is absolutely necessary to scroll to the right to read the content properly This patch fix this problem by making the tables responsive To test: 1- Go to the OPAC 2- Open mobile mode 3- Go to a bibliographic record detail page in the OPAC (opac-detail.pl?biblionumber=X) 4- Check the Holdings table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> we see very narrow columns --> unreadable text 5- Go to to the page 'Summary' (opac-user.pl) 6- Check the 'Checked out' table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 7- Check the 'Overdue' table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 8- Go to the page 'Charges' (opac-account.pl) 9- Click on 'Show all transactions' --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 10- Go to the page 'Search history' (opac-search-history.pl) --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 11- Apply the patch 12- Execute 'yarn build --view opac' 13- Clean your cache or open your navigator on private mode (to load updated css files) 14- Perform previous step (1-10) 15- Confirm that the tables are now displayed correctly and is now responsive. Signed-off-by: LMSCloudPaulD <paul.derscheid@lmscloud.de> Works as advertised. However, imho the svgs and the button placement could still be improved. For reference look at this discussion on irc @Hammat: http://irc.koha-community.org/koha/2022-12-21$=#id_l75 I would like to see some more iteration of this... I think the last column in the table makes more sense for the placement of the button. Having it's own column (using "details: {type: 'column'}" ) would help prevent it from being too small a target for someone to tap.
The button isn't very clear to me in terms of what it's for... I'm not sure at the moment what to suggest, though.
Is it necessary to add jquery.dataTables.min.css globally? I think our CSS includes the styles we need.
Created attachment 144808 [details] [review] Bug 32341: (Fix) Changing the placement of the button This attachment correct the placement of the responsive button. It is now in its own column at the last column and the '+' and '-' are remplaced by 'Expand' and 'Unexpand' to make it more clear. Created attachment 145159 [details] [review] Bug 32341: (follow-up) Alternate button style This patch applies a different button style and does a couple of clean up tasks: Removing the redundant sorting-related CSS and moving the responsive button CSS to _common.scss where other DataTable-related styles are found. I think this different button style is more consistent with the OPAC's design. It also eliminates untranslatable strings from the CSS. I think my patch makes some improvements but I think the user charges page (opac-account.tt) needs some attention. It doesn't look like the table is behaving correctly. I prefer Owen's buttons because they don't need translation ;) I was coming to say that I couldn't find the Expand/Unexpand strings in the po files after updating them, but this is better! Going through the patron account pages with the "Galaxy fold" setting in Chrome, which is the narrowest I found, there are some tables that are missing the expand option. - Summary - Checkouts: OK - Summary - Relatives' checkouts: OK - Summary - Overdue: OK - Summary - Clubs: Large table not collapsed - Summary - Charges: Narrow table OK - Summary - Relatives' charges: Narrow table OK - Summary - Holds: OK - Summary - Recalls: Large table not collapsed - Summary - Article requests: Large table not collapsed - Charges - (patron's own): OK (should we show another column rather than the date? Maybe a matter for another bug) - Charges - (relative's): Large table not collapsed - Tags: Narrow table OK - Search history - Catalog: OK (Should we show another column rather than the date? Maybe a matter for another bug) - Search history - Authority: Large table not collapsed - Checkout history - All: Large table not collapsed - Checkout history - Checkouts: Large table not collapsed - Checkout history - On-site: Large table not collapsed - Recalls history: Large table not collapsed - Purchase suggestions: OK (list view not table) - Messaging: Large table not collapsed - Lists: OK (list view not table) - ILL requests: To check, I have never been able to set up ILL on my installation - Curbside pickups: OK Other pages that have tables (not sure I found all of them) - Holdings: OK - Subscription (serial): Large table not collapsed - Course reserves - Courses: Large table not collapsed - Course reserves - Reserves: Large table not collapsed - Authority search results: Large table not collapsed Should we open another bug for these non-patron-account pages? Created attachment 146294 [details] [review] Bug 32341: (follow-up) Making the remains OPAC tables responsive Apply the patch and check for the responsivity of the following tables 1- Go to the OPAC 2- Open mobile mode 3- The following tables are not responsive - Summary - Clubs - Summary - Recalls - Summary - Article requests - Charges - (relative's) - Search history - Authority - Checkout history - All - Checkout history - Checkouts - Checkout history - On-site - Recalls history - Messaging - Subscription (serial) - Course reserves - Courses - Course reserves - Reserves - Authority search results 4- Apply the patch 5- Execute 'yarn build --view opac' 6- Clean your cache or open your navigator on private mode (to load updated css files) 7- Perform previous step (1-3) 8- Confirm that the tables are now displayed correctly and is now responsive. Created attachment 146746 [details] [review] Bug 32341: (follow-up) Add responsivity to Curbside pickups table and changing button style for finestables To activate Curbside pickups 1- Enable the CurbsidePickup system preference 1.1 Go to Administration > Global system preferences 1.2 Search for CurbsidePickup 1.3 Change the value for 'Enable' 1.4 Click on 'Save all circulation preferences' 2- Configure time slots for at least one library 2.1 Go to Administration > Curbside pickup 2.2 Fill out the form for Centerville (or another library) Enable: Check Pickup interval: 10 (or other) Maximum boss per interval: 3 (or other) Patron-scheduled pickup: Check Enable for waiting holds only: DO NOT check 2.3 Add a time slot In 'New slot', enter Monday From: 10:00 To: 12:00 Click on 'Add' 3- Make an appointment from the OPAC 3.1 Go to OPAC 3.2 Open mobile mode 3.3 Connect with a user 3.4 Click on 'Curbside pickups' 3.5 Choose the library in 'Pick a library' 3.6 Choose a date in 'Pickup date' 3.7 Choose a time range in 'Select a time' 3.8 Click on 'Schedule pickup' => Notice The table is not responsive 4- Apply the patch 5- Execute 'yarn build --view opac' 6- Clean your cache or open your navigator on private mode (to load updated css files) 7- Perform step 3.1, 3.2, 3.3, 3.4, 8- click on 'Your pickups' => Confirm that the CurbsidePickup table are now displayed correctly and is now responsive. 9- Click on 'Charges' => Confirm that the Charges table are now displayed correctly and is now responsive. Created attachment 146747 [details] [review] Bug 32341: (follow-up) Add responsivity to Curbside pickups table and changing button style for finestables To activate Curbside pickups 1- Enable the CurbsidePickup system preference 1.1 Go to Administration > Global system preferences 1.2 Search for CurbsidePickup 1.3 Change the value for 'Enable' 1.4 Click on 'Save all circulation preferences' 2- Configure time slots for at least one library 2.1 Go to Administration > Curbside pickup 2.2 Fill out the form for Centerville (or another library) Enable: Check Pickup interval: 10 (or other) Maximum boss per interval: 3 (or other) Patron-scheduled pickup: Check Enable for waiting holds only: DO NOT check 2.3 Add a time slot In 'New slot', enter Monday From: 10:00 To: 12:00 Click on 'Add' 3- Make an appointment from the OPAC 3.1 Go to OPAC 3.2 Open mobile mode 3.3 Connect with a user 3.4 Click on 'Curbside pickups' 3.5 Choose the library in 'Pick a library' 3.6 Choose a date in 'Pickup date' 3.7 Choose a time range in 'Select a time' 3.8 Click on 'Schedule pickup' => Notice The table is not responsive 4- Apply the patch 5- Execute 'yarn build --view opac' 6- Clean your cache or open your navigator on private mode (to load updated css files) 7- Perform step 3.1, 3.2, 3.3, 3.4, 8- click on 'Your pickups' => Confirm that the CurbsidePickup table are now displayed correctly and is now responsive. 9- Click on 'Charges' => Confirm that the Charges table are now displayed correctly and is now responsive. Created attachment 149986 [details] [review] Bug 32341: (follow-up) Add responsivity to Curbside pickups table and changing button style for finestables To activate Curbside pickups 1- Enable the CurbsidePickup system preference 1.1 Go to Administration > Global system preferences 1.2 Search for CurbsidePickup 1.3 Change the value for 'Enable' 1.4 Click on 'Save all circulation preferences' 2- Configure time slots for at least one library 2.1 Go to Administration > Curbside pickup 2.2 Fill out the form for Centerville (or another library) Enable: Check Pickup interval: 10 (or other) Maximum boss per interval: 3 (or other) Patron-scheduled pickup: Check Enable for waiting holds only: DO NOT check 2.3 Add a time slot In 'New slot', enter Monday From: 10:00 To: 12:00 Click on 'Add' 3- Make an appointment from the OPAC 3.1 Go to OPAC 3.2 Open mobile mode 3.3 Connect with a user 3.4 Click on 'Curbside pickups' 3.5 Choose the library in 'Pick a library' 3.6 Choose a date in 'Pickup date' 3.7 Choose a time range in 'Select a time' 3.8 Click on 'Schedule pickup' => Notice The table is not responsive 4- Apply the patch 5- Execute 'yarn build --view opac' 6- Clean your cache or open your navigator on private mode (to load updated css files) 7- Perform step 3.1, 3.2, 3.3, 3.4, 8- click on 'Your pickups' => Confirm that the CurbsidePickup table are now displayed correctly and is now responsive. 9- Click on 'Charges' => Confirm that the Charges table are now displayed correctly and is now responsive. I correct a little bug. The "suspend_hold" button did not work anymore. This change resets it to it's original state. Created attachment 150321 [details] [review] Bug 32341: (follow-up) Making the label not showed twice when the tables are in responsive mode Upgrading the severity of this one, since this really should be fixed ASAP. -- That said, I'm looking at 21.11, and the holdings on the OPAC detail page looks bad too (although in a totally different way). root@kohadevbox:koha(bug_32341)$ yarn build --view opac yarn run v1.22.19 $ yarn css:build && yarn js:build --view opac $ gulp css && gulp css --view opac [00:48:48] Using gulpfile /kohadevbox/koha/gulpfile.js [00:48:48] Starting 'css'... [00:48:48] Finished 'css' after 12 ms [00:48:51] Using gulpfile /kohadevbox/koha/gulpfile.js [00:48:51] Starting 'css'... [00:48:51] Finished 'css' after 13 ms $ webpack --mode development --view opac [webpack-cli] Error: Unknown option '--view' [webpack-cli] Run 'webpack --help' to see available commands and options error Command failed with exit code 2. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command. error Command failed with exit code 2. info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command. Of course, since we .gitignore built files, it's tough to say if anything changed. But it looks like the timestamp on koha-tmpl/opac-tmpl/bootstrap/css/opac.css is different, so we'll assume it worked despite the webpack error. Created attachment 150707 [details] [review] Bug 32341: Some OPAC tables are not displayed well in mobile mode Some OPAC tables are not displayed well in mobile mode, it is absolutely necessary to scroll to the right to read the content properly This patch fix this problem by making the tables responsive To test: 1- Go to the OPAC 2- Open mobile mode 3- Go to a bibliographic record detail page in the OPAC (opac-detail.pl?biblionumber=X) 4- Check the Holdings table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> we see very narrow columns --> unreadable text 5- Go to to the page 'Summary' (opac-user.pl) 6- Check the 'Checked out' table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 7- Check the 'Overdue' table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 8- Go to the page 'Charges' (opac-account.pl) 9- Click on 'Show all transactions' --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 10- Go to the page 'Search history' (opac-search-history.pl) --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 11- Apply the patch 12- Execute 'yarn build --view opac' 13- Clean your cache or open your navigator on private mode (to load updated css files) 14- Perform previous step (1-10) 15- Confirm that the tables are now displayed correctly and is now responsive. Signed-off-by: pauld <pauld@pop-os.localdomain> Signed-off-by: LMSCloudPaulD <paul.derscheid@lmscloud.de> Signed-off-by: David Cook <dcook@prosentient.com.au> Created attachment 150708 [details] [review] Bug 32341: (Fix) Changing the placement of the button This attachment correct the placement of the responsive button. It is now in its own column at the last column and the '+' and '-' are remplaced by 'Expand' and 'Unexpand' to make it more clear. Signed-off-by: David Cook <dcook@prosentient.com.au> Created attachment 150709 [details] [review] Bug 32341: (follow-up) Alternate button style This patch applies a different button style and does a couple of clean up tasks: Removing the redundant sorting-related CSS and moving the responsive button CSS to _common.scss where other DataTable-related styles are found. I think this different button style is more consistent with the OPAC's design. It also eliminates untranslatable strings from the CSS. Signed-off-by: David Cook <dcook@prosentient.com.au> Created attachment 150710 [details] [review] Bug 32341: (follow-up) Making the remains OPAC tables responsive Apply the patch and check for the responsivity of the following tables 1- Go to the OPAC 2- Open mobile mode 3- The following tables are not responsive - Summary - Clubs - Summary - Recalls - Summary - Article requests - Charges - (relative's) - Search history - Authority - Checkout history - All - Checkout history - Checkouts - Checkout history - On-site - Recalls history - Messaging - Subscription (serial) - Course reserves - Courses - Course reserves - Reserves - Authority search results 4- Apply the patch 5- Execute 'yarn build --view opac' 6- Clean your cache or open your navigator on private mode (to load updated css files) 7- Perform previous step (1-3) 8- Confirm that the tables are now displayed correctly and is now responsive. Signed-off-by: David Cook <dcook@prosentient.com.au> Created attachment 150711 [details] [review] Bug 32341: (follow-up) Add responsivity to Curbside pickups table and changing button style for finestables To activate Curbside pickups 1- Enable the CurbsidePickup system preference 1.1 Go to Administration > Global system preferences 1.2 Search for CurbsidePickup 1.3 Change the value for 'Enable' 1.4 Click on 'Save all circulation preferences' 2- Configure time slots for at least one library 2.1 Go to Administration > Curbside pickup 2.2 Fill out the form for Centerville (or another library) Enable: Check Pickup interval: 10 (or other) Maximum boss per interval: 3 (or other) Patron-scheduled pickup: Check Enable for waiting holds only: DO NOT check 2.3 Add a time slot In 'New slot', enter Monday From: 10:00 To: 12:00 Click on 'Add' 3- Make an appointment from the OPAC 3.1 Go to OPAC 3.2 Open mobile mode 3.3 Connect with a user 3.4 Click on 'Curbside pickups' 3.5 Choose the library in 'Pick a library' 3.6 Choose a date in 'Pickup date' 3.7 Choose a time range in 'Select a time' 3.8 Click on 'Schedule pickup' => Notice The table is not responsive 4- Apply the patch 5- Execute 'yarn build --view opac' 6- Clean your cache or open your navigator on private mode (to load updated css files) 7- Perform step 3.1, 3.2, 3.3, 3.4, 8- click on 'Your pickups' => Confirm that the CurbsidePickup table are now displayed correctly and is now responsive. 9- Click on 'Charges' => Confirm that the Charges table are now displayed correctly and is now responsive. I correct a little bug. The "suspend_hold" button did not work anymore. This change resets it to it's original state. Signed-off-by: David Cook <dcook@prosentient.com.au> Created attachment 150712 [details] [review] Bug 32341: (follow-up) Making the label not showed twice when the tables are in responsive mode Signed-off-by: David Cook <dcook@prosentient.com.au> Oh looks like I can't QA this one, but it's a very useful one... would be great to get this done. sha1 issues on apply I'm afraid. (In reply to Martin Renvoize from comment #27) > sha1 issues on apply I'm afraid. Hmm weird. I've rebased, so I'll upload again. Created attachment 152023 [details] [review] Bug 32341: Some OPAC tables are not displayed well in mobile mode Some OPAC tables are not displayed well in mobile mode, it is absolutely necessary to scroll to the right to read the content properly This patch fix this problem by making the tables responsive To test: 1- Go to the OPAC 2- Open mobile mode 3- Go to a bibliographic record detail page in the OPAC (opac-detail.pl?biblionumber=X) 4- Check the Holdings table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> we see very narrow columns --> unreadable text 5- Go to to the page 'Summary' (opac-user.pl) 6- Check the 'Checked out' table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 7- Check the 'Overdue' table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 8- Go to the page 'Charges' (opac-account.pl) 9- Click on 'Show all transactions' --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 10- Go to the page 'Search history' (opac-search-history.pl) --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 11- Apply the patch 12- Execute 'yarn build --view opac' 13- Clean your cache or open your navigator on private mode (to load updated css files) 14- Perform previous step (1-10) 15- Confirm that the tables are now displayed correctly and is now responsive. Signed-off-by: pauld <pauld@pop-os.localdomain> Signed-off-by: LMSCloudPaulD <paul.derscheid@lmscloud.de> Signed-off-by: David Cook <dcook@prosentient.com.au> Created attachment 152024 [details] [review] Bug 32341: (Fix) Changing the placement of the button This attachment correct the placement of the responsive button. It is now in its own column at the last column and the '+' and '-' are remplaced by 'Expand' and 'Unexpand' to make it more clear. Signed-off-by: David Cook <dcook@prosentient.com.au> Created attachment 152025 [details] [review] Bug 32341: (follow-up) Alternate button style This patch applies a different button style and does a couple of clean up tasks: Removing the redundant sorting-related CSS and moving the responsive button CSS to _common.scss where other DataTable-related styles are found. I think this different button style is more consistent with the OPAC's design. It also eliminates untranslatable strings from the CSS. Signed-off-by: David Cook <dcook@prosentient.com.au> Created attachment 152026 [details] [review] Bug 32341: (follow-up) Making the remains OPAC tables responsive Apply the patch and check for the responsivity of the following tables 1- Go to the OPAC 2- Open mobile mode 3- The following tables are not responsive - Summary - Clubs - Summary - Recalls - Summary - Article requests - Charges - (relative's) - Search history - Authority - Checkout history - All - Checkout history - Checkouts - Checkout history - On-site - Recalls history - Messaging - Subscription (serial) - Course reserves - Courses - Course reserves - Reserves - Authority search results 4- Apply the patch 5- Execute 'yarn build --view opac' 6- Clean your cache or open your navigator on private mode (to load updated css files) 7- Perform previous step (1-3) 8- Confirm that the tables are now displayed correctly and is now responsive. Signed-off-by: David Cook <dcook@prosentient.com.au> Created attachment 152027 [details] [review] Bug 32341: (follow-up) Add responsivity to Curbside pickups table and changing button style for finestables To activate Curbside pickups 1- Enable the CurbsidePickup system preference 1.1 Go to Administration > Global system preferences 1.2 Search for CurbsidePickup 1.3 Change the value for 'Enable' 1.4 Click on 'Save all circulation preferences' 2- Configure time slots for at least one library 2.1 Go to Administration > Curbside pickup 2.2 Fill out the form for Centerville (or another library) Enable: Check Pickup interval: 10 (or other) Maximum boss per interval: 3 (or other) Patron-scheduled pickup: Check Enable for waiting holds only: DO NOT check 2.3 Add a time slot In 'New slot', enter Monday From: 10:00 To: 12:00 Click on 'Add' 3- Make an appointment from the OPAC 3.1 Go to OPAC 3.2 Open mobile mode 3.3 Connect with a user 3.4 Click on 'Curbside pickups' 3.5 Choose the library in 'Pick a library' 3.6 Choose a date in 'Pickup date' 3.7 Choose a time range in 'Select a time' 3.8 Click on 'Schedule pickup' => Notice The table is not responsive 4- Apply the patch 5- Execute 'yarn build --view opac' 6- Clean your cache or open your navigator on private mode (to load updated css files) 7- Perform step 3.1, 3.2, 3.3, 3.4, 8- click on 'Your pickups' => Confirm that the CurbsidePickup table are now displayed correctly and is now responsive. 9- Click on 'Charges' => Confirm that the Charges table are now displayed correctly and is now responsive. I correct a little bug. The "suspend_hold" button did not work anymore. This change resets it to it's original state. Signed-off-by: David Cook <dcook@prosentient.com.au> Created attachment 152028 [details] [review] Bug 32341: (follow-up) Making the label not showed twice when the tables are in responsive mode Signed-off-by: David Cook <dcook@prosentient.com.au> The Marc Details view was missed.. but that page is already out of sync so I'm not too worried (I'd like to see the Marc and ISBD views converted to modals that display just the record as opposed to whole pages that try to replicate most of the features of the main detail display) Works well in all testing, QA scripts are happy. I'm generally happy to call this PQA, great work! Created attachment 152164 [details] [review] Bug 32341: Some OPAC tables are not displayed well in mobile mode Some OPAC tables are not displayed well in mobile mode, it is absolutely necessary to scroll to the right to read the content properly This patch fix this problem by making the tables responsive To test: 1- Go to the OPAC 2- Open mobile mode 3- Go to a bibliographic record detail page in the OPAC (opac-detail.pl?biblionumber=X) 4- Check the Holdings table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> we see very narrow columns --> unreadable text 5- Go to to the page 'Summary' (opac-user.pl) 6- Check the 'Checked out' table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 7- Check the 'Overdue' table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 8- Go to the page 'Charges' (opac-account.pl) 9- Click on 'Show all transactions' --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 10- Go to the page 'Search history' (opac-search-history.pl) --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> The columns are overflowing to the right 11- Apply the patch 12- Execute 'yarn build --view opac' 13- Clean your cache or open your navigator on private mode (to load updated css files) 14- Perform previous step (1-10) 15- Confirm that the tables are now displayed correctly and is now responsive. Signed-off-by: Paul Derscheid <paul.derscheid@lmscloud.de> Signed-off-by: David Cook <dcook@prosentient.com.au> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Created attachment 152165 [details] [review] Bug 32341: (Fix) Changing the placement of the button This attachment correct the placement of the responsive button. It is now in its own column at the last column and the '+' and '-' are remplaced by 'Expand' and 'Unexpand' to make it more clear. Signed-off-by: David Cook <dcook@prosentient.com.au> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Created attachment 152166 [details] [review] Bug 32341: (follow-up) Alternate button style This patch applies a different button style and does a couple of clean up tasks: Removing the redundant sorting-related CSS and moving the responsive button CSS to _common.scss where other DataTable-related styles are found. I think this different button style is more consistent with the OPAC's design. It also eliminates untranslatable strings from the CSS. Signed-off-by: David Cook <dcook@prosentient.com.au> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Created attachment 152167 [details] [review] Bug 32341: (follow-up) Making the remains OPAC tables responsive Apply the patch and check for the responsivity of the following tables 1- Go to the OPAC 2- Open mobile mode 3- The following tables are not responsive - Summary - Clubs - Summary - Recalls - Summary - Article requests - Charges - (relative's) - Search history - Authority - Checkout history - All - Checkout history - Checkouts - Checkout history - On-site - Recalls history - Messaging - Subscription (serial) - Course reserves - Courses - Course reserves - Reserves - Authority search results 4- Apply the patch 5- Execute 'yarn build --view opac' 6- Clean your cache or open your navigator on private mode (to load updated css files) 7- Perform previous step (1-3) 8- Confirm that the tables are now displayed correctly and is now responsive. Signed-off-by: David Cook <dcook@prosentient.com.au> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Created attachment 152168 [details] [review] Bug 32341: (follow-up) Add responsivity to Curbside pickups table and changing button style for finestables To activate Curbside pickups 1- Enable the CurbsidePickup system preference 1.1 Go to Administration > Global system preferences 1.2 Search for CurbsidePickup 1.3 Change the value for 'Enable' 1.4 Click on 'Save all circulation preferences' 2- Configure time slots for at least one library 2.1 Go to Administration > Curbside pickup 2.2 Fill out the form for Centerville (or another library) Enable: Check Pickup interval: 10 (or other) Maximum boss per interval: 3 (or other) Patron-scheduled pickup: Check Enable for waiting holds only: DO NOT check 2.3 Add a time slot In 'New slot', enter Monday From: 10:00 To: 12:00 Click on 'Add' 3- Make an appointment from the OPAC 3.1 Go to OPAC 3.2 Open mobile mode 3.3 Connect with a user 3.4 Click on 'Curbside pickups' 3.5 Choose the library in 'Pick a library' 3.6 Choose a date in 'Pickup date' 3.7 Choose a time range in 'Select a time' 3.8 Click on 'Schedule pickup' => Notice The table is not responsive 4- Apply the patch 5- Execute 'yarn build --view opac' 6- Clean your cache or open your navigator on private mode (to load updated css files) 7- Perform step 3.1, 3.2, 3.3, 3.4, 8- click on 'Your pickups' => Confirm that the CurbsidePickup table are now displayed correctly and is now responsive. 9- Click on 'Charges' => Confirm that the Charges table are now displayed correctly and is now responsive. I correct a little bug. The "suspend_hold" button did not work anymore. This change resets it to it's original state. Signed-off-by: David Cook <dcook@prosentient.com.au> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Created attachment 152169 [details] [review] Bug 32341: (follow-up) Making the label not showed twice when the tables are in responsive mode Signed-off-by: David Cook <dcook@prosentient.com.au> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> Pushed to master for 23.11. Nice work everyone, thanks! Thanks for all the hard work! Pushed to 23.05.x for the next release Nice work everyone! Pushed to oldstable for 22.11.x |
The bibliographic display of a record in the OPAC on mobile is not correct This patch fix this problem by making the table responsive To test: 1- Go to the OPAC 2- Open mobile mode 3- Go to a bibliographic record detail page in the OPAC (opac-detail.pl?biblionumber=X) 4- Check the Holdings table --> the information is not presented in a table as it is when viewing on a laptop or PC browser screen. --> we see very narrow columns --> unreadable text 5- Apply the patch and perform previous step (1-4). 6- Confirm that the table are displayed correctly and is now responsive