This PR introduces an enhancement to the site's image-loading strategy
by implementing lazy loading as the default behavior for all images. The
motivation behind this change is to improve the site's load times.
**Changes:**
1. **Default Lazy Loading:** By `default`, all images will now have the
`loading="lazy"` attribute.
2. **Configurable Option in `_config.yml`:** Added a new configuration
option under `lazy_loading_images.enable`.
3. **Override Capability:** For `specific images` where the user doesn't
want lazy loading, they can `override` this by directly setting the
`loading attribute` in the `image tag`.
In this pull request, I've made adjustments to the image element's
handling of dimension properties. Previously, `min-width`, `min-height`,
`max-width`, and `max-height` were incorrectly placed as HTML attributes
on the `<img>` tag, which is not supported for these CSS properties.
This oversight could lead to issues with image responsiveness and layout
stability.
Changes:
- Moved `min-width`, `min-height`, `max-width`, and `max-height`
properties into the `style` attribute of the `<img>` tag. This change
ensures that these properties are correctly applied and recognized as
CSS properties, enhancing the responsiveness and flexibility of our
image displays.
- Retained `width` and `height` as attributes on the `<img>` tag to
maintain the intrinsic aspect ratio of images and help the browser
allocate space before images are fully loaded, improving the page load
experience.
These adjustments will ensure that our images are more responsive and
better adhere to the specified dimensions, improving the overall user
experience for the template.
summary:
- adds prettier formatter configuration
- formats the entire repo using prettier, ignoring minified files
(`*.min.css`) and heavy generated html
- changes extensions of all `.html` files to `.liquid`, which is more
correct and necessary for prettier to work correctly
- replaces "%-" and "-%" with just "%" — manual liquid formatting using
minus signs is superfluous since we are compressing and minifying the
code anyway
- adds CI action for running prettier check on PR and pushes to master