Swiper arrows

Default

        {% include "@Components/swiper-arrows/swiper-arrows.twig" with {
  props : {
    extraClass: "extra-class"
  }
} %}

          <div class="swiper-arrows  extra-class">

    <div class="swiper-arrows__arrow swiper-button-prev">
        <span class="icon">
      <img src="images/svg/arrow-small-left-white.svg"  loading="lazy">
  
  </span>
    </div>

    <div class="swiper-arrows__arrow swiper-button-next">
        <span class="icon">
      <img src="images/svg/arrow-small-right-white.svg" alt="Další" loading="lazy">
  
  </span>
    </div>
</div>

Large

        {% include "@Components/swiper-arrows/swiper-arrows.twig" with {
  props : {
    size: "lg"
  }
} %}

          <div class="swiper-arrows --lg">

    <div class="swiper-arrows__arrow swiper-button-prev">
        <span class="icon  --xl">
      <img src="images/svg/arrow-big-left.svg"  loading="lazy">
  
  </span>
    </div>

    <div class="swiper-arrows__arrow swiper-button-next">
        <span class="icon  --xl">
      <img src="images/svg/arrow-big-right.svg" alt="Další" loading="lazy">
  
  </span>
    </div>
</div>

Schema

    {
  "props": {
    "size": {
      "type": "string",
      "description": "Size of the component"
    },
    "extraClass": {
      "type": "string",
      "description": "extra class of slide-arrows"
    }
  }
}