Enhancements for Better Accessibility and Code Refactoring ⚙

[sanjaiyan-dev]

This PR introduces minor improvements, such as:

1. Adding the type="search" attribute to the input tag for better accessibility.
2. Adding decoding properties in the img tag.
3. Refactoring the code by adding event modifiers directly using '|'.

Extremely sorry if I made any mistakes :(

[sanjaiyan-dev]

🧐🫠

[bglw]

Sorry to leave you hanging! Had to deal with some tasks that were put aside while working on the 1.0 release. Coming back around to new PRs and issues in this repo soon.

[bglw]

Hi @sanjaiyan-dev — on Chrome (and others?) an input with type="search" shows a clear button in the input. Since the Pagefind UIs have their own implementations of this, it would be good to hide the browser default.

Let me know if this is a change you're keen to make or if you'd rather I tackle it 🙂 Everything else looks good!

[sanjaiyan-dev]

Hi @sanjaiyan-dev — on Chrome (and others?) an input with type="search" shows a clear button in the input. Since the Pagefind UIs have their own implementations of this, it would be good to hide the browser default.

Let me know if this is a change you're keen to make or if you'd rather I tackle it 🙂 Everything else looks good!

@bglw If you believe that adding the 'type=search' attribute may not be necessary, I would like to suggest considering the use of the 'inputmode' attribute as an alternative. You can find more information about it on the Mozilla Developer Network here: https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/inputmode

[bglw]

I think the type search is good — we just need to normalize the styling. At a glance, https://stackoverflow.com/a/77190241 seems good, but will need to test it across browsers to make sure

[sanjaiyan-dev]

I think the type search is good — we just need to normalize the styling. At a glance, https://stackoverflow.com/a/77190241 seems good, but will need to test it across browsers to make sure

🤝