dnitza/adamantium
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Lazy loading of images

Browse Source
This commit is contained in:
Daniel Nitsikopoulos
2024-02-25 13:23:26 +11:00
parent 4917bc1aa1
commit 2a5bf8ee76
8 changed files with 13 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
slices/main/templates/posts/show.html.slim
View File

@@ -11,7 +11,7 @@ article class="h-entry"
svg class="fill-current text-white" xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 18 18"
path d="M14.53 4.53l-1.06-1.06L9 7.94 4.53 3.47 3.47 4.53 7.94 9l-4.47 4.47 1.06 1.06L9 10.06l4.47 4.47 1.06-1.06L10.06 9z">
div class="p-2 text-center w-full"
img class="rounded object-contain h-1/2-screen shadow-solid shadow-pink-100 dark:shadow-pink-200 mb-4 mx-auto" :src="imgModalSrc" :alt="imgModalSrc"
img loading="lazy" class="rounded object-contain h-1/2-screen shadow-solid shadow-pink-100 dark:shadow-pink-200 mb-4 mx-auto" :src="imgModalSrc" :alt="imgModalSrc"
p x-text="imgModalDesc" class="text-center text-white"
div class="mb-12 prose dark:prose-invert max-w-prose mx-auto text-gray-800 dark:text-gray-200"
h1 class="p-name mb-2"
@@ -31,7 +31,7 @@ article class="h-entry"
- if post.photos?
- post.photos.each_with_index do |photo, idx|
figure id="photo-#{idx}"
img class="u-photo shadow-solid shadow-pink-100 dark:shadow-pink-200 mb-4" src=photo["value"] alt=photo["alt"]
img loading="lazy" class="u-photo shadow-solid shadow-pink-100 dark:shadow-pink-200 mb-4" src=photo["value"] alt=photo["alt"]
figcaption
= photo["alt"]
- if post.videos?
@@ -44,14 +44,14 @@ article class="h-entry"
- if post.location
img class="shadow-solid shadow-pink-100 dark:shadow-pink-200 rounded mb-4" src=post.large_map
img loading="lazy" class="shadow-solid shadow-pink-100 dark:shadow-pink-200 rounded mb-4" src=post.large_map
-if post.webmentions && post.webmentions.count > 0
div class="mt-12"
h3 #{post.webmentions.count} Comment#{post.webmentions.count != 1 ? "s" : ""}
- post.webmentions.each do |mention|
div class="prose-p:m-1 mb-6 p-8 bg-orange-100 dark:bg-indigo-900 squircle"
div class="flex h-8"
img class="w-8 rounded-full m-0 mr-2" src=mention.author_photo
img loading="lazy" class="w-8 rounded-full m-0 mr-2" src=mention.author_photo
a class="block text-orange-700 dark:text-violet-300 no-underline hover:underline" href=mention.author_url
= mention.author_name
div class="prose dark:prose-invert dark:text-indigo-250 prose-a:text-orange-700 dark:prose-a:text-violet-300 prose-a:no-underline hover:prose-a:underline"
@@ -77,7 +77,7 @@ article class="h-entry"
- past_movies.map do |movie|
a href=movie.url
figure class="w-24"
img class="rounded hover:opacity-80" src=movie.poster
img loading="lazy" class="rounded hover:opacity-80" src=movie.poster
/ figcaption= movie.title
hr
- if text_posts.count > 0 || photo_posts.count > 0