Barmer Fractal

Picture 

<picture class="a-picture ">
    <source media="(max-width: 640px)" srcset="../../images/1x1/barmer-app-yeah.jpg">
    <source media="(min-width: 641px)" srcset="../../images/16x9/barmer-app-yeah.jpg">
    <img src="../../images/16x9/barmer-app-yeah.jpg" alt="Dies ist ein alternativ Text" loading="lazy">
</picture>
 
<picture class="a-picture {{viewtypes.specifier}}" {{{content.attributes}}}>
	{{#each content.sources}}
		<source media="{{media}}" srcset="{{srcset}}" {{#if width }} width="{{ width }}" {{/if }}{{#if height }} height="{{ height }}" {{/if }}>
	{{/each}}
	<img src="{{content.img.src}}" alt="{{content.img.alt}}" {{#switches.hasLazyLoading}}loading="lazy"{{/switches.hasLazyLoading}}{{#if content.img.width }} width="{{ content.img.width }}" {{/if }}{{#if content.img.height }} height="{{ content.img.height }}" {{/if }}>
</picture>
 
{
  "switches": {
    "hasLazyLoading": true
  },
  "content": {
    "attributes": "",
    "sources": [
      {
        "media": "(max-width: 640px)",
        "srcset": "../../images/1x1/barmer-app-yeah.jpg",
        "width": false,
        "height": false
      },
      {
        "media": "(min-width: 641px)",
        "srcset": "../../images/16x9/barmer-app-yeah.jpg",
        "width": false,
        "height": false
      }
    ],
    "img": {
      "src": "../../images/16x9/barmer-app-yeah.jpg",
      "alt": "Dies ist ein alternativ Text",
      "width": false,
      "height": false
    }
  }
}

No notes defined.