OFRAG Frontend Components Library v0.0.0

Add To List Toast: Error 

<div class="add-to-list-toast">
    <div class="add-to-list-toast__container">
        <div class="image ">
            <picture>
                <img src="/example-assets/images/add-to-list-toast/image.png" class="image__img add-to-list-toast__image is-loading" alt="A super awesome product. A super awesome product." onload="this.classList.remove('is-loading')" />
            </picture>
        </div>

        <div class="add-to-list-toast__name">
            A super awesome product. A super awesome product.
        </div>
        <div class="add-to-list-toast__close">
            <button class="button-icon--icon-regular -icon-close" type="button" name="close" value="close">
                <span class="visually-hidden">Schliessen</span>
            </button>
        </div>
    </div>
    <div class="add-to-list-toast__message--error">Produkt konnte nicht zur Liste hinzugefügt werden.</div>
</div>
 
{% include '@SharedComponents/modules/shared/components/add-to-list-toast/add-to-list-toast.twig' %}
 
{
  "image": {
    "src": "/example-assets/images/add-to-list-toast/image.png",
    "alt": "A super awesome product. A super awesome product."
  },
  "name": "A super awesome product. A super awesome product.",
  "closeLabel": "Schliessen",
  "message": {
    "type": "error",
    "value": "Produkt konnte nicht zur Liste hinzugefügt werden."
  }
}
  • Content: 
    @import "~shared/base";
@import "~cando-cx-components-library/components/modules/shared/components/add-to-list-toast/add-to-list-toast";
  • URL: /components/raw/add-to-list-toast/add-to-list-toast.scss
  • Filesystem Path: src/components/modules/shared/components/add-to-list-toast/add-to-list-toast.scss
  • Size: 136 Bytes

This component is only being used in Angular directly since it’s being shown dynamically.