getgrav / grav

Modern, Crazy Fast, Ridiculously Easy and Amazingly Powerful Flat-File CMS powered by PHP, Markdown, Twig, and Symfony
https://getgrav.org
MIT License
14.49k stars 1.4k forks source link

Srcset does not work #2407

Open maliyshock opened 5 years ago

maliyshock commented 5 years ago

Screenshot_1 https://monosnap.com/file/DSObCbH8kTqKfZyoptQK2rEPMlrGCs Screenshot_2 https://monosnap.com/file/seckVU0D9wT2S7gf6ytGf0QuGqFnlG

rhukster commented 5 years ago

Simply use:

![](woman.jpg)

or:

![](woman.jpg?sizes=80vw)

Don't actually put @2x in your image name, so Grav knows to create a @1x version or it will use it statically (as you are seeing).

BTW i've updated the docs to make this a bit clearer. https://learn.getgrav.org/content/media#higher-density-displays

maliyshock commented 5 years ago

As I know from the CSS vw and vh values means 80% of the device screen width or height. So it is unclear how to use that. I would like to have srcset="woman.jpg 1x, woman@2x.jpeg 2x". It says that it will use the small image on screens with Device-pixel ratio = 1 and bigger image on Device-pixel ratio = 2. I do not know what 80vw means. Could you clarify that?

I read the documentation and I still confused. I am not sure I understand how it is should work.