diff options
| author | Samantaz Fox <coding@samantaz.fr> | 2024-02-12 22:19:14 +0100 |
|---|---|---|
| committer | Samantaz Fox <coding@samantaz.fr> | 2024-02-12 22:19:14 +0100 |
| commit | 338d3d9f8613ad9e9c4c427addfdbc337d61595c (patch) | |
| tree | 035cd27558a6b2b319a3d4543b2c129fe101662f /assets | |
| parent | 1f51255f2f5ed53e1f9e50df7d6aad73a9f121d3 (diff) | |
| parent | 16c79f1ef5ab1fd58cffa8ee36c6e939efda2db4 (diff) | |
| download | invidious-338d3d9f8613ad9e9c4c427addfdbc337d61595c.tar.gz invidious-338d3d9f8613ad9e9c4c427addfdbc337d61595c.tar.bz2 invidious-338d3d9f8613ad9e9c4c427addfdbc337d61595c.zip | |
CSS: Fix thumbnails' aspect ratio to prevent CLS (#4278)
Force the thumbnails aspect ratio to 16/9 in order to prevent Cumulative Layout
Shifting (CLS) from hapenning during lazy loading.
It also fixes the problematic, taller thumbnails that Youtube returns for
playlists.
Closes issue 4002
Diffstat (limited to 'assets')
| -rw-r--r-- | assets/css/default.css | 1 |
1 files changed, 1 insertions, 0 deletions
diff --git a/assets/css/default.css b/assets/css/default.css index 00881253..4d6c6c2f 100644 --- a/assets/css/default.css +++ b/assets/css/default.css @@ -197,6 +197,7 @@ img.thumbnail { display: block; /* See: https://stackoverflow.com/a/11635197 */ width: 100%; object-fit: cover; + aspect-ratio: 16 / 9; } .thumbnail-placeholder { |