templates/course_list/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}Zatoka Kodu - Lista Kursów{% endblock %}
  5. {% block body %}
  7. <main>
  9.     <!-- =======================
  10.     Page Banner START -->
  11.     <section class="bg-blue align-items-center d-flex" style="background:url({{ asset('./assets/images/pattern/04.png') }}) no-repeat center center; background-size:cover;">
  12.         <div class="container">
  13.             <div class="row">
  14.                 <div class="col-12 text-center">
  15.                     <!-- Title -->
  16.                     <h1 class="text-white">Lista Naszych Kursów</h1>
  17.                 </div>
  18.             </div>
  19.         </div>
  20.     </section>
  21.     <!-- ======================
  22.     Page Banner END -->
  24.     <!-- =======================
  25.     Page content START -->
  26.     <section class="py-5">
  27.         <div class="container">
  28.             <div class="row">
  29.                 <!-- Main content START -->
  30.                 <div class="col-lg-8 col-xl-9">
  32.                     <!-- Search option START -->
  33.                     <div class="row mb-4 align-items-center">
  34.                         <ul class="nav nav-pills nav-pills-bg-gold justify-content-sm-center mb-4 px-3" id="course-pills-tab" role="tablist">
  35.                             <!-- Tab item -->
  36.                             <li class="nav-item me-2 me-sm-5" role="presentation">
  37.                                 <button class="nav-link mb-2 mb-md-0 active" id="--pills-tab-1" data-bs-toggle="pill" data-bs-target="#course-pills-tabs-1" type="button" role="tab" aria-controls="course-pills-tabs-1" aria-selected="false" tabindex="-1" style="height:50px;">
  38.                                     Wszystkie
  39.                                 </button>
  40.                             </li>
  41.                             <li class="nav-item me-2 me-sm-5" role="presentation">
  42.                                 <button class="nav-link mb-2 mb-md-0" id="--pills-tab-2" data-bs-toggle="pill" data-bs-target="#course-pills-tabs-2" type="button" role="tab" aria-controls="course-pills-tabs-2" aria-selected="false" tabindex="-1">
  43.                                     Wiek 7-9 lat
  44.                                     <svg height="35px" width="60px" style="margin-left:10px;">
  45.                                         <path d="M26.622 0c-3.79 0-6.964 3.086-6.964 6.964v2.909c0 0.97 0.705 1.675 1.586 1.852v2.115c0 0.882 0.706 1.587 1.587 1.587h1.058v1.234l-5.642 1.587c-1.058 0.264-1.851 1.234-1.939 2.38l-0.353 4.936c0 0.177 0 0.265 0.176 0.442 0.088 0.088 0.264 0.176 0.353 0.176h0.529v5.906h1.058v-5.906h1.586v5.906h1.058v-1.586h10.138v-1.058h-10.138v-2.643h10.138v-1.234h-10.138v-1.586h-1.058v1.058h-2.645l0.176-2.645h13.664v-1.058h-13.488l0.089-0.618c0.088-0.617 0.529-1.234 1.146-1.41l5.73-1.586 0.264 0.264s0.088 0 0.088 0.088c0.089 0.088 0.177 0.088 0.177 0.176l0.088 0.089c0.088 0 0.088 0.088 0.176 0.088 0 0 0.089 0 0.089 0.088 0.088 0 0.176 0.088 0.176 0.088s0.088 0 0.088 0.088c0.088 0 0.177 0.089 0.177 0.089h0.088c0.088 0 0.176 0 0.264 0.088h0.882c0.088 0 0.176 0 0.264-0.088h0.088c0.088 0 0.176-0.088 0.176-0.088s0.089 0 0.089-0.088c0.088 0 0.176-0.088 0.176-0.088s0.088 0 0.088-0.088c0.088 0 0.177-0.088 0.177-0.088l0.088-0.089c0.088-0.088 0.176-0.088 0.176-0.176 0 0 0.088 0 0.088-0.088l0.265-0.265 1.94 0.528v-1.146l-1.675-0.44v-1.234h1.058c0.002 0 0.005 0 0.008 0 0.873 0 1.58-0.707 1.58-1.58 0-0.003 0-0.006-0-0.008v0-2.115c0.794-0.088 1.498-0.794 1.586-1.587v-3.174c0.44-3.878-2.646-6.964-6.436-6.964zM21.245 10.578c-0.352-0.088-0.528-0.44-0.528-0.705 0-0.353 0.176-0.618 0.528-0.794v1.498zM28.21 16.838c0 0.088 0 0.088 0 0-0.088 0.176-0.176 0.264-0.264 0.352h-0.089c-0.088 0.088-0.176 0.177-0.352 0.177h-0.089c-0.088 0.088-0.264 0.088-0.352 0.176-0.265 0.088-0.618 0.088-0.882 0-0.176 0-0.264-0.088-0.352-0.176h-0.088c-0.088-0.088-0.265-0.176-0.354-0.176h-0.088l-0.264-0.265v-1.41h3.174v1.322zM30.854 13.84c0 0.264-0.264 0.529-0.528 0.529h-7.494c-0.264 0-0.529-0.264-0.529-0.528v-5.818h0.352c1.94 0 3.791-0.353 5.554-1.058l2.644 0.882v5.994zM31.912 10.578v-1.498c0.352 0.088 0.528 0.44 0.528 0.794 0 0.352-0.176 0.616-0.528 0.705zM32.44 8.198c-0.176-0.088-0.352-0.176-0.528-0.176v-0.971l-3.702-1.234-0.176 0.088c-1.675 0.705-3.526 1.058-5.378 1.058h-1.41v1.058c-0.176 0-0.352 0.088-0.528 0.176v-1.232c0-3.262 2.644-5.818 5.906-5.906 3.262 0 5.818 2.645 5.906 5.906v1.234h-0.088z"></path>
  46.                                         <path d="M24.947 9.609c0-0.617-0.264-1.058-0.528-1.058s-0.53 0.44-0.53 1.058c0 0.617 0.264 1.058 0.529 1.058 0.353 0 0.53-0.44 0.53-1.058zM29.267 9.609c0-0.617-0.264-1.058-0.529-1.058s-0.529 0.44-0.529 1.058c0 0.617 0.264 1.058 0.528 1.058s0.53-0.44 0.53-1.058zM26.006 9.874c0 0.352-0.176 0.705-0.352 0.882l-0.177 0.176v1.322h1.058v-0.882c0.352-0.441 0.529-0.97 0.529-1.498v-0.354h-1.058v0.352zM48.573 17.807h-14.192c-0 0-0.001 0-0.002 0-0.924 0-1.674 0.749-1.674 1.674 0 0.001 0 0.001 0 0.002v-0 8.727c0 0.882 0.705 1.674 1.674 1.674h4.937v1.058h-1.058v1.058h6.523v-1.058h-1.058v-1.058h4.936c0 0 0.001 0 0.002 0 0.924 0 1.674-0.749 1.674-1.674 0-0.001 0-0.001 0-0.002v0-8.728c-0.088-0.881-0.882-1.674-1.763-1.674zM40.374 30.942v-4.937c0-0.264 0.264-0.529 0.529-0.529h1.058c0.264 0 0.528 0.264 0.528 0.529v4.936h-2.115zM49.102 28.21c0 0.264-0.265 0.528-0.53 0.528h-4.936v-2.732c0-0 0-0.001 0-0.002 0-0.924-0.749-1.674-1.674-1.674-0.001 0-0.001 0-0.002 0h-1.058c-0 0-0.001 0-0.001 0-0.924 0-1.674 0.749-1.674 1.674 0 0.001 0 0.001 0 0.002v-0 2.733h-4.848c-0.265 0-0.53-0.264-0.53-0.529v-8.728c0-0.264 0.264-0.528 0.529-0.528h14.193c0.264 0 0.529 0.264 0.529 0.528v8.728zM13.312 9.697c0 0.618-0.265 1.058-0.53 1.058s-0.529-0.441-0.529-1.058c0-0.617 0.264-1.058 0.529-1.058s0.529 0.441 0.529 1.058zM9.080 9.697c0 0.618-0.264 1.058-0.529 1.058s-0.53-0.441-0.53-1.058c0-0.617 0.265-1.058 0.53-1.058s0.528 0.441 0.528 1.058zM11.725 11.107v1.234h-1.058v-0.882c-0.329-0.406-0.528-0.929-0.528-1.498v-0.264h1.058v0.264c0 0.352 0.176 0.706 0.352 0.882l0.176 0.264z"></path>
  47.                                         <path d="M10.666 0.176c-4.143 0-7.405 3.35-7.405 7.406v6.258c0 0.706-0.176 1.41-0.44 2.028-0.442 0.793-0.618 1.674-0.618 2.556-0.97 0.353-1.588 1.234-1.676 2.292l-0.528 5.466h1.146v5.818h1.058v-5.818h1.322v0.088c-0.084 0.304-0.132 0.653-0.132 1.014s0.048 0.71 0.139 1.042l-0.006-0.028 0.264 0.882c0.353 0.97 0.441 1.939 0.441 2.909h1.058c0-1.146-0.176-2.204-0.53-3.262l-0.264-0.882c-0.084-0.195-0.132-0.423-0.132-0.661s0.049-0.466 0.136-0.672l-0.004 0.011 0.264-0.882 0.53-1.498-1.058-0.352-0.44 1.234h-2.646l0.352-4.32c0-0.528 0.353-0.969 0.794-1.234 0.088 0.352 0.176 0.705 0.352 0.97 0.442 1.058 1.234 2.027 2.116 2.821l1.94 1.587c0.176 0.176 0.44 0.176 0.617 0.088s0.264-0.352 0.264-0.618l-0.705-2.732c-0.264-0.97-0.352-2.028-0.352-2.998 0-0.176 0-0.352 0.088-0.441l2.027-0.617h4.143l3.35 0.97c0.264-0.353 0.529-0.618 0.882-0.882l-1.058-0.264c1.322-0.442 2.116-1.675 2.204-2.998v-6.876c-0.087-4.144-3.35-7.406-7.493-7.406zM7.493 16.573c-1.146 0-2.115 0.97-2.115 2.116 0 1.058 0.176 2.204 0.44 3.262l0.265 1.146-0.617-0.53c-0.794-0.705-1.41-1.498-1.763-2.468-0.529-1.234-0.529-2.645 0.088-3.79 0.353-0.794 0.618-1.675 0.618-2.469v-2.556c0.264 0.264 0.705 0.44 1.058 0.528v2.116c0 0.882 0.705 1.587 1.586 1.587h0.53v1.058h-0.088zM5.025 9.433c0.088-0.088 0.176-0.176 0.352-0.264v1.498c-0.253-0.079-0.449-0.275-0.526-0.522l-0.002-0.006c-0.088-0.177 0-0.442 0.176-0.706zM10.666 8.11c1.499 0 2.91-0.441 4.232-1.146v6.964c0 0.265-0.265 0.53-0.53 0.53h-7.405c-0.264 0-0.528-0.264-0.528-0.53v-5.818c1.322-0.088 2.556-0.618 3.614-1.41l0.176-0.088v1.058c-0.088 0.176 0.176 0.44 0.441 0.44zM12.782 16.573h-4.232v-1.058h4.232v1.058zM17.014 14.458c0 1.146-0.97 2.115-2.116 2.115h-1.058v-1.058h0.529c0.002 0 0.005 0 0.007 0 0.873 0 1.58-0.707 1.58-1.58 0-0.002 0-0.005 0-0.007v0-2.116c0.44-0.088 0.794-0.264 1.058-0.529v3.174zM15.956 10.755v-1.499c0.264 0.088 0.44 0.353 0.529 0.618 0.088 0.352-0.176 0.705-0.529 0.882zM17.014 8.727c-0.264-0.264-0.705-0.44-1.058-0.529v-2.204c0-0.176-0.088-0.352-0.264-0.44s-0.353-0.089-0.53 0.088c-1.146 0.881-2.468 1.322-3.966 1.498v-1.675c0-0.176-0.088-0.352-0.265-0.44s-0.441-0.089-0.529 0.088l-0.97 0.793c-1.058 0.706-2.292 1.146-3.526 1.146-0.352 0-0.529 0.264-0.529 0.528v0.53c-0.441 0.088-0.794 0.264-1.058 0.529v-1.058c-0-0.008-0-0.018-0-0.027 0-3.49 2.83-6.32 6.32-6.32 0.010 0 0.019 0 0.029 0h-0.001c0.008-0 0.018-0 0.027-0 3.49 0 6.32 2.83 6.32 6.32 0 0.010-0 0.019-0 0.029v-0.001 1.146zM15.956 32v0z"></path>
  48.                                         <path d="M13.046 30.854l0.53-0.882-0.353-0.264c-1.587-0.97-3.35-1.411-5.202-1.411v1.058c1.675 0 3.262 0.441 4.672 1.322l0.353 0.176zM26.622 0c-3.79 0-6.964 3.086-6.964 6.964v2.909c0 0.97 0.705 1.675 1.586 1.852v2.115c0 0.882 0.706 1.587 1.587 1.587h1.058v1.234l-5.642 1.587c-1.058 0.264-1.851 1.234-1.939 2.38l-0.353 4.936c0 0.177 0 0.265 0.176 0.442 0.088 0.088 0.264 0.176 0.353 0.176h0.529v5.906h1.058v-5.906h1.586v5.906h1.058v-1.586h10.138v-1.058h-10.138v-2.643h10.138v-1.234h-10.138v-1.586h-1.058v1.058h-2.645l0.176-2.645h13.664v-1.058h-13.488l0.089-0.618c0.088-0.617 0.529-1.234 1.146-1.41l5.73-1.586 0.264 0.264s0.088 0 0.088 0.088c0.089 0.088 0.177 0.088 0.177 0.176l0.088 0.089c0.088 0 0.088 0.088 0.176 0.088 0 0 0.089 0 0.089 0.088 0.088 0 0.176 0.088 0.176 0.088s0.088 0 0.088 0.088c0.088 0 0.177 0.089 0.177 0.089h0.088c0.088 0 0.176 0 0.264 0.088h0.882c0.088 0 0.176 0 0.264-0.088h0.088c0.088 0 0.176-0.088 0.176-0.088s0.089 0 0.089-0.088c0.088 0 0.176-0.088 0.176-0.088s0.088 0 0.088-0.088c0.088 0 0.177-0.088 0.177-0.088l0.088-0.089c0.088-0.088 0.176-0.088 0.176-0.176 0 0 0.088 0 0.088-0.088l0.265-0.265 1.94 0.528v-1.146l-1.675-0.44v-1.234h1.058c0.002 0 0.005 0 0.008 0 0.873 0 1.58-0.707 1.58-1.58 0-0.003 0-0.006-0-0.008v0-2.115c0.794-0.088 1.498-0.794 1.586-1.587v-3.174c0.44-3.878-2.646-6.964-6.436-6.964zM21.245 10.578c-0.352-0.088-0.528-0.44-0.528-0.705 0-0.353 0.176-0.618 0.528-0.794v1.498zM28.21 16.838c0 0.088 0 0.088 0 0-0.088 0.176-0.176 0.264-0.264 0.352h-0.089c-0.088 0.088-0.176 0.177-0.352 0.177h-0.089c-0.088 0.088-0.264 0.088-0.352 0.176-0.265 0.088-0.618 0.088-0.882 0-0.176 0-0.264-0.088-0.352-0.176h-0.088c-0.088-0.088-0.265-0.176-0.354-0.176h-0.088l-0.264-0.265v-1.41h3.174v1.322zM30.854 13.84c0 0.264-0.264 0.529-0.528 0.529h-7.494c-0.264 0-0.529-0.264-0.529-0.528v-5.818h0.352c1.94 0 3.791-0.353 5.554-1.058l2.644 0.882v5.994zM31.912 10.578v-1.498c0.352 0.088 0.528 0.44 0.528 0.794 0 0.352-0.176 0.616-0.528 0.705zM32.44 8.198c-0.176-0.088-0.352-0.176-0.528-0.176v-0.971l-3.702-1.234-0.176 0.088c-1.675 0.705-3.526 1.058-5.378 1.058h-1.41v1.058c-0.176 0-0.352 0.088-0.528 0.176v-1.232c0-3.262 2.644-5.818 5.906-5.906 3.262 0 5.818 2.645 5.906 5.906v1.234h-0.088z"></path>
  49.                                         Sorry, your browser does not support inline SVG.
  50.                                     </svg>
  51.                                 </button>
  52.                             </li>
  53.                             <li class="nav-item me-2 me-sm-5" role="presentation">
  54.                                 <button class="nav-link mb-2 mb-md-0" id="--pills-tab-3" data-bs-toggle="pill" data-bs-target="#course-pills-tabs-3" type="button" role="tab" aria-controls="course-pills-tabs-3" aria-selected="false" tabindex="-1">
  55.                                     Wiek 10-12 lat
  56.                                     <svg height="35px" width="60px" style="margin-left:10px;">
  57.                                         <path d="M31.336 23.257v-1.049h-2.535c-0.262 0-0.525 0.262-0.525 0.524v2.623c-0 0.003-0 0.006-0 0.009 0 0.186 0.105 0.347 0.26 0.427l0.003 0.001 1.574 1.050c0.174 0.088 0.437 0.088 0.612 0l0.699-0.438v-1.311l-1.050 0.699-1.049-0.699v-1.836h2.011zM29.326 8.481c-0.262 0-0.525 0.437-0.525 1.050s0.262 1.049 0.525 1.049 0.525-0.437 0.525-1.049c0-0.612-0.262-1.050-0.525-1.050zM26.702 9.793c0 0.35-0.174 0.699-0.35 0.874l-0.175 0.175v1.312h1.050v-0.875c0.326-0.403 0.524-0.921 0.525-1.486v-0.35h-1.050v0.35zM27.227 0c-3.76 0-6.907 3.060-6.907 6.907v2.885c0 0.962 0.699 1.662 1.574 1.837v2.098c0 0.002 0 0.004 0 0.006 0 0.866 0.702 1.568 1.568 1.568 0.002 0 0.004 0 0.006 0h1.049v1.224l-5.596 1.574c-1.049 0.35-1.836 1.224-1.923 2.36v0.088l-0.437 5.421h1.136v5.858h1.050v-5.857h1.574v5.858h1.050v-8.743c0-1.487-0.262-2.886-0.874-4.197l4.022-1.137v0.874c0 0.002 0 0.004 0 0.006 0 0.866 0.702 1.568 1.568 1.568 0.002 0 0.004 0 0.006 0h2.098c0.002 0 0.004 0 0.006 0 0.866 0 1.567-0.702 1.567-1.567 0-0.002 0-0.005 0-0.007v0-0.874l1.486 0.437v-1.137l-1.574-0.437v-1.224h1.050c0.002 0 0.004 0 0.006 0 0.866 0 1.567-0.702 1.567-1.567 0-0.002 0-0.005 0-0.007v0-2.098c0.786-0.088 1.486-0.787 1.574-1.574v-3.235c0.174-3.847-2.886-6.907-6.645-6.907zM20.32 24.83h-2.623l0.35-4.284c0.087-0.699 0.524-1.224 1.224-1.399l0.262-0.087c0.525 1.224 0.787 2.536 0.787 3.847v1.923zM21.894 10.492c-0.35-0.088-0.524-0.438-0.524-0.787s0.174-0.612 0.524-0.786v1.574zM28.801 18.535c0 0.262-0.262 0.525-0.525 0.525h-2.098c-0.262 0-0.524-0.262-0.524-0.525v-3.147h3.146v3.147zM31.424 13.727c0 0.262-0.262 0.524-0.525 0.524h-7.432c-0.262 0-0.524-0.262-0.524-0.524v-5.509c0.612 0.262 1.136 0.438 1.749 0.525-0.088 0.262-0.176 0.525-0.176 0.787 0 0.612 0.263 1.049 0.526 1.049s0.524-0.437 0.524-1.049c0-0.175 0-0.438-0.087-0.612 0.438 0.087 0.962 0.087 1.399 0.087h0.962l-0.35-1.574c1.224 0.612 2.536 1.136 3.934 1.486v4.808zM32.473 10.492v-1.486c0.35 0.088 0.525 0.437 0.525 0.786s-0.174 0.612-0.525 0.7zM32.998 8.131c-0.262-0.088-0.525-0.175-0.787-0.175h-0.174c-1.662-0.35-3.322-0.962-4.722-1.836l-1.398-0.874 0.699 2.71c-1.312-0.087-2.623-0.437-3.847-0.962l-0.786-0.35v1.399c-0.175 0-0.35 0.087-0.525 0.174v-1.312c0.039-3.206 2.647-5.79 5.858-5.79s5.819 2.584 5.858 5.786l0 0.004v1.224h-0.175zM29.326 10.579c0.262 0 0.525-0.437 0.525-1.049s-0.262-1.050-0.525-1.050-0.526 0.437-0.526 1.050c0 0.612 0.262 1.049 0.525 1.049zM26.702 9.792c0 0.35-0.174 0.7-0.35 0.874l-0.175 0.175v1.312h1.050v-0.875c0.326-0.403 0.524-0.921 0.525-1.486v-0.35h-1.050v0.35zM26.702 9.53v0.35c0 0.35-0.174 0.699-0.35 0.874l-0.175 0.174v1.312h1.050v-0.874c0.326-0.403 0.524-0.921 0.525-1.486v-0.35h-1.050zM29.326 8.481c-0.262 0-0.525 0.437-0.525 1.050s0.262 1.049 0.525 1.049 0.525-0.437 0.525-1.049c0-0.612-0.262-1.050-0.525-1.050z"></path>
  58.                                         <path d="M31.424 23.257v1.836l-0.088 0.088v-1.925h0.088zM48.998 17.661h-13.989c-0 0-0.001 0-0.002 0-0.917 0-1.66 0.743-1.66 1.66 0 0.001 0 0.001 0 0.002v-0 8.656c0 0.874 0.699 1.661 1.662 1.661h4.896v0.962h-1.050v1.050h6.382v-1.050h-1.049v-1.048h4.896c0 0 0.001 0 0.002 0 0.917 0 1.66-0.743 1.66-1.66 0-0.001 0-0.001 0-0.002v0-8.656c-0.080-0.885-0.819-1.574-1.718-1.574-0.011 0-0.022 0-0.032 0l0.002-0zM40.954 30.601v-4.896c0-0.262 0.262-0.525 0.525-0.525h1.050c0.262 0 0.524 0.262 0.524 0.525v4.896h-2.098zM49.61 27.89c0 0.262-0.262 0.525-0.525 0.525h-4.896v-2.71c0-0 0-0.001 0-0.001 0-0.917-0.743-1.66-1.66-1.66-0 0-0.001 0-0.001 0h-1.050c-0 0-0.001 0-0.001 0-0.917 0-1.66 0.743-1.66 1.66 0 0 0 0.001 0 0.001v-0 2.71h-4.896c-0.262 0-0.525-0.262-0.525-0.525v-8.656c0-0.262 0.262-0.524 0.524-0.524h14.077c0.262 0 0.525 0.262 0.525 0.525v8.656h0.087zM9.566 9.792c0-0.612-0.262-1.049-0.524-1.049s-0.525 0.437-0.525 1.049c0 0.612 0.262 1.050 0.525 1.050s0.524-0.525 0.524-1.050z"></path>
  59.                                         <path d="M19.096 6.907c-0.699-3.847-4.022-6.558-7.956-6.558s-7.257 2.798-7.957 6.558c-0.262 1.486-0.262 3.060 0 4.634l0.262 1.749c0.262 1.574 1.312 2.973 2.71 3.76l0.35 0.174-3.584 1.050c-1.050 0.35-1.749 1.224-1.837 2.273l-0.437 5.422h1.048v5.77h1.050v-5.77h1.399v0.088c-0.176 0.611-0.176 1.311 0 2.010l0.262 0.787c0.35 0.962 0.438 1.923 0.438 2.885h1.049c0-1.049-0.174-2.186-0.524-3.234l-0.262-0.787c-0.083-0.194-0.131-0.419-0.131-0.656s0.048-0.462 0.135-0.667l-0.004 0.011 0.437-1.398 0.262-0.874-0.962-0.35-0.438 1.224h-2.622l0.35-4.284c0.088-0.7 0.525-1.224 1.136-1.486l3.498-1.050 0.7 0.874c0.35 0.438 0.524 0.962 0.524 1.574v11.016h1.050v-1.224l0.262-0.174c1.224-0.699 2.535-1.136 3.934-1.224v2.623h1.049v-10.93c0-0.525 0.175-1.137 0.525-1.574l0.699-0.874 1.312 0.35c0.262-0.35 0.524-0.612 0.786-0.874l-1.836-0.525 0.35-0.174c1.486-0.7 2.448-2.098 2.798-3.76l0.262-1.749c0.262-1.574 0.175-3.060-0.087-4.634zM7.206 17.050l-0.525 0.087 1.049-1.662h0.787v0.787c0 0.262-0.175 0.437-0.35 0.525l-0.962 0.262zM11.14 12.328v-0.874c0.35-0.437 0.524-0.874 0.524-1.486 1.009 1.099 2.231 1.985 3.603 2.596l0.069 0.028v1.224c0 0.262-0.262 0.525-0.524 0.525h-7.344c-0.262 0-0.525-0.262-0.525-0.525v-5.596h1.574c0.175 0 0.35-0.087 0.437-0.262l0.525-0.874 0.262 0.437c0.437 0.787 0.962 1.486 1.574 2.186h-0.699v0.35c0 0.35-0.175 0.7-0.35 0.874l-0.175 0.175v1.224h1.050zM13.238 28.066c-1.486 0.088-2.886 0.525-4.197 1.224v-7.782l0.699 0.262c0.401 0.166 0.867 0.262 1.355 0.262s0.954-0.096 1.379-0.271l-0.024 0.009 0.699-0.262v6.558h0.088zM13.938 18.535c-0.438 0.525-0.612 1.137-0.699 1.837l-1.137 0.437c-0.284 0.124-0.614 0.197-0.962 0.197s-0.678-0.072-0.978-0.203l0.016 0.006-1.136-0.437c-0.093-0.694-0.342-1.317-0.709-1.851l0.009 0.014-0.437-0.612 0.525-0.174c0.699-0.175 1.136-0.787 1.136-1.486v-0.787h3.148v0.787c0 0.699 0.437 1.312 1.136 1.486l0.525 0.174-0.437 0.612zM15.162 16.962l-0.962-0.174c-0.262-0.088-0.35-0.262-0.35-0.525v-0.787h0.786l1.050 1.662-0.525-0.175zM18.134 11.366l-0.262 1.748c-0.175 1.137-0.874 2.098-1.749 2.711l-0.437-0.612c0.437-0.262 0.786-0.787 0.786-1.312v-1.574c0-0.175-0.087-0.437-0.35-0.437-2.273-0.962-4.109-2.711-5.333-4.809l-0.7-1.224c-0.081-0.157-0.242-0.262-0.428-0.262-0.003 0-0.006 0-0.009 0h0c-0.003-0-0.006-0-0.010-0-0.186 0-0.347 0.105-0.427 0.259l-0.001 0.003-0.874 1.312h-1.923c-0.262 0-0.525 0.174-0.525 0.525v0.524c-0.699 0.088-1.311 0.612-1.486 1.399-0.087 0.525 0 1.049 0.262 1.486s0.7 0.699 1.224 0.786v2.098c0 0.525 0.262 1.050 0.787 1.312l-0.438 0.612c-0.962-0.612-1.574-1.574-1.748-2.71l-0.35-1.836c-0.262-1.399-0.176-2.798 0.087-4.197 0.612-3.322 3.497-5.77 6.907-5.77s6.295 2.448 6.907 5.77c0.262 1.312 0.262 2.798 0.087 4.197zM5.894 9.268v1.486c-0.176-0.088-0.263-0.175-0.35-0.262-0.174-0.175-0.174-0.438-0.174-0.699 0.087-0.262 0.35-0.438 0.524-0.525z"></path>
  60.                                     </svg>
  61.                                 </button>
  62.                             </li>
  63.                             <li class="nav-item me-2 me-sm-5" role="presentation">
  64.                                 <button class="nav-link mb-2 mb-md-0" id="--pills-tab-4" data-bs-toggle="pill" data-bs-target="#course-pills-tabs-4" type="button" role="tab" aria-controls="course-pills-tabs-4" aria-selected="false" tabindex="-1">
  65.                                     Wiek 13-15 lat
  66.                                     <svg height="35px" width="60px" style="margin-left:10px;">
  67.                                         <path d="M29.526 23.978c-0.265 0-0.53 0.264-0.53 0.528s0.265 0.53 0.53 0.53c0.264 0 0.528-0.264 0.528-0.529s-0.264-0.53-0.528-0.53zM29.526 22.391c-0.265 0-0.53 0.264-0.53 0.529s0.265 0.529 0.53 0.529c0.264 0 0.528-0.264 0.528-0.528s-0.264-0.53-0.528-0.53zM30.584 8.551c-0.264 0-0.529 0.44-0.529 1.058s0.264 1.058 0.528 1.058c0.265 0 0.53-0.44 0.53-1.058s-0.264-1.058-0.529-1.058zM27.851 9.874c0 0.352-0.176 0.705-0.352 0.882l-0.177 0.176v1.322h1.146v-0.882c0.353-0.441 0.529-0.97 0.529-1.498v-0.354h-1.058v0.352h-0.088zM26.264 8.551c-0.264 0-0.528 0.44-0.528 1.058s0.264 1.058 0.528 1.058c0.265 0 0.53-0.44 0.53-1.058s-0.176-1.058-0.53-1.058zM36.226 3.174c-1.498 0-2.909-0.529-3.966-1.498-1.323-1.147-2.998-1.763-4.672-1.763h-0.53c-1.675 0-3.35 0.794-4.408 2.116s-1.498 3.085-1.146 4.76l0.441 1.763c-0.257 0.306-0.414 0.704-0.414 1.138 0 0.258 0.055 0.503 0.154 0.724l-0.005-0.011c0.264 0.617 0.793 1.058 1.498 1.146v2.116c0 0.882 0.705 1.586 1.586 1.586h1.058v0.794c0 0.264-0.176 0.441-0.352 0.529l-3.879 1.147-1.586 0.44c-0.97 0.265-1.675 1.058-1.851 1.94l-0.176 2.998c0 0.352-0.177 0.617-0.353 0.882-0.441 0.528-0.618 1.146-0.53 1.851 0.088 0.528 0.264 0.97 0.53 1.41 0.352 0.44 0.793 0.793 1.41 0.882v3.702h1.058v-1.587h1.586v1.587h1.058v-7.494h-1.058v2.645h-2.468c-0.264 0-0.617-0.176-0.794-0.44s-0.264-0.618-0.352-0.97c0-0.352 0.088-0.705 0.264-0.97 0.441 0.44 0.97 0.882 1.498 1.058l0.441 0.176 0.353-0.97-0.44-0.176c-0.576-0.209-1.039-0.614-1.317-1.133l-0.006-0.013c0-0.176 0.088-0.265 0.088-0.441l0.176-2.91c0.177-0.528 0.53-0.97 1.146-1.146l2.204-0.618 2.733 2.292c0.562 0.487 1.243 0.854 1.992 1.051l0.035 0.008h0.176v3.79l1.323 0.706 0.44-0.97h-0.704v-2.997c0.010 0 0.021 0 0.032 0 1.243 0 2.376-0.468 3.233-1.238l-0.004 0.004 1.058-0.882v-1.41l-1.763 1.498c-0.687 0.616-1.6 0.992-2.601 0.992s-1.913-0.376-2.604-0.995l0.004 0.003-2.203-1.851 2.027-0.617c0.706-0.176 1.146-0.794 1.146-1.498v-0.794h3.174v0.794c0 0.705 0.44 1.322 1.146 1.498l1.586 0.441v-1.058l-1.234-0.441c-0.264-0.088-0.353-0.264-0.353-0.529v-0.794h1.058c0.002 0 0.005 0 0.007 0 0.873 0 1.58-0.707 1.58-1.58 0-0.003 0-0.005-0-0.008v0-2.115c0.882-0.176 1.586-0.882 1.586-1.851s-0.705-1.675-1.586-1.851v-0.794c1.322-0.794 2.468-1.939 3.174-3.262l0.352-0.794h-1.058zM19.918 28.298h1.586v1.058h-1.586v-1.058zM23.090 10.578c-0.352-0.088-0.528-0.44-0.528-0.794 0-0.352 0.176-0.616 0.528-0.793v1.586zM32.699 13.84c0 0.264-0.264 0.53-0.528 0.53h-7.494c-0.264 0-0.529-0.265-0.529-0.53v-6.258l4.672 0.705c1.322 0.176 2.645 0 3.878-0.44v5.994zM34.286 9.874c0 0.352-0.176 0.617-0.529 0.793v-1.498c0.352 0.088 0.529 0.352 0.529 0.706zM32.964 6.435l-0.088 0.088c-1.234 0.618-2.557 0.794-3.879 0.618l-5.818-0.794v1.675h-0.176l-0.354-1.41c-0.264-1.322 0-2.822 0.882-3.879 0.867-1.027 2.156-1.675 3.595-1.675 0.007 0 0.013 0 0.020 0h0.44c1.499 0 2.91 0.53 3.967 1.499 1.146 0.97 2.468 1.498 3.967 1.674-0.618 0.97-1.499 1.675-2.557 2.204zM30.584 10.667c0.264 0 0.529-0.441 0.529-1.058s-0.264-1.058-0.529-1.058c-0.264 0-0.529 0.44-0.529 1.058s0.176 1.058 0.528 1.058zM27.851 9.874c0 0.352-0.176 0.705-0.352 0.882l-0.177 0.176v1.322h1.146v-0.882c0.353-0.441 0.529-0.97 0.529-1.498v-0.354h-1.058v0.352h-0.088zM26.264 8.551c-0.264 0-0.528 0.44-0.528 1.058s0.264 1.058 0.528 1.058c0.265 0 0.53-0.44 0.53-1.058s-0.176-1.058-0.53-1.058zM27.851 9.609v0.352c0 0.354-0.176 0.706-0.352 0.882l-0.177 0.176v1.322h1.146v-0.882c0.353-0.44 0.529-0.97 0.529-1.498v-0.352h-1.146zM30.584 8.551c-0.264 0-0.529 0.44-0.529 1.058s0.264 1.058 0.528 1.058c0.265 0 0.53-0.44 0.53-1.058s-0.264-1.058-0.529-1.058zM26.264 8.551c-0.264 0-0.528 0.44-0.528 1.058s0.264 1.058 0.528 1.058c0.265 0 0.53-0.44 0.53-1.058s-0.176-1.058-0.53-1.058zM50.418 17.719h-14.192c-0.001 0-0.002 0-0.002 0-0.924 0-1.674 0.749-1.674 1.674 0 0.001 0 0.001 0 0.002v-0 8.727c0 0.882 0.706 1.674 1.675 1.674h4.936v1.058h-1.057v1.058h6.523v-1.058h-1.058v-1.058h4.936c0 0 0.001 0 0.002 0 0.924 0 1.674-0.749 1.674-1.674 0-0 0-0.001 0-0.001v0-8.728c-0.088-0.881-0.882-1.674-1.763-1.674zM42.22 30.854v-4.937c0-0.264 0.264-0.529 0.529-0.529h1.058c0.264 0 0.528 0.264 0.528 0.528v4.938h-2.115zM50.948 28.122c0 0.264-0.265 0.528-0.53 0.528h-4.936v-2.732c0-0 0-0.001 0-0.002 0-0.924-0.749-1.674-1.674-1.674-0.001 0-0.001 0-0.002 0h-1.058c-0 0-0.001 0-0.001 0-0.924 0-1.674 0.749-1.674 1.674 0 0.001 0 0.001 0 0.002v-0 2.733h-4.937c-0.264 0-0.529-0.264-0.529-0.529v-8.728c0-0.264 0.264-0.528 0.528-0.528h14.194c0.264 0 0.529 0.264 0.529 0.528v8.728h0.088zM10.838 9.697c0-0.617-0.264-1.058-0.529-1.058s-0.529 0.441-0.529 1.058c0 0.618 0.264 1.058 0.528 1.058 0.353 0 0.53-0.53 0.53-1.058zM15.069 9.697c0-0.617-0.264-1.058-0.529-1.058s-0.529 0.441-0.529 1.058c0 0.618 0.264 1.058 0.528 1.058 0.354 0 0.53-0.53 0.53-1.058zM12.424 11.46c0.353-0.44 0.529-0.97 0.529-1.498v-0.264h-1.057v0.352c0 0.352-0.176 0.706-0.352 0.882l-0.177 0.176v1.234h1.058v-0.882zM15.334 29.267v-1.058c-1.851 0-3.614 0.528-5.202 1.41l-0.352 0.264 0.528 0.882 0.353-0.264c1.343-0.775 2.954-1.233 4.672-1.234h0z"></path>
  68.                                         <path d="M20.975 9.697v-1.057c0-4.673-3.791-8.464-8.463-8.464s-8.462 3.792-8.462 8.464v1.058c-1.058 0.176-2.028 0.97-2.469 1.94-0.44 1.146-0.264 2.291 0.441 3.173-1.146 0.53-1.762 1.763-1.762 2.998 0.088 1.234 0.882 2.38 2.027 2.821l-0.44 4.937c0 0.176 0 0.264 0.176 0.441 0.088 0.088 0.264 0.176 0.352 0.176h0.529v5.818h1.058v-5.818h1.41c-0.058 0.314-0.091 0.675-0.091 1.044 0 0.634 0.097 1.246 0.278 1.821l-0.012-0.043v0.088c0.264 0.97 0.441 1.939 0.441 2.997l1.058-0.088c0-0.176 0-0.352-0.088-0.529 0-0.794-0.176-1.587-0.44-2.38 0-0.088-0.088-0.264-0.088-0.353v-0.088c-0.126-0.423-0.198-0.908-0.198-1.41s0.072-0.988 0.207-1.447l-0.009 0.036c0.088-0.176 0-0.353-0.089-0.441-0.088-0.176-0.264-0.176-0.441-0.176h-2.909l0.352-4.32c0-0.353 0.176-0.706 0.441-0.97h13.4c0.176-0.441 0.352-0.794 0.617-1.058h-11.107l2.997-0.882c0.706-0.176 1.146-0.793 1.146-1.498v-0.794h3.174v0.794c0 0.706 0.44 1.322 1.146 1.498l2.645 0.794c0.352-0.352 0.706-0.617 1.058-0.794l-3.438-0.97c-0.264-0.088-0.353-0.264-0.353-0.528v-0.794h1.058c0.002 0 0.005 0 0.007 0 0.873 0 1.58-0.707 1.58-1.58 0-0.002 0-0.005 0-0.007v0-2.116c0.617-0.088 1.234-0.528 1.498-1.146s0.176-1.322-0.264-1.851c-0.265-0.353-0.706-0.618-1.234-0.706v-0.705c0-0.264-0.264-0.53-0.529-0.53-1.309-0.006-2.509-0.471-3.448-1.241l0.010 0.008-0.97-0.794c-0.176-0.088-0.352-0.176-0.529-0.088s-0.264 0.264-0.264 0.44v1.676c-1.51-0.105-2.874-0.653-3.985-1.512l0.017 0.013c-0.176-0.088-0.352-0.176-0.528-0.088s-0.353 0.264-0.353 0.529v2.116h-0.264c-0.177 0-0.354 0.088-0.442 0.176-0.794 0.529-1.058 1.498-0.705 2.292 0.264 0.618 0.793 1.058 1.498 1.146v2.115c0 0.882 0.705 1.587 1.586 1.587h1.058v0.794c0 0.264-0.176 0.44-0.353 0.528l-5.202 1.499c-0.352 0.088-0.793 0.352-1.058 0.617-0.264 0.176-0.529 0.353-0.617 0.618-0.794-0.441-1.322-1.322-1.146-2.204s0.794-1.587 1.763-1.763c0.176 0 0.352-0.176 0.441-0.441 0-0.176 0-0.44-0.176-0.529-0.794-0.529-1.058-1.498-0.794-2.38 0.263-0.874 1.061-1.499 2.005-1.499 0.008 0 0.016 0 0.024 0h-0.001c0.265 0 0.53-0.264 0.53-0.528v-1.499c0-4.055 3.35-7.405 7.405-7.405 4.143 0 7.405 3.35 7.405 7.405v1.586c0 0.265 0.264 0.53 0.529 0.53 0.176 0 0.352 0 0.529 0.088-0.264-0.441-0.264-0.794-0.176-1.146zM17.802 9.169c0.176 0.088 0.264 0.176 0.352 0.264 0.177 0.176 0.177 0.44 0.177 0.705-0.079 0.254-0.275 0.45-0.523 0.527l-0.006 0.002v-1.498zM7.135 10.666c-0.176-0.088-0.441-0.264-0.441-0.44-0.088-0.441 0-0.794 0.352-1.058h0.176v1.498h-0.088zM8.722 14.457c-0.264 0-0.529-0.264-0.529-0.53v-6.963c1.322 0.706 2.733 1.146 4.232 1.146 0.264 0 0.528-0.264 0.528-0.529v-1.058l0.088 0.088c1.058 0.794 2.293 1.322 3.615 1.411v5.818c0 0.264-0.265 0.53-0.53 0.53h-7.405v0.088z"></path>
  69.                                         Sorry, your browser does not support inline SVG.
  70.                                     </svg>
  71.                                 </button>
  72.                             </li>
  73.                         </ul>
  74.                         {{ render_esi(path('course_list')) }}
  75.                     </div>
  76.                 </div>
  77.                 <!-- Main content END -->
  79.                 <!-- Right sidebar START -->
  80.                 <div class="col-lg-4 col-xl-3">
  81.                     <!-- Responsive offcanvas body START -->
  82.                     <div class="offcanvas-lg offcanvas-end" tabindex="-1" id="offcanvasSidebar" aria-labelledby="offcanvasSidebarLabel">
  83.                         <div class="offcanvas-header bg-light">
  84.                             <h5 class="offcanvas-title" id="offcanvasNavbarLabel">Advance Filter</h5>
  85.                             <button  type="button" class="btn-close" data-bs-dismiss="offcanvas" data-bs-target="#offcanvasSidebar" aria-label="Close"></button>
  86.                         </div>
  87.                         <div class="offcanvas-body p-3 p-lg-0">
  88.                             <form>
  89.                                 <!-- Category START -->
  90.                                 <div class="card card-body shadow p-4 mb-4">
  91.                                     <!-- Title -->
  92.                                     <h4 class="mb-3">Kategorie Kursów</h4>
  93.                                     <!-- Category group -->
  94.                                     <div class="col-12">
  95.                                         <div class="d-flex justify-content-between align-items-center">
  96.                                             <div class="form-check">
  97.                                                 <input class="form-check-input" type="checkbox" value="" data-get_type="scratch" id="flexCheckDefault10">
  98.                                                 <label class="form-check-label" for="flexCheckDefault10">Scratch</label>
  99.                                             </div>
  100.                                         </div>
  101.                                         <!-- Checkbox -->
  102.                                         <div class="d-flex justify-content-between align-items-center">
  103.                                             <div class="form-check">
  104.                                                 <input class="form-check-input" type="checkbox" value="" data-get_type="minecraft" id="flexCheckDefault11">
  105.                                                 <label class="form-check-label" for="flexCheckDefault11">Minecraft</label>
  106.                                             </div>
  107.                                         </div>
  108.                                         <!-- Checkbox -->
  109.                                         <div class="d-flex justify-content-between align-items-center">
  110.                                             <div class="form-check">
  111.                                                 <input class="form-check-input" type="checkbox" value="" data-get_type="unity" id="flexCheckDefault12">
  112.                                                 <label class="form-check-label" for="flexCheckDefault12">Unity</label>
  113.                                             </div>
  114.                                         </div>
  115.                                         <!-- Checkbox -->
  116.                                         <div class="d-flex justify-content-between align-items-center">
  117.                                             <div class="form-check">
  118.                                                 <input class="form-check-input" type="checkbox" value="" data-get_type="python" id="flexCheckDefault17">
  119.                                                 <label class="form-check-label" for="flexCheckDefault17">Python</label>
  120.                                             </div>
  121.                                         </div>
  122.                                         <!-- Checkbox -->
  123.                                         <div class="d-flex justify-content-between align-items-center">
  124.                                             <div class="form-check">
  125.                                                 <input class="form-check-input" type="checkbox" value="" data-get_type="roblox" id="flexCheckDefault18">
  126.                                                 <label class="form-check-label" for="flexCheckDefault18">Roblox</label>
  127.                                             </div>
  128.                                         </div>
  129.                                     </div>
  130.                                 </div>
  131.                                 <!-- Category END -->
  132.                             </form><!-- Form End -->
  133.                         </div>
  136.                     </div>
  137.                     <!-- Responsive offcanvas body END -->
  138.                 </div>
  139.                 <!-- Right sidebar END -->
  140.             </div><!-- Row END -->
  141.         </div>
  142.     </section>
  143.     <!-- =======================
  144.     Page content END -->
  146.     <!-- =======================
  147.     Newsletter START -->
  148.     <section class="pt-0">
  149.         <div class="container position-relative overflow-hidden">
  150.             <!-- SVG decoration -->
  151.             <figure class="position-absolute top-50 start-50 translate-middle ms-3">
  152.                 <svg>
  153.                     <path d="m496 22.999c0 10.493-8.506 18.999-18.999 18.999s-19-8.506-19-18.999 8.507-18.999 19-18.999 18.999 8.506 18.999 18.999z" fill="#fff" fill-rule="evenodd" opacity=".502"/>
  154.                     <path d="m775 102.5c0 5.799-4.701 10.5-10.5 10.5-5.798 0-10.499-4.701-10.499-10.5 0-5.798 4.701-10.499 10.499-10.499 5.799 0 10.5 4.701 10.5 10.499z" fill="#fff" fill-rule="evenodd" opacity=".102"/>
  155.                     <path d="m192 102c0 6.626-5.373 11.999-12 11.999s-11.999-5.373-11.999-11.999c0-6.628 5.372-12 11.999-12s12 5.372 12 12z" fill="#fff" fill-rule="evenodd" opacity=".2"/>
  156.                     <path d="m20.499 10.25c0 5.66-4.589 10.249-10.25 10.249-5.66 0-10.249-4.589-10.249-10.249-0-5.661 4.589-10.25 10.249-10.25 5.661-0 10.25 4.589 10.25 10.25z" fill="#fff" fill-rule="evenodd" opacity=".2"/>
  157.                 </svg>
  158.             </figure>
  159.             <!-- Svg decoration -->
  160.             <figure class="position-absolute bottom-0 end-0 mb-5 d-none d-sm-block">
  161.                 <svg class="rotate-130" width="258.7px" height="86.9px" viewBox="0 0 258.7 86.9">
  162.                     <path stroke="white" fill="none" stroke-width="2" d="M0,7.2c16,0,16,25.5,31.9,25.5c16,0,16-25.5,31.9-25.5c16,0,16,25.5,31.9,25.5c16,0,16-25.5,31.9-25.5 c16,0,16,25.5,31.9,25.5c16,0,16-25.5,31.9-25.5c16,0,16,25.5,31.9,25.5s16-25.5,31.9-25.5"/>
  163.                     <path stroke="white" fill="none" stroke-width="2" d="M0,57c16,0,16,25.5,31.9,25.5c16,0,16-25.5,31.9-25.5c16,0,16,25.5,31.9,25.5c16,0,16-25.5,31.9-25.5 c16,0,16,25.5,31.9,25.5c16,0,16-25.5,31.9-25.5c16,0,16,25.5,31.9,25.5s16-25.5,31.9-25.5"/>
  164.                 </svg>
  165.             </figure>
  167.             <div class="bg-grad-pink p-3 p-sm-5 rounded-3">
  168.                 <div class="row justify-content-center position-relative">
  169.                     <!-- SVG decoration -->
  170.                     <figure class="fill-white opacity-1 position-absolute top-50 start-0 translate-middle-y">
  171.                         <svg width="141px" height="141px">
  172.                             <path d="M140.520,70.258 C140.520,109.064 109.062,140.519 70.258,140.519 C31.454,140.519 -0.004,109.064 -0.004,70.258 C-0.004,31.455 31.454,-0.003 70.258,-0.003 C109.062,-0.003 140.520,31.455 140.520,70.258 Z"/>
  173.                         </svg>
  174.                     </figure>
  175.                     <!-- Newsletter -->
  176.                     <div class="col-12 position-relative my-2 my-sm-3">
  177.                         <div class="row align-items-center">
  178.                             <!-- Title -->
  179.                             <div class="col-lg-6">
  180.                                 <h3 class="text-white mb-3 mb-lg-0" id="newsletter_title">Zapisz się do Newslettera i bądź na bieżąco z promocjami<h3>
  181.                             </div>
  182.                             <!-- Input item -->
  183.                             <div class="col-lg-6 text-lg-end" id="newsletter_input">
  184.                                 <form class="bg-body rounded p-2">
  185.                                     <div class="input-group">
  186.                                         <input class="form-control border-0 me-1" type="email" id="newsletter_email" placeholder="Wpisz swój adres mailowy">
  187.                                         <button type="button" id="newsletter_button" class="btn btn-dark mb-0 rounded">Zapisz się</button>
  188.                                     </div>
  189.                                 </form>
  190.                             </div>
  191.                         </div>
  192.                     </div>
  193.                 </div> <!-- Row END -->
  194.             </div>
  195.         </div>
  196.     </section>
  197.     <!-- =======================
  198.     Newsletter END -->
  200. </main>
  201. <!-- **************** MAIN CONTENT END **************** -->
  202. {% endblock %}
  204. {%  block js %}
  205.     {{ parent() }}
  206.     <script src="{{ asset('./assets/js/jquery-3.6.4.min.js')  }}"></script>
  207.     <script type="application/javascript">
  208.         function checkCheckboxes() {
  209.             const searchParams = new URLSearchParams(window.location.search);
  210.             const type = searchParams.get('type');
  211.             // Select the element with the matching 'id'
  212.             const checkbox = document.querySelector(`input[type="checkbox"][data-get_type="${type}"]`);
  213.             if (checkbox) {
  214.                 checkbox.checked = true;
  215.                 checkbox.dispatchEvent(new Event('change'));
  216.             }
  217.         }
  219.         function filterElements() {
  220.             const checkboxes = document.querySelectorAll('input[type="checkbox"]:checked');
  221.             const elements = document.querySelectorAll('[data-type]');
  222.             const selectedTypes = [];
  224.             for (const checkbox of checkboxes) {
  225.                 selectedTypes.push(checkbox.getAttribute('data-get_type'));
  226.             }
  228.             if (selectedTypes.length === 0) {
  229.                 for (const element of elements) {
  230.                     element.style.display = 'block';
  231.                 }
  232.             } else {
  233.                 for (const element of elements) {
  234.                     if (selectedTypes.includes(element.getAttribute('data-type'))) {
  235.                         element.style.display = 'block';
  236.                     } else {
  237.                         element.style.display = 'none';
  238.                     }
  239.                 }
  240.             }
  241.         }
  243.         // Wait for the page to load and then check any pre-selected checkboxes
  244.         document.addEventListener('DOMContentLoaded', checkCheckboxes);
  246.         // Add an event listener to the checkboxes to filter the elements
  247.         document.querySelectorAll('.form-check-input').forEach(function(el) {
  248.             el.addEventListener('change', filterElements);
  249.         });
  251.         function isValidEmail() {
  252.             var input = document.getElementById('newsletter_email')
  253.             var pattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
  254.             return pattern.test(input.value);
  255.         }
  256.         function sendMessage() {
  257.             const data = {
  258.                 email: $('#newsletter_email').val(),
  259.                 type: 'newsletter'
  260.             };
  262.             $.ajax({
  263.                 url: '/message',
  264.                 method: 'POST',
  265.                 data: data,
  266.                 success: function(response) {
  267.                     document.getElementById('newsletter_title').innerHTML = "Dziękujemy!</br>Dodaliśmy twój adres do Newslettera";
  268.                     document.getElementById('newsletter_input').style.setProperty('display', 'none');
  269.                 },
  270.                 error: function(jqXHR, textStatus, errorThrown) {
  271.                     console.error('Error sending message:', errorThrown);
  272.                 }
  273.             });
  274.         }
  275.         document.getElementById('newsletter_button').addEventListener('click', function() {
  276.             var alert = document.createElement('div');
  277.             if(isValidEmail()) {
  278.                 sendMessage()
  279.             } else {
  280.                 alert.className = 'alert text-center alert-danger';
  281.                 alert.innerHTML = '<h4 class="alert-heading">Podaj prawidłowy adres email</h4>';
  282.             }
  283.             alert.style.position = 'fixed';
  284.             alert.style.left = '50%';
  285.             alert.style.top = '30%';
  286.             alert.style.transform = 'translate(-50%, -50%)';
  287.             alert.style.BorderRadius = "10px";
  288.             alert.style.zIndex = '10';
  289.             document.body.appendChild(alert);
  290.             setTimeout(function() {
  291.                 document.body.removeChild(alert);
  292.             }, 2000);
  294.         });
  295.     </script>
  296.     {{ parent() }}
  297. {%  endblock %}