From 352637b390250d876b924d6f61b84aab341a50ff Mon Sep 17 00:00:00 2001
From: Oliver Davies <oliver@oliverdavies.uk>
Date: Thu, 3 Dec 2020 02:19:08 +0000
Subject: [PATCH] Enable lazy loading for recommendation images

---
 config/core.extension.yml                     |  1 +
 .../opdavies_recommendations.info.yml         |  5 +++++
 .../opdavies_recommendations.module           | 22 +++++++++++++++++++
 web/themes/custom/opdavies/tailwind.config.js |  1 +
 4 files changed, 29 insertions(+)
 create mode 100644 web/modules/custom/recommendations/opdavies_recommendations.info.yml
 create mode 100644 web/modules/custom/recommendations/opdavies_recommendations.module

diff --git a/config/core.extension.yml b/config/core.extension.yml
index 32fbb4c..186f151 100644
--- a/config/core.extension.yml
+++ b/config/core.extension.yml
@@ -41,6 +41,7 @@ module:
   migrate_tools: 0
   node: 0
   opdavies_blog: 0
+  opdavies_recommendations: 0
   opdavies_talks: 0
   options: 0
   page_cache: 0
diff --git a/web/modules/custom/recommendations/opdavies_recommendations.info.yml b/web/modules/custom/recommendations/opdavies_recommendations.info.yml
new file mode 100644
index 0000000..170b5ae
--- /dev/null
+++ b/web/modules/custom/recommendations/opdavies_recommendations.info.yml
@@ -0,0 +1,5 @@
+name: Oliver Davies Recommendations
+description: Custom code for recommendations.
+type: module
+core_version_requirement: ^8 || ^9
+package: Oliver Davies
diff --git a/web/modules/custom/recommendations/opdavies_recommendations.module b/web/modules/custom/recommendations/opdavies_recommendations.module
new file mode 100644
index 0000000..1a72167
--- /dev/null
+++ b/web/modules/custom/recommendations/opdavies_recommendations.module
@@ -0,0 +1,22 @@
+<?php
+
+/**
+ * @file
+ * Oliver Davies Recommendations module.
+ */
+
+declare(strict_types=1);
+
+/**
+ * Implements hook_preprocess_image_style().
+ */
+function opdavies_recommendations_preprocess_image_style(array &$variables): void {
+  if ($variables['style_name'] == 'recommendation') {
+    $image = &$variables['image'];
+
+    $image['#attributes']['class'][] = 'bg-gray-200';
+    $image['#attributes']['height'] = 100;
+    $image['#attributes']['loading'] = 'lazy';
+    $image['#attributes']['width'] = 100;
+  }
+}
diff --git a/web/themes/custom/opdavies/tailwind.config.js b/web/themes/custom/opdavies/tailwind.config.js
index dc4176f..3e8030f 100644
--- a/web/themes/custom/opdavies/tailwind.config.js
+++ b/web/themes/custom/opdavies/tailwind.config.js
@@ -18,6 +18,7 @@ module.exports = {
       // Include any classes stored within body fields.
       'body-field-values.txt'
     ],
+    whitelist: ['bg-gray-200']
   },
   theme: {
     typography: (theme) => ({