]> git.koha-community.org Git - koha.git/commit
Bug 34413: Fix style of Flatpickr in iOS mobile view
authorOwen Leonard <oleonard@myacpl.org>
Thu, 9 Nov 2023 13:21:06 +0000 (13:21 +0000)
committerPedro Amorim <pedro.amorim@ptfs-europe.com>
Tue, 14 Nov 2023 14:57:10 +0000 (13:57 -0100)
commit9c93df0b075822b163752d51ffc8926ffca2fe7f
tree07808f7fcb844973510f800629ae3894e9888562
parent1892c62edd081d8ffc072bfda1aa3f85a9e60b09
Bug 34413: Fix style of Flatpickr in iOS mobile view

This patch updates Flatpickr CSS in the OPAC and staff interface so that
date fields are displayed correctly in iOS mobile views.

To test, apply the patch and rebuild the OPAC and staff interface CSS.

- In the OPAC, click "Create new account"
- In the account entry form, confirm that the date of birth field looks
  correct and that the date-picker works as it should.
- In the staff client, go to Patrons -> New patron.
- Check the date of birth field in this form too.

This patch has been tested in the Xcode iOS device simulator with iOS
17. While I wasn't able to reproduce the problem in Firefox, I was able
to use the developer tools' responsive design mode to trigger the mobile
view and thus be able to see the styles which are being applied:

- In the OPAC, on the "Create new account" screen, open the Web
  Developer Tools panel (Tools -> Browser tools -> Web Developer Tools).
- Click the "Responsive Design Mode" button in the upper-right corner of
  the developer tools panel (it looks like a phone and tablet together).
- The main browser window will now how some settings at the top.
- In the first dropdown, choose an iPhone model.
- The date of birth field should now be styled differently because of
  the addition of a "flatpickr-mobile" style.
- Right-click the field and choose "Inspect." In the developer console
  you can see the styles which are being applied to the field. One of
  those should be ".flatpickr-input.flatpickr-mobile"

Signed-off-by: Lucas Gass <lucas@bywatersolutions.com>
Signed-off-by: Emily Lamancusa <emily.lamancusa@montgomerycountymd.gov>
Signed-off-by: Tomas Cohen Arazi <tomascohen@theke.io>
(cherry picked from commit 9e9fa64d5a9f8966c45a923b258c994df70ac35f)
Signed-off-by: Fridolin Somers <fridolin.somers@biblibre.com>
(cherry picked from commit 0b468bd4139b1d35e87e0ff44b6f5e48ca26641d)
Signed-off-by: Pedro Amorim <pedro.amorim@ptfs-europe.com>
koha-tmpl/intranet-tmpl/prog/css/src/_flatpickr.scss
koha-tmpl/opac-tmpl/bootstrap/css/src/_flatpickr.scss