<a class="image-signpost">
    <div class="image-signpost__img-wrapper" data-behaviour="ripple-effect">
        <picture>
            <source media="(max-width: 819px)" srcset="/assets/example-content/image-singpost-mob-1.png">
            <source media="(min-width: 820px)" srcset="/assets/example-content/image-singpost-1.png">
            <img src="/assets/example-content/image-singpost-1.png" alt="">
        </picture>
    </div>
    <div class="image-signpost__title">Mens Senior</div>
</a>

No notes defined.

{
  "smallimage": "/assets/example-content/image-singpost-mob-1.png",
  "bigimage": "/assets/example-content/image-singpost-1.png",
  "heading": "Mens Senior"
}
<a class="image-signpost">
    <div class="image-signpost__img-wrapper" data-behaviour="ripple-effect">
        <picture>
            <source media="(max-width: 819px)" srcset="{{smallimage}}">
            <source media="(min-width: 820px)" srcset="{{bigimage}}">
            <img src="{{bigimage}}" alt="">
        </picture>
    </div>
    <div class="image-signpost__title">{{heading}}</div>
</a>