Bug 23956

Summary: Replace famfamfam calendar icon in staff client with CSS data-url
Product: Koha Reporter: Owen Leonard <oleonard>
Component: TemplatesAssignee: Owen Leonard <oleonard>
Status: CLOSED FIXED QA Contact: Testopia <testopia>
Severity: minor    
Priority: P5 - low CC: 1joynelson, hayleypelham, katrin.fischer, lucas, martin.renvoize
Version: MainKeywords: Academy
Hardware: All   
OS: All   
Change sponsored?: --- Patch complexity: Trivial patch
Documentation contact: Documentation submission:
Text to go in the release notes:
Version(s) released in:
20.05.00, 19.11.02
Bug Depends on:    
Bug Blocks: 24181    
Attachments: Bug 23956: Replace famfamfam calendar icon in staff client with CSS data-url
Bug 23956: Replace famfamfam calendar icon in staff client with CSS data-url

Description Owen Leonard 2019-11-03 22:29:31 UTC
The calendar icon we show with datepicker input fields can't be replaced by a Font Awesome icon because the image is displayed as a background image inside the input field itself.

A simplified version of the famfamfam calendar icon converted to a data-url is only about 200 characters. This seems compact enough to include in staff-global.css to eliminate an image dependency.
Comment 1 Owen Leonard 2019-11-03 22:38:18 UTC
Created attachment 94985 [details] [review]
Bug 23956: Replace famfamfam calendar icon in staff client with CSS data-url

This patch modifies the staff client CSS so that the backround image for
datepicker input fields is defined as a data-url rather than a reference
to an image file.

To test, apply the patch and regenerate the staff client CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client).

 - In the staff client, view any form which includes a datepicker-styled
   input. For instance, patron entry: date of birth, expiry; Aquisitions
   -> Late orders -> Filter results.
 - Confirm that the calendar icon looks correct.
Comment 2 Katrin Fischer 2019-11-03 23:07:56 UTC
Created attachment 94987 [details] [review]
Bug 23956: Replace famfamfam calendar icon in staff client with CSS data-url

This patch modifies the staff client CSS so that the backround image for
datepicker input fields is defined as a data-url rather than a reference
to an image file.

To test, apply the patch and regenerate the staff client CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client).

 - In the staff client, view any form which includes a datepicker-styled
   input. For instance, patron entry: date of birth, expiry; Aquisitions
   -> Late orders -> Filter results.
 - Confirm that the calendar icon looks correct.

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
Comment 3 Martin Renvoize 2020-01-03 15:48:41 UTC
Nice work everyone!

Pushed to master for 20.05
Comment 4 Joy Nelson 2020-01-14 00:21:32 UTC
Pushed to 19.11.x branch for 19.11.02
Comment 5 Lucas Gass 2020-01-15 21:29:04 UTC
backported to 19.05.x for 19.05.07
Comment 6 Hayley Pelham 2020-01-15 22:11:08 UTC
Enhancement will not be backported to 18.11.x series.