OFRAG Frontend Components Library v0.0.0

Data Sheet Image: Large Container 

<div class="data-sheet-image--large-container">
    <div class="image ">
        <picture>
            <img src="/example-assets/images/data-sheet/product-image.jpg" class="image__img data-sheet-image__image is-loading" alt="Product Test" onload="this.classList.remove('is-loading')" />
        </picture>
    </div>

</div>
 
{% include '@SharedComponents/modules/shared-product/components/data-sheet-image/data-sheet-image.twig' %}
 
{
  "image": {
    "alt": "Product Test",
    "src": "/example-assets/images/data-sheet/product-image.jpg"
  },
  "variant": "large-container"
}
  • Content: 
    @import "~shared/base";
@import "~cando-cx-components-library/components/modules/shared-product/components/data-sheet-image/data-sheet-image";
  • URL: /components/raw/data-sheet-image/data-sheet-image.scss
  • Filesystem Path: src/components/modules/shared-product/components/data-sheet-image/data-sheet-image.scss
  • Size: 142 Bytes

Note: small container variant is not used directly in this project, but in other projects using this library