templates/main/default/index.html.twig line 1

Open in your IDE?
  1. {% extends 'main_base.html.twig' %}
  2. {% block title %}{{ baslik.title }}{% endblock %}
  3. {% block description %}{{ baslik.description }}{% endblock %}
  5. {% block content %}
  7.     <style>
  8.         .navbar__section-links__wrapper a {
  9.             color: #718677 !important;
  10.         }
  12.         .navbar__section-links__wrapper :not(.HOME) {
  13.             opacity: 0.4;
  14.         }
  16.         .navbar__section-search__and__onlinecatalog-online-text {
  17.             font-weight: 700;
  18.         }
  20.         .ham__menu-line {
  21.             background-color: #8a9f90 !important;
  22.         }
  24.         .navbar__section-logo__wrapper a h1 {
  25.             color: #44504e;
  26.         }
  29.         .navbar__section-search__and__onlinecatalog-search-text {
  30.             color: #949195;
  31.         }
  33.         .navbar__section-search__and__onlinecatalog-online-border, .navbar__section-search__and__onlinecatalog-search-border {
  34.             background-color: #94919591;
  35.         }
  37.         .navbar__section-links__wrapper a {
  38.             color: #949195;
  39.         }
  41.         .navbar__section-search__and__onlinecatalog-online-text {
  42.             color: #8a9f9091;
  43.         }
  45.         .navbar__section-search__and__onlinecatalog-online-text span {
  46.             color: #8a9f9091;
  47.         }
  50.         canvas {
  51.             background-position: 80% 50%;
  52.         }
  54.         .navbar__section {
  55.             border-bottom: 0px;
  56.         }
  58.         body {
  59.             /*  overflow-x: hidden; */
  60.         }
  62.         .navbar__image {
  63.             background: #f5f5f5;
  64.             z-index: 20 !important;
  65.             background-position: center;
  66.             background-size: cover;
  67.             box-shadow: rgb(255 255 255 / 56%) 0px 22px 70px 4px;
  68.             position: fixed;
  69.             height: 195px;
  70.             top: 0;
  71.             right: 0;
  72.             left: 0;
  73.             bottom: 0;
  75.             transition: all 0.5s;
  76.         }
  78.         .navbar__section-links__wrapper {
  79.             z-index: 10;
  80.         }
  82.         .navbar__section {
  83.             z-index: 10001;
  84.         }
  86.         .navbar__section-container {
  87.             z-index: 10001;
  88.             overflow-x: hidden;
  89.             background-color: transparent !important;
  90.             border-bottom: 0px !important
  91.         }
  93.         .header__section {
  94.             margin-top: 183px;
  95.         }
  97.         .navbar__section-search__and__onlinecatalog-search-icon {
  98.             fill: #949195;
  99.         }
  101.         @media only screen and (max-width: 800px) {
  102.             .navbar__image {
  103.                 height: 100px !important;
  104.             }
  105.         }
  106.     </style>
  107.     <style>
  108.         {#    <div class="intro">#}
  109.         {#        <div class="intro-left">#}
  111.         {#            <div class="intro-left-box">#}
  112.         {#                <img src="{{ asset('assets/main/images/followUs.png') }}" alt="">#}
  113.         {#                <div class="intro-left-text">#}
  114.         {#                    <a href="https://www.instagram.com/elefantevita/"><span class="follow-us-text">{{ 'bizitakipedin'|trans }}</span></a>#}
  115.         {#                </div>#}
  116.         {#            </div>#}
  117.         {#        </div>#}
  119.         {#        <div class="intro-left-mid">#}
  120.         {#            <div class="intro-left-mid-svg">#}
  121.         {#                <div class="svg-box">#}
  122.         {#                    <!--  İğne  -->#}
  123.         {#                    <img class="igne" src="{{ asset('assets/main/images/igne.svg') }}" alt="">#}
  124.         {#                    <!--  İp  -->#}
  125.         {#                    <svg version="1.1" id="ip-svg" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"#}
  126.         {#                         viewBox="0 0 100 300" style="enable-background:new 0 0 100 300;" xml:space="preserve">#}
  128.         {#                        <path d="M13.1,89.9C19.7,71.9,36.9,38.2,60.2,53c4.9,3.2,8.6,7.7,12.1,12.3c15.1,19.8,20.6,46.3,14.9,70.6#}
  129.         {#                c-1.6,6.9-3.8,14.1-7.3,20.3c-6.4,9.9-19.3,26.9-32.6,24.9c-6.4-1.1-10.6-6.8-13.1-12.3c-3.3-7.5-1.3-17,4.4-22.8#}
  130.         {#                c5.9-5.8,15.5-7.1,22.7-3c13.8,9.6,22,34.9,21.5,51.2c-0.1,7.5-1.9,15.1-5.7,21.6c6.9-13.4,5.4-29.5,0.5-43.3#}
  131.         {#                c-3.6-9.7-9-21-17.7-26.9c-7.5-4.1-18.2-0.9-21.7,7c-2.2,4.6-2.8,10.1-0.6,14.8c1.4,3,3.5,6.1,6.1,8.1#}
  132.         {#                c11.4,8.2,26.4-11.6,32.1-20.2c0.7-1.1,1.5-2.2,2-3.4c8.6-18.7,10.4-40.6,4.4-60.3c-3.2-10.5-8.6-20.4-15.5-29#}
  133.         {#                C43.7,33.8,22.3,68.4,13.1,89.9L13.1,89.9z"/>#}
  134.         {#                </svg>#}
  135.         {#                </div>#}
  136.         {#            </div>#}
  139.         {#            <img src="{{ asset('assets/main/images/elefante1.png') }}" class="intro-left-content-img" alt="Elefante">#}
  140.         {#            <div class="intro-left-mid-line-wrapper">#}
  141.         {#                <div class="intro-left-mid-line">#}
  142.         {#                    <span>NEW</span>#}
  143.         {#                    <span>2023</span>#}
  144.         {#                </div>#}
  145.         {#                <div class="intro-left-mid-line-1">#}
  146.         {#                    <span>DNTL - 8</span>#}
  147.         {#                </div>#}
  148.         {#            </div>#}
  149.         {#        </div>#}
  151.         {#        <div class="intro-right">#}
  152.         {#            <div class="intro-right-frame intro-right-frame-top"></div>#}
  153.         {#            <div class="intro-right-frame intro-right-frame-mid-top"></div>#}
  154.         {#            <div class="intro-right-frame intro-right-frame-image"><img src="{{ asset('assets/main/images/elefante-frame.svg') }}" alt=""></div>#}
  155.         {#            <div class="intro-right-frame intro-right-frame-mid-down"></div>#}
  156.         {#            <div class="intro-right-frame intro-right-frame-down"></div>#}
  157.         {#            <div class="mainSwiper-text-content">#}
  158.         {#                <p class="animatetext-mainswiper" data-aos="fade-up" data-aos-duration="500" data-aos-easing="linear">{{ bolumler[0].metin|raw }}</p>#}
  159.         {#            </div>#}
  160.         {#            <div class="swiper mainSwiper">#}
  161.         {#                <div class="swiper-wrapper">#}
  162.         {#                    {% for resim in bolumler[0].anasayfaBolum.resimler|filter(r => r.del == 0)|sort((a,b) => a.sira > b.sira) %}#}
  163.         {#                        <div class="swiper-slide"><img src="{{ asset('uploads/anasayfa/' ~ resim.resim) }}" alt=""></div>#}
  164.         {#                    {% endfor %}#}
  165.         {#                </div>#}
  166.         {#            </div>#}
  167.         {#            <div class="intro-right-indicators">#}
  168.         {#                <div class="intro-right-indicators-prev swiper-button-prev"><i class="fas fa-long-arrow-left"></i></div>#}
  169.         {#                <div class="intro-right-indicators-next swiper-button-next"><i class="fas fa-long-arrow-right"></i>#}
  170.         {#                </div>#}
  171.         {#            </div>#}
  172.         {#        </div>#}
  173.         {#    </div>#}
  174.         {#    <div class="cotton-svg">#}
  175.         {#        <img  src="{{ asset('assets/main/images/cotton.svg') }}" alt="">#}
  176.         {#    </div>#}
  177.         {#    <div class="cotton-svg-1">#}
  178.         {#        <img src="{{ asset('assets/main/images/cotton.svg') }}" alt="">#}
  179.         {#    </div>#}
  180.         {#    <div class="cotton-svg-2">#}
  181.         {#        <img src="{{ asset('assets/main/images/cotton.svg') }}" alt="">#}
  182.         {#    </div>#}
  183.         {#    <div id="main">#}
  184.         {#        <div class="home-textiles">#}
  185.         {#            <div class="intro-left-box-count"><span>01</span></div>#}
  186.         {#            <h1 class="main-header">{{ 'anasayfa.evtekstili'|trans }}</h1>#}
  187.         {#            <hr class="main-header-line">#}
  188.         {#            <div class="ev-tekstili-content">#}
  189.         {#                <div class="ev-tekstili" data-aos="fade-up" data-aos-duration="400"  data-aos-delay="300">#}
  190.         {#                    <h2>{{ bolumler[1].baslik }}</h2>#}
  191.         {#                    {{ bolumler[1].metin|raw }}#}
  192.         {#                </div>#}
  193.         {#                <div class="ev-tekstili" data-aos="fade-up" data-aos-duration="400"  data-aos-delay="500">#}
  194.         {#                    <h2>{{ bolumler[2].baslik }}</h2>#}
  195.         {#                    {{ bolumler[2].metin|raw }}#}
  196.         {#                </div>#}
  197.         {#                <div class="ev-tekstili" data-aos="fade-up" data-aos-duration="400"  data-aos-delay="700">#}
  198.         {#                    <h2>{{ bolumler[3].baslik }}</h2>#}
  199.         {#                    {{ bolumler[3].metin|raw }}#}
  200.         {#                </div>#}
  201.         {#            </div>#}
  202.         {#            <button class="global-btn" data-aos="fade-zoom-in" data-aos-duration="400" data-aos-delay="900"><a#}
  203.         {#                        href="{{ path('app_main_hakkimizda') }}">{{ 'anasayfa.inceleyin'|trans }}</a></button>#}
  204.         {#        </div>#}
  205.         {#        <div class="home-collection">#}
  207.         {#            <div class="home-collection-video">#}
  208.         {#                <div class="home-collection-video-content">#}
  209.         {#                    <video id="collection-video" class="collection-video" muted="" loop="">#}
  210.         {#                        <source src="{{ asset('assets/main/videos/elefante.mp4') }}" type="video/mp4">#}
  211.         {#                        Your browser does not support the video tag.#}
  212.         {#                    </video>#}
  213.         {#                    <div class="collection-video-bg"></div>#}
  214.         {#                </div>#}
  216.         {#                <div class="home-collection-video-image" data-aos="fade-zoom-in" data-aos-duration="500" data-aos-easing="linear">#}
  217.         {#                    <img src="{{ asset('assets/main/images/homeCollection.png') }}" alt="">#}
  218.         {#                </div>#}
  219.         {#            </div>#}
  220.         {#            <div class="home-collection-image"><img src="{{ asset('assets/main/images/ip-2.webp') }}" alt=""></div>#}
  221.         {#        </div>#}
  222.         {#        <div class="production">#}
  223.         {#            <div class="production-content">#}
  225.         {#                <div class="production-image">#}
  226.         {#                    <div class="swiper productionSwiper">#}
  227.         {#                        <div class="swiper-wrapper">#}
  228.         {#                            <div class="swiper-slide"><img src="{{ asset('uploads/anasayfa/' ~ bolumler[5].anasayfaBolum.resimler|filter(r => r.del == 0)|first.resim) }}" alt=""></div>#}
  229.         {#                            <div class="swiper-slide"><img src="{{ asset('uploads/anasayfa/' ~ bolumler[6].anasayfaBolum.resimler|filter(r => r.del == 0)|first.resim) }}" alt=""></div>#}
  230.         {#                            <div class="swiper-slide"><img src="{{ asset('uploads/anasayfa/' ~ bolumler[7].anasayfaBolum.resimler|filter(r => r.del == 0)|first.resim) }}" alt=""></div>#}
  231.         {#                            <div class="swiper-slide"><img src="{{ asset('uploads/anasayfa/' ~ bolumler[8].anasayfaBolum.resimler|filter(r => r.del == 0)|first.resim) }}" alt=""></div>#}
  232.         {#                        </div>#}
  233.         {#                    </div>#}
  234.         {#                </div>#}
  236.         {#                <div class="production-content-text">#}
  237.         {#                    <div class="production-header" data-aos="fade-left" data-aos-duration="600"  data-aos-delay="300">{{ bolumler[4].baslik }}</div>#}
  238.         {#                    <div class="production-text" data-aos="fade-left" data-aos-duration="600"  data-aos-delay="400">#}
  239.         {#                        {{ bolumler[4].metin|raw }}#}
  240.         {#                    </div>#}
  241.         {#                    <button data-aos="fade-left" data-aos-duration="600" data-aos-delay="500" class="global-btn"><a#}
  242.         {#                                href="{{ path('app_main_uretim') }}">{{ 'anasayfa.uretimbloglerimiz'|trans }}</a></button>#}
  243.         {#                </div>#}
  244.         {#            </div>#}
  245.         {#        </div>#}
  246.         {#        <div class="production-items-wrapper">#}
  247.         {#            <div class="production-items">#}
  248.         {#                <div class="production-item" data-aos="fade-up" data-aos-duration="300" data-aos-easing="linear" data-aos-delay="300">#}
  249.         {#                    <div class="production-item-number">01.</div>#}
  250.         {#                    <div class="production-item-header">{{ bolumler[5].baslik }}</div>#}
  251.         {#                    <div class="production-item-text">{{ bolumler[5].metin|raw }}</div>#}
  252.         {#                    <div class="production-item-bg"></div>#}
  253.         {#                </div>#}
  254.         {#                <div class="production-item" data-aos="fade-up" data-aos-duration="300" data-aos-easing="linear" data-aos-delay="500">#}
  255.         {#                    <div class="production-item-number">02.</div>#}
  256.         {#                    <div class="production-item-header">{{ bolumler[6].baslik }}</div>#}
  257.         {#                    <div class="production-item-text">{{ bolumler[6].metin|raw }}</div>#}
  258.         {#                    <div class="production-item-bg"></div>#}
  259.         {#                </div>#}
  260.         {#                <div class="production-item" data-aos="fade-up" data-aos-duration="300" data-aos-easing="linear" data-aos-delay="700">#}
  261.         {#                    <div class="production-item-number">03.</div>#}
  262.         {#                    <div class="production-item-header">{{ bolumler[7].baslik }}</div>#}
  263.         {#                    <div class="production-item-text">{{ bolumler[7].metin|raw }}</div>#}
  264.         {#                    <div class="production-item-bg"></div>#}
  265.         {#                </div>#}
  266.         {#                <div class="production-item" data-aos="fade-up" data-aos-duration="300" data-aos-easing="linear" data-aos-delay="900">#}
  267.         {#                    <div class="production-item-number">04.</div>#}
  268.         {#                    <div class="production-item-header">{{ bolumler[8].baslik }}</div>#}
  269.         {#                    <div class="production-item-text">{{ bolumler[8].metin|raw }}</div>#}
  270.         {#                    <div class="production-item-bg"></div>#}
  271.         {#                </div>#}
  272.         {#            </div>#}
  273.         {#        </div>#}
  274.         {#        <div class="duvet-cover">#}
  275.         {#            <div class="duvet-cover-content">#}
  276.         {#                <div class="duvet-cover-header" data-aos="fade-right" data-aos-duration="600"  data-aos-delay="300">#}
  277.         {#                    {{ bolumler[9].baslik }}#}
  278.         {#                </div>#}
  279.         {#                <div class="duver-cover-text" data-aos="fade-right" data-aos-duration="600"  data-aos-delay="400">#}
  280.         {#                    {{ bolumler[9].metin|raw }}#}
  281.         {#                </div>#}
  282.         {#                <div class="duvet-cover-btn" data-aos="fade-right" data-aos-duration="600"  data-aos-delay="500">#}
  283.         {#                    <button class="global-btn"><a href="#">{{ 'anasayfa.urungruplari'|trans }}</a></button>#}
  284.         {#                </div>#}
  285.         {#            </div>#}
  286.         {#            <div class="duvet-cover-images">#}
  287.         {#                <div class="duvet-cover-image-1">#}
  288.         {#                    <div class="swiper duvetCoverSwiper1">#}
  289.         {#                        <div class="swiper-wrapper">#}
  290.         {#                            <div class="swiper-slide"><img src="{{ asset('uploads/anasayfa/' ~ bolumler[9].anasayfaBolum.resimler|filter(r => r.del == 0)|first.resim) }}" alt=""></div>#}
  291.         {#                        </div>#}
  292.         {#                    </div>#}
  293.         {#                </div>#}
  294.         {#                <div class="duvet-cover-image-2">#}
  295.         {#                    <div class="swiper duvetCoverSwiper2">#}
  296.         {#                        <div class="swiper-wrapper">#}
  297.         {#                            {% for resim in bolumler[9].anasayfaBolum.resimler|filter(r => r.del == 0)|sort((a,b) => a.sira > b.sira) %}#}
  298.         {#                                {% if loop.index != 1 %}#}
  299.         {#                                    <div class="swiper-slide"><img src="{{ asset('uploads/anasayfa/' ~ resim.resim) }}" alt=""></div>#}
  300.         {#                                {% endif %}#}
  301.         {#                            {% endfor %}#}
  302.         {#                        </div>#}
  303.         {#                    </div>#}
  304.         {#                </div>#}
  305.         {#            </div>#}
  306.         {#        </div>#}
  307.         {#        <div class="communication">#}
  308.         {#            <div class="communication-box">#}
  309.         {#                <img src="{{ asset('assets/main/images/irtibat.webp') }}" alt="">#}
  310.         {#                <div class="communication-box-content">#}
  311.         {#                    <div class="communication-box-content-header" data-aos="fade-down" data-aos-duration="600"  data-aos-delay="500">{{ 'anasayfa.irtibatagecin'|trans }}</div>#}
  312.         {#                    <div class="communication-box-content-text" data-aos="fade-down" data-aos-duration="600"  data-aos-delay="500">#}
  313.         {#                        {{ 'anasayfa.irtibataltmetin'|trans }}#}
  314.         {#                    </div>#}
  315.         {#                    <div class="communication-box-content-email" data-aos="fade-down" data-aos-duration="600"  data-aos-delay="500">E-Posta : {{ adresler[0].email }}</div>#}
  316.         {#                    <div class="communication-box-content-number" data-aos="fade-down" data-aos-duration="600"  data-aos-delay="500">{{ adresler[0].telefonlar|first.telefon }}</div>#}
  317.         {#                    <div class="communication-box-content-button" data-aos="fade-down" data-aos-duration="600"  data-aos-delay="500">#}
  318.         {#                        <button class="global-btn"><a href="{{ adresler[0].harita }}" target="_blank">{{ 'anasayfa.haritadagoruntule'|trans }}</a></button>#}
  319.         {#                    </div>#}
  320.         {#                </div>#}
  321.         {#            </div>#}
  322.         {#        </div>#}
  323.         {#    </div> #}</style>
  324. <div id="mainpage">
  326.     {% include 'main/default/loader.html.twig' %}
  327.     {% include 'main/default/cookie.html.twig' %}
  328.     <div class="main-container">
  329.         <header class="header__section swiper headerSwiper">
  330.             <div class="swiper-wrapper mainSliderWrapper">
  331.                 {% for entityx in entities %}
  332.                     <div class="swiper-slide swiper-slide-{{ loop.index }}">
  333.                         {% if entityx.sResim %}
  334.                             <img src="{{ asset('uploads/anasayfa/anasayfaSlider/slider/' ~ entityx.sResim) }}"
  335.                                  alt="header__photo">
  336.                         {% endif %}
  337.                         <div class="header__section-slider-title-wrapper">
  338.                             <div class="header__section-slider-title">{{ entityx.baslik }}</div>
  339.                             <svg xmlns="http://www.w3.org/2000/svg" id="elefante__text" data-name="katman 1"
  340.                                  viewBox="0 0 610.42 243.91">
  341.                                 <defs>
  342.                                     <style>
  343.                                         .cls-1 {
  344.                                             fill: none;
  345.                                         }
  346.                                     </style>
  347.                                 </defs>
  348.                                 <g xmlns="http://www.w3.org/2000/svg">
  349.                                     <path class="full__path"
  350.                                           d="M4.49,115.42l47.21-30.2c.94-.6,1.52-3.06,.41-3.08-8.05-.08-32.04,5.12-49.96,37.2C.87,121.65,.06,124.24,0,126.89c-.72,36.03,132.03-58.33,172.49-107.47,1.99,1.89-18.33-19.89-91,184,0,0,.75,5.78,5.38-5.11"/>
  351.                                     <path class="full__path"
  352.                                           d="M141.49,115.42l47.21-30.2c.94-.6,1.52-3.06,.41-3.08-8.05-.08-32.04,5.12-49.96,37.2-1.29,2.31-2.1,4.9-2.15,7.55,0,0-4.51,28.53,82.67-13.83"/>
  353.                                     <path class="full__path"
  354.                                           d="M269.08,43.23l7.8-22.64c.11-.31-.33-.51-.49-.23l-100.15,168.69c-4.47,7.53-7.82,15.68-9.95,24.18l-2.71,9.83c-.22,.86,.1,1.75,.72,2.53,1.97,2.48,5.83,2.28,7.79-.21l9.41-11.97s24.01-33.79,24.38-60.66c.06-4.13-1.25-8.22-4.03-11.27-11.32-12.43-37.35-7.07-37.35-7.07l113.25-19.49"/>
  355.                                     <path class="full__path"
  356.                                           d="M309.49,111.42s-13.59-13.25-41.3,10.88c-11.7,10.12-5.96,13.99-5.96,13.99,0,0,3.26,8.13,55.26-30.87,6-3-8,16-4,25,4.64,7.53,16.25,3.78,25.21-.71,6.72-3.37,12.62-8.17,17.38-13.99l24.49-29.94c.11-.14,.32,.02,.22,.17l-46.3,68.48s42-56,64-62c52-18-69,95,50,22"/>
  357.                                     <path class="full__path"
  358.                                           d="M515.22,21.86L525.35,.42c.16-.33-.31-.59-.51-.29l-160.64,240.96c-1.01,1.52,.6,3.4,2.26,2.64l5.85-2.7"/>
  359.                                     <path class="full__path"
  360.                                           d="M468.49,115.42l47.21-30.2c.94-.6,1.52-3.06,.41-3.08-8.05-.08-32.04,5.12-49.96,37.2-1.29,2.31-2.1,4.9-2.15,7.55,0,0-4.51,28.53,82.67-13.83"/>
  361.                                     <path class="full__path"
  362.                                           d="M610.39,42.56s8.1-47.14-235.9,17.86c-25,6-9,11-9,11"/>
  364.                                 </g>
  365.                             </svg>
  366.                         </div>
  367.                     </div>
  368.                 {% endfor %}
  369.             </div>
  370.         </header>
  371.         <section class="company__information__section">
  372.             <div class="company__information__section-about__company">
  373.                 <div class="company__information__section-about__company-img__section">
  376.                     {% for resim in bolumler[0].anasayfaBolum.resimler|filter(r => r.del == 0)|sort((a,b) => a.sira > b.sira) %}
  377.                         <img class="company__information__section-about__company-img__section-img {% if loop.last %}lastactive{% endif %}"
  378.                              src="{{ asset('uploads/anasayfa/' ~ resim.resim) }}" alt="about-company-main-image">
  379.                     {% endfor %}
  380.                 </div>
  381.                 <div class="company__information__section-about__company-text__section">
  382.                     <div class="company__information__section-about__company-text__section-photos">
  383.                         <img src="{{ asset('uploads/ayarlar/referans/' ~ ayarlar.referans) }}"
  384.                              alt="references-logo">
  385.                     </div>
  386.                     <h3>{{ bolumler[0].baslik|raw }}</h3>
  388.                     <button class="company__information__section-about__company-text__section-button">
  389.                         <a href="{{ bolumler[0].altBaslik|raw }}"><h5>EXPLORE</h5>
  390.                             <img src="{{ asset('assets/main/images/main-page/right-arrow.svg    ') }}"
  391.                                  alt="right-arrow">
  392.                         </a>
  393.                     </button>
  394.                 </div>
  395.             </div>
  396.             <div class="company__information__section-about__company__clauses-section">
  397.                 {% for production in uretim %}
  398.                     <a class="company__information__section-about__company__clauses__wrapper" href="">
  399.                         <div class="company__information__section-about__company__clauses ">
  400.                             <span>0{{ loop.index }}</span>
  401.                             {% for entityx in production.diller %}
  402.                                 <h3>{{ entityx.baslik|raw }}</h3>
  403.                             {% endfor %}
  406.                             {% for entityx in production.diller %} <p>{{ entityx.metin|raw }}</p>  {% endfor %}
  407.                             <div class="company__information__section-about__company__clauses-mousetracker"><img
  408.                                         src="{{ asset('assets/main/images/main-page/right-arrow.svg') }}"
  409.                                         alt="right-arrow"></div>
  410.                         </div>
  411.                     </a>
  414.                 {% endfor %}
  415.             </div>
  416.             <div class="company__information__section-about__company__clauses-section__responsive swiper productionSwiper">
  417.                 <div class="swiper-wrapper">
  418.                     <a href="<?php echo $baseUrl?>production#weaving"
  419.                        class="company__information__section-about__company__clauses__wrapper__responsive swiper-slide">
  420.                         <div class="company__information__section-about__company__clauses__responsive">
  421.                             <span>01.</span>
  422.                             <h3>Weaving</h3>
  423.                             <p>Our focus is to meticulously weave our fabrics using the highest quality Turkish
  424.                                 cotton on traditional looms, combining them with unique patterns and textures that
  425.                                 tell a story. Woven with Turkish cotton, our fabrics aim to provide a top-tier
  426.                                 experience in terms of quality, durability, and aesthetics. This special weaving
  427.                                 technique reflects our commitment to creating high-quality and distinctive textile
  428.                                 products by bringing together the heritage of the past with the present.
  429.                             </p>
  430.                             <div class="company__information__section-about__company__clauses-mousetracker"><img
  431.                                         src="assets/main-page/right-arrow.svg" alt="right-arrow"></div>
  432.                         </div>
  433.                     </a>
  434.                     <a href="<?php echo $baseUrl?>production#confection"
  435.                        class="company__information__section-about__company__clauses__wrapper__responsive swiper-slide">
  436.                         <div class="company__information__section-about__company__clauses__responsive">
  437.                             <span>02.</span>
  438.                             <h3>Confection</h3>
  439.                             <p>The fabrics we attentively produce undergo a transformation into stylish and timeless
  440.                                 products in the hands of artisans, blending both traditional and modern techniques.
  441.                                 Each stitch comes to life with careful attention in a simple narrative, bringing
  442.                                 forth an elegant charm adorned with graceful details. Throughout this process,
  443.                                 design, measurements, stitching, and enchanting touches give our products their
  444.                                 final form.
  445.                             </p>
  446.                             <div class="company__information__section-about__company__clauses-mousetracker"><img
  447.                                         src="assets/main-page/right-arrow.svg" alt="right-arrow"></div>
  448.                         </div>
  449.                     </a>
  450.                     <a href="<?php echo $baseUrl?>production#embroidery"
  451.                        class="company__information__section-about__company__clauses__wrapper__responsive swiper-slide">
  452.                         <div class="company__information__section-about__company__clauses__responsive">
  453.                             <span>03.</span>
  454.                             <h3>Embroidery</h3>
  455.                             <p>In our workshop, we can bring to life special designs adorned with various embroidery
  456.                                 techniques. We stand out with our creativity in the art of embroidery, bringing
  457.                                 unique embellishments that cater to every taste onto our high-quality fabrics.
  458.                             </p>
  459.                             <div class="company__information__section-about__company__clauses-mousetracker"><img
  460.                                         src="assets/main-page/right-arrow.svg" alt="right-arrow"></div>
  461.                         </div>
  462.                     </a>
  463.                     <a href="<?php echo $baseUrl?>production#print"
  464.                        class="company__information__section-about__company__clauses__wrapper__responsive swiper-slide">
  465.                         <div class="company__information__section-about__company__clauses__responsive">
  466.                             <span>04.</span>
  467.                             <h3>Print</h3>
  468.                             <p>We create unique designs by using various printing techniques on our products.
  469.                                 Different printing methods add diversity and uniqueness to our products.
  470.                             </p>
  471.                             <div class="company__information__section-about__company__clauses-mousetracker"><img
  472.                                         src="assets/main-page/right-arrow.svg" alt="right-arrow"></div>
  473.                         </div>
  474.                     </a>
  475.                 </div>
  476.                 <div class="company__information__section-about__company__clauses-section__responsive-button__next">
  477.                 </div>
  478.                 <div class="company__information__section-about__company__clauses-section__responsive-button__prev">
  479.                 </div>
  480.             </div>
  481.         </section>
  482.         <section class="about__our__products__section">
  483.             <div class="about__our__products__section-woman__img">
  484.                 {% for imageOne in urunKategorileriResim %}
  485.                     <img class="about__our__products__section-woman__img-img"
  486.                          src="{{ asset('uploads/urunkategorileri/banner/' ~ imageOne.resim) }}">
  487.                 {% endfor %}
  488.             </div>
  489.             <div class="about__our__products__section-title__section">
  490.                 <h4>BROWSE COLLECTION</h4>
  491.                 <div class="about__our__products__section-title__section-clickable">
  492.                     {% for indexr in urunkategorileri %}
  493.                         {% for index in indexr.diller %}
  494.                             <a href="{{ path('app_main_urun_gruplari_detay',{'code': indexr.code }) }}"><button>{{ index.baslik }}</button></a>
  496.                         {% endfor %}
  497.                     {% endfor %}
  498.                 </div>
  499.             </div>
  500.             <div class="about__our__products__section-cotton__img">
  501.                 {% for imageOne in urunKategorileriResim2 %}
  502.                     <img class="about__our__products__section-cotton__img-img"
  503.                          src="{{ asset('uploads/urunkategorileri/banner/' ~ imageOne.resim) }}"></img>
  504.                 {% endfor %}
  505.             </div>
  506.         </section>
  507.         <div class="video__main__sectionr">
  508.             <div class="video__main__section">
  509.                 <section class="video__section video__section-items__wrapper">
  510.                     <div class="video__section-items__wrapper">
  512.                         {{ ayarlar.video|raw }}
  513.                         <button class="video__section-items__wrapper-button gizle">
  514.                         </button>
  515.                     </div>
  517.                 </section>
  519.             </div>
  520.         </div>
  521.         <!-- <section class="gallery__section__wgsap">
  522.             <div class="gallery__section__wgsap-square"></div>
  523.             <div class="gallery__section__wgsap-square2"></div>
  524.         </section> -->
  525.         <section class="gallery__section">
  526.             <div class="gallery__section-top__middle__section">
  527.                 <div class="gallery__section__photos-main__wrapper">
  528.                     {% for entity in bolumler[1].anasayfaBolum.resimler|filter(r => r.del == 0)|sort((a,b) => a.sira > b.sira) %}
  529.                         <div class="gallery__section__photos-wrapper">
  530.                             <div class="gallery__section__photos"
  531.                                  style="background-image: url({{ asset('uploads/anasayfa/' ~ entity.resim) }});"></div>
  532.                         </div>
  533.                     {% endfor %}
  534.                 </div>
  535.             </div>
  536.             <div class="gallery__section-bottom">
  537.                 <div class="gallery__section-bottom-followus">
  538.                     <div class="gallery__section-bottom-followus-text">
  539.                         <h4>SOCIAL MEDIA</h4>
  540.                         <h3><a href="{{ bolumler[2].altBaslik }}">{{ bolumler[2].baslik|raw }}</a></h3>
  542.                         <p>{{ bolumler[2].metin|raw }}
  543.                         </p>
  544.                         <a href="{{ bolumler[2].altBaslik }}">
  545.                             <button><h5>FOLLOW US</h5>
  546.                                 <img src="{{ asset('assets/main/images/main-page/right-arrow.svg') }}"
  547.                                      alt="right-arrow"></button>
  548.                         </a>
  549.                     </div>
  550.                     {% for entity in bolumler[2].anasayfaBolum.resimler|filter(r => r.del == 0)|sort((a,b) => a.sira > b.sira)|slice(0, 1) %}
  551.                         <div class="gallery__section-bottom-followus-photo">
  552.                             <img src="{{ asset('uploads/anasayfa/' ~ entity.resim) }}" alt="">
  553.                         </div>
  554.                     {% endfor %}
  556.                 </div>
  557.                 <div class="gallery__section-bottom-right">  {% for entity in bolumler[2].anasayfaBolum.resimler|filter(r => r.del == 0)|sort((a,b) => a.sira > b.sira)|slice(1, 1) %}
  559.                         <div class="gallery__section__middle__right__photo-2"><img
  560.                                     src="{{ asset('uploads/anasayfa/' ~ entity.resim) }}"
  561.                                     alt="gallery__section__middle__right__photo-2"></div>
  562.                     {% endfor %} </div>
  563.             </div>
  564.         </section>
  565.     </div>
  566.     {% include 'main/default/new-catalogue.html.twig' %}
  567.     {% endblock %}
  568.     {% block body_js %}
  569.     {% include 'main/default/scripts.html.twig' %}
  570.     <script>
  571.         const checkAndOpenClick = (param) => {
  573.             if (window.innerWidth >= 1200) {
  574.                 switch (param) {
  575.                     case 1:
  576.                         window.location.href = "<?php echo $baseUrl?>products";
  577.                         break;
  578.                     case 2:
  579.                         window.location.href = "<?php echo $baseUrl?>products";
  580.                         break;
  581.                     case 3:
  582.                         window.location.href = "<?php echo $baseUrl?>products";
  583.                         break;
  584.                     case 4:
  585.                         window.location.href = "<?php echo $baseUrl?>products";
  586.                         break;
  588.                 }
  589.             }
  590.         }
  592.         const mainPageProductionSection = document.querySelectorAll(".company__information__section-about__company__clauses__wrapper");
  593.         const mainPageProductionSectionClauses = document.querySelectorAll(".company__information__section-about__company__clauses");
  594.         const mainPageProductionSectionImg = document.querySelectorAll(".company__information__section-about__company-img__section-img");
  595.         const mainPageProductionSectionImgMain = document.querySelector(".company__information__section-about__company-img__section-img-main");
  596.         const mainPageProductionSectionWrapper = document.querySelector(".company__information__section-about__company__clauses-section");
  598.         const lastIndex = mainPageProductionSectionImg.length - 1;
  599.         const lastEl = mainPageProductionSectionImg[lastIndex]
  601.         mainPageProductionSection.forEach((item, index) => {
  602.             item.addEventListener("mouseover", () => {
  603.                 mainPageProductionSectionImg[index].classList.add("active");
  604.                 mainPageProductionSection.forEach((otherItem, otherIndex) => {
  605.                     if (otherIndex !== index) {
  606.                         mainPageProductionSectionImg[otherIndex].classList.remove("active")
  607.                         lastEl.classList.remove("lastactive")
  608.                     }
  609.                 })
  610.             })
  612.             mainPageProductionSectionClauses.forEach((item, index) => {
  613.                 item.addEventListener("mouseout", () => {
  614.                     console.log("hallo")
  615.                     lastEl.classList.add("lastactive")
  616.                     mainPageProductionSectionImg.forEach((item, index) => {
  617.                         item.classList.remove("active");
  620.                     })
  621.                 })
  622.             })
  625.         })
  626.     </script>
  627.     <script>
  628.         var productionSwiper = new Swiper(".productionSwiper", {
  629.             loop: true,
  630.             autoplay: {
  631.                 delay: 4000,
  632.                 disableOnInteraction: false,
  633.             },
  634.             navigation: {
  635.                 nextEl: ".company__information__section-about__company__clauses-section__responsive-button__next",
  636.                 prevEl: ".company__information__section-about__company__clauses-section__responsive-button__prev",
  637.             },
  638.         });
  639.         document.addEventListener('DOMContentLoaded', function () {
  642.             const swiperText = new Swiper(".headerText", {
  643.                 // Diğer Swiper ayarları...
  644.                 centeredSlides: true,
  645.                 loop: true,
  646.                 autoplay: {
  647.                     delay: 7000,
  648.                     disableOnInteraction: false,
  649.                 },
  651.                 scrollbar: {
  652.                     el: ".swiper-scrollbar",
  653.                     hide: true,
  654.                 },
  655.                 navigation: {
  656.                     nextEl: ".header-swiper-button-next",
  657.                 },
  658.                 on: {
  659.                     init: function () {
  660.                         let isFirstSlideChange = true;
  661.                         // Swiper nesnesi oluşturulduktan sonra slideChange olayını dinle
  662.                         this.on('slideChange', function () {
  663.                             if (isFirstSlideChange) {
  664.                                 // Düzeltme burada
  665.                                 const currentIndex = this.realIndex;
  668.                                 // Bayrağı kapat
  669.                                 isFirstSlideChange = false;
  670.                             }
  672.                             // Düzeltme burada
  673.                         });
  674.                     }
  675.                 },
  676.             });
  677.             const addClassToPath = (path) => {
  678.                 path.classList.add("active");
  679.             }
  680.             const swiper = new Swiper(".headerSwiper", {
  681.                 // Diğer Swiper ayarları...
  682.                 centeredSlides: true,
  683.                 loop: true,
  684.                 autoplay: {
  685.                     delay: 7000,
  686.                     disableOnInteraction: false,
  687.                 },
  688.                 scrollbar: {
  689.                     el: ".swiper-scrollbar",
  690.                     hide: true,
  691.                 },
  692.                 navigation: {
  693.                     nextEl: ".header-swiper-button-next",
  694.                 },
  695.                 on: {
  696.                     autoplayStart: function () {
  697.                     },
  698.                     slideChange: function () {
  699.                         const slides = document.querySelectorAll(".header__section .swiper-wrapper .swiper-slide");
  700.                         slides.forEach((item) => {
  701.                             if (!item.classList.contains("swiper-slide-active")) {
  702.                                 const itemPaths = item.querySelectorAll(".header__section-slider-title-wrapper svg g .full__path")
  703.                                 itemPaths.forEach((path) => {
  704.                                     path.classList.remove("active");
  705.                                 })
  706.                             }
  707.                         })
  708.                         /*
  709.                                             animPaths.forEach((path) => {
  710.                                                 path.classList.remove("active");
  711.                                             }) */
  712.                         setTimeout(() => {
  713.                             const sliderImgActive = document.querySelector(".header__section .swiper-wrapper .swiper-slide-active img");
  714.                             sliderImgActive.style.filter = "blur(0)";
  715.                             sliderImgActive.style.transform = "scale(1)";
  716.                         }, 500);
  717.                         setTimeout(() => {
  718.                             const animPaths = document.querySelectorAll(".header__section .swiper-wrapper .swiper-slide-active .header__section-slider-title-wrapper svg g .full__path");
  719.                             animPaths.forEach((path, index) => {
  720.                                 setTimeout(() => {
  721.                                     addClassToPath(path);
  722.                                 }, index * 500);
  723.                             })
  724.                         }, 600)
  725.                     }
  726.                 },
  727.                 controller: {
  728.                     control: ".headerText", // Görüntü Slider'ını kontrol et
  729.                 },
  730.                 simulateTouch: true,
  731.             });
  732.             var animPaths = document.querySelectorAll('.full__path');
  733.             const sliderImg = document.querySelectorAll(".header__section .swiper-wrapper .swiper-slide img");
  734.             swiper.on('touchMove', function () {
  735.                 sliderImg.forEach((item) => {
  736.                     item.style.filter = "blur(4px)";
  737.                     item.style.transform = "scale(1.3)";
  738.                 })
  739.                 animPaths.forEach((path) => {
  740.                     path.classList.remove("active");
  741.                 })
  742.             });
  743.             swiper.on("touchEnd", () => {
  744.             })
  745.         })
  746.     </script>
  748.     <script>
  749.         document.addEventListener("DOMContentLoaded", function () {
  752.             const animPaths = document.querySelectorAll(".header__section .swiper-wrapper .swiper-slide-active .header__section-slider-title-wrapper svg g .full__path");
  753.             setTimeout(() => {
  754.                 const sliderImgActive = document.querySelector(".header__section .swiper-wrapper .swiper-slide-active img");
  755.                 sliderImgActive.style.filter = "blur(0)";
  756.                 sliderImgActive.style.transform = "scale(1)";
  757.             }, 800)
  758.             animPaths.forEach((path) => {
  759.                 path.classList.remove("active");
  760.             })
  761.             const addClassToPath = (path) => {
  762.                 path.classList.add("active");
  763.             }
  764.             setTimeout(() => {
  765.                 animPaths.forEach((path, index) => {
  766.                     setTimeout(() => {
  767.                         addClassToPath(path);
  768.                     }, index * 500);
  769.                 })
  770.             }, 600)
  771.         })
  775.         document.addEventListener("DOMContentLoaded", function() {
  776.             var firstAnchor = document.querySelector('.about__our__products__section-title__section-clickable a');
  777.             if (firstAnchor) {
  778.                 var buttonInsideAnchor = firstAnchor.querySelector('button');
  779.                 if (buttonInsideAnchor) {
  780.                     buttonInsideAnchor.classList.add('active');
  781.                 }
  782.             }
  784.             var firstWomanImg = document.querySelector('.about__our__products__section-woman__img img');
  785.             if (firstWomanImg) {
  786.                 firstWomanImg.classList.add('active');
  787.             }
  789.             var firstCottonImg = document.querySelector('.about__our__products__section-cotton__img img');
  790.             if (firstCottonImg) {
  791.                 firstCottonImg.classList.add('active');
  792.             }
  793.         });
  795.     </script>
  798. </div>
  800. {% endblock %}