<div class="hero--without-autoplay">
                              <div class="hero__container">
                                  <div class="swiper">
                                      <div class="swiper-wrapper">
                                          <div class="swiper-slide">

                                              <div class="hero__item-container " style="background: #080d23">
                                                  <div class="hero__overlay-container             ">
                                                      <div class="hero__overlay 
         
        ">
                                                          <div class="hero__logo
                                    ">
                                                              <div class="logos">
                                                                  <div class="image">
                                                                      <picture>
                                                                          <img class="image__img logos__brand--extra-large" alt="" title="" src="/example-assets/images/logos/brand-logo.png">
                                                                      </picture>
                                                                  </div>
                                                              </div>
                                                          </div>
                                                          <h3 class="hero__title">Durable<br>Super</h3>
                                                          <div class="hero__content">Informieren und Präsentieren leicht gemacht. Entdecken Sie jetzt die neuen Produkte!</div>
                                                          <div class="hero__link">
                                                              <a href="#" class="button-icon--text-large">
                                                                  Call to Action
                                                              </a>
                                                          </div>
                                                      </div>
                                                  </div>
                                                  <div class="hero__background  ">
                                                      <div class="image ">
                                                          <picture>
                                                              <img src="/example-assets/images/hero/image.jpg" class="image__img hero__image is-loading" alt="Test" srcset="/example-assets/images/hero/image.jpg 1x, /example-assets/images/hero/image.jpg 2x" onload="this.classList.remove('is-loading')" />
                                                          </picture>
                                                      </div>

                                                  </div>
                                              </div>
                                          </div>
                                      </div>
                                      <div class="hero__navigation-next"></div>
                                      <div class="hero__navigation-prev"></div>
                                      <div class="hero__pagination"></div>
                                  </div>
                              </div>
                          </div>
{% include '@SharedComponents/modules/bricks/components/hero/hero.twig' %}
{
  "headingLevel": 3,
  "items": [
    {
      "logos": "<img class=\"image__img logos__brand--extra-large\" alt=\"\" title=\"\" src=\"/example-assets/images/logos/brand-logo.png\">",
      "title": "Durable<br>Super",
      "content": "Informieren und Präsentieren leicht gemacht. Entdecken Sie jetzt die neuen Produkte!",
      "button": {
        "variant": "text-large",
        "type": "a",
        "href": "#",
        "title": "Call to Action"
      },
      "image": {
        "alt": "Test",
        "src": "/example-assets/images/hero/image.jpg",
        "src2x": "/example-assets/images/hero/image.jpg"
      },
      "background": "#080d23",
      "showAsLink": true
    }
  ]
}
  • Content:
    import './hero.scss';
    import Hero, {selector as sel} from 'cando-cx-components-library/components/modules/bricks/components/hero/hero';
    
    export default Hero;
    export const selector = sel;
  • URL: /components/raw/hero/hero.js
  • Filesystem Path: src/components/modules/bricks/components/hero/hero.js
  • Size: 186 Bytes
  • Content:
    @import "~shared/base";
    @import "~cando-cx-components-library/components/modules/bricks/components/hero/hero";
  • URL: /components/raw/hero/hero.scss
  • Filesystem Path: src/components/modules/bricks/components/hero/hero.scss
  • Size: 110 Bytes

No notes defined.