Bug 26164

Summary:	Replace OPAC table sort icons with SVG
Product:	Koha	Reporter:	Owen Leonard <oleonard>
Component:	Templates	Assignee:	Owen Leonard <oleonard>
Status:	CLOSED FIXED	QA Contact:	Testopia <testopia>
Severity:	enhancement
Priority:	P5 - low	CC:	lucas, sally.healey, testopia
Version:	Main
Hardware:	All
OS:	All
See Also:	https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=26060
Change sponsored?:	---	Patch complexity:	Small patch
Documentation contact:		Documentation submission:
Text to go in the release notes:		Version(s) released in:	20.11.00
Circulation function:
Bug Depends on:	20168
Bug Blocks:
Attachments:	Bug 26164: Replace OPAC table sort icons with SVG Bug 26164: Replace OPAC table sort icons with SVG Bug 26164: Replace OPAC table sort icons with SVG

Description Owen Leonard 2020-08-06 15:49:19 UTC

Like Bug 26060: DataTables in the OPAC have sorting icons added to the headers via a background PNG image. I suggest we replace these with data-url SVG images which will look better, especially on higher-resolution screens or at higher zoom settings.

Comment 1 Owen Leonard 2020-09-09 13:59:48 UTC

Created attachment 109817 [details] [review]
Bug 26164: Replace OPAC table sort icons with SVG

This patch modifies the OAPC CSS to convert table sorting icons from PNG
to SVG. These icons are added via background-image data-urls, so only
the SCSS file is modified.

To test, apply the patch and rebuild the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_interface).

- Clear your browser cache if necessary
- View any DataTable in the OPAC, for instance the table of
  checkouts under the logged-in user's "your summary" tab.
- Confirm that the sorting icons in the table headers look
  correct in each state: Sorted ascending, sorted descending, and
  unsorted.

Comment 2 David Nind 2020-09-18 00:30:28 UTC

Created attachment 110309 [details] [review]
Bug 26164: Replace OPAC table sort icons with SVG

This patch modifies the OAPC CSS to convert table sorting icons from PNG
to SVG. These icons are added via background-image data-urls, so only
the SCSS file is modified.

To test, apply the patch and rebuild the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_interface).

- Clear your browser cache if necessary
- View any DataTable in the OPAC, for instance the table of
  checkouts under the logged-in user's "your summary" tab.
- Confirm that the sorting icons in the table headers look
  correct in each state: Sorted ascending, sorted descending, and
  unsorted.

Signed-off-by: David Nind <david@davidnind.com>

Comment 3 Katrin Fischer 2020-09-20 17:31:26 UTC

Created attachment 110428 [details] [review]
Bug 26164: Replace OPAC table sort icons with SVG

This patch modifies the OAPC CSS to convert table sorting icons from PNG
to SVG. These icons are added via background-image data-urls, so only
the SCSS file is modified.

To test, apply the patch and rebuild the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_interface).

- Clear your browser cache if necessary
- View any DataTable in the OPAC, for instance the table of
  checkouts under the logged-in user's "your summary" tab.
- Confirm that the sorting icons in the table headers look
  correct in each state: Sorted ascending, sorted descending, and
  unsorted.

Signed-off-by: David Nind <david@davidnind.com>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>

Comment 4 Jonathan Druart 2020-09-29 12:30:18 UTC

Pushed to master for 20.11, thanks to everybody involved!

Comment 5 Lucas Gass (lukeg) 2020-10-20 17:06:32 UTC

enhancement will not be backported to 20.05.x