Pagination 

  •         {% include "@Components/pagination/pagination.twig" with {props: {
  prev: {
    title: "Předchozí",
    url: "#prev"
  },
  next: {
    title: "Další",
    url: "#next"
  },
  items: [
    {
      title: "1",
      url: "#1"
    },
    {
      title: "2",
      url: "#2"
    },
    {
      title: "3",
      active: true
    },
    {
      title: "...",
      blank: true,
    },
    {
      title: "6",
      url: "#15"
    }
  ]
}} %}

      
  •           <div class="c-pagination d-flex align-items-center flex-wrap justify-content-center justify-content-xxl-end">
      <a class="link d-inline-flex u-fw-600 align-items-center  --icon-before    c-pagination__link --prev" href="#prev" title="Předchozí" data-page="" data-loading-target="" data-scroll-target="">
      <span class="link__title">Předchozí</span>
  
      <span class="link__icon d-flex align-items-center justify-content-center flex-shrink-0">
        
  <span class="icon d-flex align-items-center justify-content-center --colored --text --xs">
          <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512"><path d="M9.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L77.3 256 246.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z"/></svg>      </span>
    </span>
  
  </a>
  
  <div class="c-pagination__items d-flex gap-1 align-items-center">
          <a class="link d-inline-flex u-fw-600 align-items-center      c-pagination__link --page-number justify-content-center" href="#1" title="1" data-page="" data-loading-target="" data-scroll-target="">
      <span class="link__title">1</span>
  
  
  </a>
          <a class="link d-inline-flex u-fw-600 align-items-center      c-pagination__link --page-number justify-content-center" href="#2" title="2" data-page="" data-loading-target="" data-scroll-target="">
      <span class="link__title">2</span>
  
  
  </a>
          <a class="link d-inline-flex u-fw-600 align-items-center      --active  c-pagination__link --page-number justify-content-center" href="#" title="3" data-page="" data-loading-target="" data-scroll-target="">
      <span class="link__title">3</span>
  
  
  </a>
          <a class="link d-inline-flex u-fw-600 align-items-center      --blank c-pagination__link --page-number justify-content-center" href="#" title="..." data-page="" data-loading-target="" data-scroll-target="">
      <span class="link__title">...</span>
  
  
  </a>
          <a class="link d-inline-flex u-fw-600 align-items-center      c-pagination__link --page-number justify-content-center" href="#15" title="6" data-page="" data-loading-target="" data-scroll-target="">
      <span class="link__title">6</span>
  
  
  </a>
      </div>


      <a class="link d-inline-flex u-fw-600 align-items-center      c-pagination__link --next" href="#next" title="Další" data-page="" data-loading-target="" data-scroll-target="">
      <span class="link__title">Další</span>
  
      <span class="link__icon d-flex align-items-center justify-content-center flex-shrink-0">
        
  <span class="icon d-flex align-items-center justify-content-center --colored --text --xs">
          <svg xmlns="http://www.w3.org/2000/svg" height="1em" viewBox="0 0 320 512"><path d="M310.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L242.7 256 73.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z"/></svg>      </span>
    </span>
  
  </a>
  </div>