mirror of
https://github.com/GuerillaStudio/now-playing
synced 2024-12-20 20:21:55 +00:00
Simplify image over-optimization
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
All checks were successful
ci/woodpecker/push/woodpecker Pipeline was successful
This commit is contained in:
parent
af5e0d7d4d
commit
ecc2f9e2df
3 changed files with 13 additions and 20 deletions
|
@ -22,7 +22,7 @@ disableKinds = ["taxonomy"]
|
|||
suffixtext = "for providing an eco-responsible and distributed web hosting."
|
||||
|
||||
[imaging]
|
||||
quality = 95
|
||||
quality = 90
|
||||
[security]
|
||||
[security.funcs]
|
||||
getenv = [ "^HUGO_", "CONTEXT", "URL", "BASE_URL", "UMAMI_DOMAIN", "UMAMI_ID" ]
|
||||
|
|
|
@ -29,21 +29,14 @@
|
|||
<div class="album-layout">
|
||||
<picture class="album-cover">
|
||||
{{ $original := resources.Get .Params.cover }}
|
||||
{{ $coverSmall := $original.Resize "x250 webp" }}
|
||||
{{ $coverSmallBackup := $original.Resize "x250 jpeg q69" }}
|
||||
{{ $coverMedium := $original.Resize "x500 webp" }}
|
||||
{{ $coverMediumBackup := $original.Resize "x500 jpeg q69" }}
|
||||
{{ $coverBig := $original.Resize "x1000 webp" }}
|
||||
{{ $coverBigBackup := $original.Resize "x1000 jpeg q69" }}
|
||||
{{ $placeholder := $original.Resize "x15" }}
|
||||
<source srcset="{{ $coverSmall.Permalink }} 1x, {{ $coverMedium.Permalink }} 2x" media="(max-width: 427px)" type="image/webp">
|
||||
<source srcset="{{ $coverMedium.Permalink }} 1x, {{ $coverBig.Permalink }} 2x" media="(max-width: 480px)" type="image/webp">
|
||||
<source srcset="{{ $coverSmall.Permalink }} 1x, {{ $coverMedium.Permalink }} 2x" media="(max-width: 647px)" type="image/webp">
|
||||
<source srcset="{{ $coverMedium.Permalink }} 1x, {{ $coverBig.Permalink }} 2x" media="(min-width: 647px)" type="image/webp">
|
||||
<source srcset="{{ $coverSmallBackup.Permalink }} 1x, {{ $coverMediumBackup.Permalink }} 2x" media="(max-width: 427px)" type="image/jpeg">
|
||||
<source srcset="{{ $coverMediumBackup.Permalink }} 1x, {{ $coverBigBackup.Permalink }} 2x" media="(max-width: 480px)" type="image/jpeg">
|
||||
<source srcset="{{ $coverSmallBackup.Permalink }} 1x, {{ $coverMediumBackup.Permalink }} 2x" media="(max-width: 647px)" type="image/jpeg">
|
||||
<source srcset="{{ $coverMediumBackup.Permalink }} 1x, {{ $coverBigBackup.Permalink }} 2x" media="(min-width: 647px)" type="image/jpeg">
|
||||
{{ $coverSmall := $original.Resize "x250 jpeg" }}
|
||||
{{ $coverMedium := $original.Resize "x500 jpeg" }}
|
||||
{{ $coverBig := $original.Resize "x1000 jpeg" }}
|
||||
{{ $placeholder := $original.Resize "x5 jpeg" }}
|
||||
<source srcset="{{ $coverSmall.Permalink }} 1x, {{ $coverMedium.Permalink }} 2x" media="(max-width: 427px)" type="image/jpeg">
|
||||
<source srcset="{{ $coverMedium.Permalink }} 1x, {{ $coverBig.Permalink }} 2x" media="(max-width: 480px)" type="image/jpeg">
|
||||
<source srcset="{{ $coverSmall.Permalink }} 1x, {{ $coverMedium.Permalink }} 2x" media="(max-width: 647px)" type="image/jpeg">
|
||||
<source srcset="{{ $coverMedium.Permalink }} 1x, {{ $coverBig.Permalink }} 2x" media="(min-width: 647px)" type="image/jpeg">
|
||||
<img
|
||||
class="album-cover__visual"
|
||||
width="500"
|
||||
|
@ -52,7 +45,7 @@
|
|||
background-image: url(data:{{ $placeholder.MediaType }};base64,{{ $placeholder.Content | base64Encode }});
|
||||
view-transition-name: album_cover_{{ .File.BaseFileName }};
|
||||
"
|
||||
src="{{ $coverMediumBackup.Permalink }}"
|
||||
src="{{ $coverMedium.Permalink }}"
|
||||
loading="lazy"
|
||||
alt="{{ .Title }} album's cover"
|
||||
title=":)"
|
||||
|
|
|
@ -2,9 +2,9 @@
|
|||
<div class="grid grid-catalog">
|
||||
{{ range sort $pages.Pages "Date" "desc" }}
|
||||
{{ $original := resources.Get .Params.cover }}
|
||||
{{ $cover := $original.Resize "x320" }}
|
||||
{{ $cover2x := $original.Resize "x640" }}
|
||||
{{ $placeholder := $cover.Resize "x1" }}
|
||||
{{ $cover := $original.Resize "x320 jpeg" }}
|
||||
{{ $cover2x := $original.Resize "x640 jpeg" }}
|
||||
{{ $placeholder := $cover.Resize "x1 jpeg" }}
|
||||
<div class="catalog-item">
|
||||
<a class="catalog-item__content" href="{{ .Permalink }}">
|
||||
<h2 class="catalog-item__album">{{ .Title }}</h2>
|
||||
|
|
Loading…
Reference in a new issue