From: Paul Hänsch Date: Wed, 24 Mar 2021 15:50:43 +0000 (+0100) Subject: yet improved display of different aspect ratios, prefer to cut away sides rather... X-Git-Url: https://git.plutz.net/?a=commitdiff_plain;h=ae2ad4a2b31ef898a1332009750c140c109b595d;p=serve0 yet improved display of different aspect ratios, prefer to cut away sides rather than top/bottom --- diff --git a/style.css b/style.css index 168ff40..930c987 100644 --- a/style.css +++ b/style.css @@ -59,11 +59,12 @@ body { } .itemlist .list img { - width: 1000%; height: 11em; + -width: 1000%; height: 11em; max-width: unset; background-color: #111; - object-fit: fill; - transform: translate(-00%, 0); + object-fit: cover; + transform: translate(-05%, 0); + margin-left: 50%; } .itemlist .list img:hover { animation-name: thumbscroll; @@ -71,26 +72,26 @@ body { animation-iteration-count: infinite; } @keyframes thumbscroll { - 0% { transform: translate(-00%, 0); } - 9.99% { transform: translate(-00%, 0); } - 10% { transform: translate(-10%, 0); } - 19.99% { transform: translate(-10%, 0); } - 20% { transform: translate(-20%, 0); } - 29.99% { transform: translate(-20%, 0); } - 30% { transform: translate(-30%, 0); } - 39.99% { transform: translate(-30%, 0); } - 40% { transform: translate(-40%, 0); } - 49.99% { transform: translate(-40%, 0); } - 50% { transform: translate(-50%, 0); } - 59.99% { transform: translate(-50%, 0); } - 60% { transform: translate(-60%, 0); } - 69.99% { transform: translate(-60%, 0); } - 70% { transform: translate(-70%, 0); } - 79.99% { transform: translate(-70%, 0); } - 80% { transform: translate(-80%, 0); } - 89.99% { transform: translate(-80%, 0); } - 90% { transform: translate(-90%, 0); } - 100% { transform: translate(-90%, 0); } + 0% { transform: translate(-05%, 0); } + 9.99% { transform: translate(-05%, 0); } + 10% { transform: translate(-15%, 0); } + 19.99% { transform: translate(-15%, 0); } + 20% { transform: translate(-25%, 0); } + 29.99% { transform: translate(-25%, 0); } + 30% { transform: translate(-35%, 0); } + 39.99% { transform: translate(-35%, 0); } + 40% { transform: translate(-45%, 0); } + 49.99% { transform: translate(-45%, 0); } + 50% { transform: translate(-55%, 0); } + 59.99% { transform: translate(-55%, 0); } + 60% { transform: translate(-65%, 0); } + 69.99% { transform: translate(-65%, 0); } + 70% { transform: translate(-75%, 0); } + 79.99% { transform: translate(-75%, 0); } + 80% { transform: translate(-85%, 0); } + 89.99% { transform: translate(-85%, 0); } + 90% { transform: translate(-95%, 0); } + 100% { transform: translate(-95%, 0); } } .itemlist .list label { diff --git a/thumbnail.sh b/thumbnail.sh index 3c486c7..835175e 100644 --- a/thumbnail.sh +++ b/thumbnail.sh @@ -29,7 +29,7 @@ gen_thumb(){ printf '' \ | mplayer -input nodefault-bindings -nosound -benchmark \ -noconfig all -really-quiet \ - -vf scale=320:-2,tile=10:1:10:0:0 \ + -vf scale=320:-2,expand=:::::16/9,tile=10:1:10:0:0 \ -vo jpeg:quality=85:outdir="${tmp}"\ "mf://$tmp/_*.jpg" 2>&-