templates/base_site/site/v3/modules/index-themes.html.twig line 1

Open in your IDE?
  1. <div class=" my-16">
  2.     <div class="container">
  3.         <div class="row">
  4.             <div class="d-flex flex-column gap-3">
  5.                 <h2 class="fw-bold text-center sec-title">
  6.                     ساخت فروشگاه فقط در دو دقیقه
  7.                 </h2>
  8.                 <p class="text-muted mb-4 text-center" id="ecmPowerDesc">
  9.                     طرحی که از دیدنش لذت میبری رو انتخاب کن و تحویلش تو دقیقه مسئولیت ماست
  10.                 </p>
  11.             </div>
  12.         </div>
  13.     </div>
  14.     <div class="swiper mySwiper py-5">
  15.         <div class="swiper-wrapper justify-content-center
  16. ">
  17.             {% for theme in themes %}
  18.                 <div class="swiper-slide">
  19.                     <div class="tech-box text-center p-4 h-100 rounded">
  20.                         <img alt="{{ theme.data['theme'] }}"
  21.                              src="{{ asset(theme.screenshotDir)|imagine_filter('indexThemePrev') }}"
  22.                              class="mb-3"/>
  23.                         <h3 class="tech-title fs-5 text-right"> {{ theme.data['theme'] }}</h3>
  24.                         <p class="tech-desc text-muted small">
  25.                             {% if theme.data['description'] is defined %}
  26.                                 {{ theme.data['description'] }}
  27.                             {% else %}
  28.                                 {{ theme.data['theme'] }}
  29.                             {% endif %}
  30.                         </p>
  31.                         <div class="row">
  32.                             <div class="col-12 mb-3">
  33.                                 <a href="{{ path('app_user_handler') }}" class="btn w-100 btn-primary">انتخاب
  34.                                     و ساخت</a>
  35.                             </div>
  36.                             <div class="col-12 mb-3">
  37.                                 <a href="https://{{ theme.data['slug'] }}.poooshe.com" target="_blank"
  38.                                    class="btn w-100 btn-outline-primary ">پیشنمایش</a>
  39.                             </div>
  40.                         </div>
  42.                     </div>
  43.                 </div>
  44.             {% endfor %}
  45.         </div>
  46.     </div>
  47. </div>
  49. {% block footer %}
  50.     <script>
  51.         var swiper = new Swiper(".mySwiper", {
  52.             slidesPerView: 4,         // تعداد اسلایدهایی که دیده میشه
  53.             spaceBetween: 50,
  54.             loop: true,
  55.             freeMode: true,           // حالت آزاد برای حرکت بدون توقف
  56.             speed: 10000,              // سرعت اسکرول (بیشتر = کندتر حرکت می‌کنه)
  57.             autoplay: {
  58.                 delay: 0,               // تاخیر صفر = حرکت دائمی
  59.                 disableOnInteraction: false,
  60.                 pauseOnMouseEnter: true // وایمیسته وقتی موس بره روش
  61.             },
  62.             breakpoints: {
  63.                 320: {slidesPerView: 2},
  64.                 576: {slidesPerView: 3},
  65.                 768: {slidesPerView: 4},
  66.                 992: {slidesPerView: 5}
  67.             }
  68.         });
  69.     </script>
  70. {% endblock %}