GuerillaStudio/now-playing
GuerillaStudio/now-playing
1
0
Fork 0
mirror of https://github.com/GuerillaStudio/now-playing synced 2024-11-30 01:01:40 +00:00
Code Issues Activity Actions

Make cover's placeholder blur instead of flat color on single pages

Browse source
This commit is contained in:
Tixie 2023-05-12 03:34:19 +02:00
parent 5846cbb5eb
commit 6dd68e03f8
2 changed files with 3 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
assets/scss/6-pages/album.scss
View file

@ -40,6 +40,8 @@
width: 100%; width: 100%;
border-radius: .6rem; border-radius: .6rem;
background-color: rgba($color-primary, .5); background-color: rgba($color-primary, .5);
background-repeat: no-repeat;
background-size: cover;
box-shadow: 0 .6rem 4.4rem 0 rgba(0,0,0,.5); box-shadow: 0 .6rem 4.4rem 0 rgba(0,0,0,.5);
} }

2
layouts/_default/single.html
View file

@ -32,7 +32,7 @@
{{ $coverSmall := $original.Resize "x250 webp" }} {{ $coverSmall := $original.Resize "x250 webp" }}
{{ $coverMedium := $original.Resize "x500 webp" }} {{ $coverMedium := $original.Resize "x500 webp" }}
{{ $coverBig := $original.Resize "x1000 webp" }} {{ $coverBig := $original.Resize "x1000 webp" }}
{{ $placeholder := $original.Resize "x1" }} {{ $placeholder := $original.Resize "x15" }}
<source srcset="{{ $coverSmall.Permalink }} 1x, {{ $coverMedium.Permalink }} 2x" media="(max-width: 427px)"> <source srcset="{{ $coverSmall.Permalink }} 1x, {{ $coverMedium.Permalink }} 2x" media="(max-width: 427px)">
<source srcset="{{ $coverMedium.Permalink }} 1x, {{ $coverBig.Permalink }} 2x" media="(max-width: 480px)"> <source srcset="{{ $coverMedium.Permalink }} 1x, {{ $coverBig.Permalink }} 2x" media="(max-width: 480px)">
<source srcset="{{ $coverSmall.Permalink }} 1x, {{ $coverMedium.Permalink }} 2x" media="(max-width: 647px)"> <source srcset="{{ $coverSmall.Permalink }} 1x, {{ $coverMedium.Permalink }} 2x" media="(max-width: 647px)">