[viewBag]
==
{% partial "profile/parallax" userProfile=userProfile %}


 

<section class="shop_grid_area section_padding_50">
    <div class="container" style="max-width: 1600px !important;">   
    <div class="shop_top_sidebar_area">
        <div class="row">
       
            
            <div class="col-md-12">
            
             <a href="{{ 'user-profile'|page({id: userProfile.id, slug: ''}) }}" class="tagCat {{ currentC == 'Hemme Harytlar' ? 'activeCat' : '' }}"> Hemmesi</a>
             {% for category in categories %}
                <a href="{{ 'user-profile'|page({id: userProfile.id, slug: category.slug}) }}" class="tagCat {{ category.slug == slugq ? 'activeCat' : '' }}"> {{ category.name }}</a>
             {% endfor %}
            
            </div>
        </div>
    </div>
 {% partial "profile/modal" userProfile=userProfile %}
<div class="row">
            <div class="col-12">
                <!-- Shop Top Sidebar -->
                <div class="shop_top_sidebar_area d-flex flex-wrap align-items-center justify-content-between">
                    <div class="row" style="width: 100%">
                        <div class="col-8" style="margin: auto;">
                            {{currentC}}
                        </div>
                        <div class="col-4">
                            <form id="sortOptionUserProfile" method="GET"></form>
                                <select class="form-control" onchange="sortHandle()" id="sort_input">
                                    <option value="">Saýlanmadyk</option>
                                    <option value="-price" {% if input('sort') == '-price' %} selected {% endif %}>Gymmatdan arzana</option>
                                    <option value="price" {% if input('sort') == 'price' %} selected {% endif %}>Arzandan gymmada</option>
                                    <option value="-created_at" {% if input('sort') == '-created_at' %} selected {% endif %}>Täzeden könä</option>
                                    <option value="created_at" {% if input('sort') == 'created_at' %} selected {% endif %}>Köneden täzä</option>
                                </select>
                            </form>
                        </div>
                    </div>


                </div>

                <div class="shop_grid_product_area">
                    <div class="row justify-content-start ">
                        {% for product in products %}
                        <!-- Single Product col-4 col-sm-12 col-md-4 col-lg-4 -->
                        
                        
                        <div class="col-6 col-xs-6 col-sm-6 col-md-4 col-lg-4">
                            <div class="single-product-area mb-30">
                            <a href="{{ 'haryt2'|page({id: product.id}) }}">
                                <div class="product_image">
                                    <!-- Product Image -->
                                    <img class="normal_img" src="{{ product.images[0].thumb(680,700,{'mode':'crop'}) }}" alt="Gurluşyk, Gurluşyk platform, bezeg gurluşyk, gipsler merkezi, {{ product.name }}">
                                    {% if product_images_count > 1 %}
                                        <img class="hover_img" src="{{ product.images[1].thumb(680,700,{'mode':'crop'}) }}" alt="Gurluşyk, Gurluşyk platform, bezeg gurluşyk, gipsler merkezi, {{ product.name }}">
                                    {% endif %}
                                    
                                    {% if product.type_title %}
                                    <div class="product_badge">
                                        <span>{{product.type_title}}</span>
                                    </div>
                                    {% endif %}
                                    
                                    <div class="product_wishlist">
                                        {% if user %}
                                            <a 
                                                data-request="onCreateFav" 
                                                data-request-flash
                                                data-request-validate
                                                data-request-data="product_id: {{ product.id }}" 
                                                href="#"><i class="icofont-heart"></i></a>
                                        {% else %}
                                            <a href="{{ 'login'|page }}"><i class="icofont-heart"></i></a>
                                        {% endif %}
                                    </div>
                                </div>
                            </a>

                                <!-- Product Description -->
                                <div class="product_description" style="padding-top: 1px;padding-bottom: 20px;">
                                    <!-- Add to cart -->
                                    {% if user %}
                                        <div class="product_add_to_cart addToCard" data-id="{{ product.id }}" data-price="{{ product.price }}" data-image="{{ product.images[0].path }}" data-name="{{ product.name }}"  data-vendor="{{ product.vendor.id }}">
                                            <input type="hidden" min="1" id="quantity{{ product.id }}" value="1">
                                            <a href="#"><i class="icofont-shopping-cart" style="font-size: 19px;"></i></a>
                                        </div>
                                    {% else %}
                                        <div class="product_add_to_cart">
                                            <a href="{{ 'login'|page }}"><i class="icofont-shopping-cart" style="font-size: 19px;"></i></a>
                                        </div>
                                    {% endif %}
                                    <!-- Quick View -->
                                    <div class="product_quick_view">
                                        <a href="#" data-toggle="modal" data-target="#quickview{{product.id}}"><i class="icofont-eye-alt" style="font-size: 19px;"></i></a>
                                    </div>
                                    
                                    <!-- <div style="display: flex;justify-content: space-between;align-items: flex-end;margin-top: 10px;">
                                    <a href="{{ 'product'|page({id: product.id}) }}" style="font-size: 18px;">{{ product.name }} </a>
                                    
                                    <i class="icofont-angle-double-right" style="font-size: 30px;">
                                        <svg width="45" height="auto" viewBox="0 0 1000 1000" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <path d="M208.9 100L204.9 100.2C190 101.5 176.9 110.6 170.6 124.1C164.9 136.3 165.5 150.4 171.9 162L174.2 165.8L412.1 504.1C416.7 510.7 417.3 519.2 413.8 526.3L412.1 529.2L174.2 867.6C165.3 880.4 164.2 897 171.4 910.9C178.6 924.7 192.9 933.3 208.5 933.3C220.8 933.4 232.4 928 240.2 918.7L242.7 915.5L506.2 540.6C515.4 527.4 516.2 510.3 508.5 496.4L506.2 492.7L242.7 117.9C234.9 106.7 222.3 100.1 208.9 100Z" fill="black"/>
                                            <path opacity="0.4" d="M812.6 492.7L549.1 117.9C535.9 98.9 509.801 94.3 490.901 107.5C473.101 120 467.901 143.8 478.401 162.3L480.601 165.8L718.401 504.1C723.101 510.7 723.601 519.2 720.201 526.3L718.401 529.2L480.601 867.6C471.601 880.4 470.6 897 477.8 910.9C485 924.7 499.3 933.3 514.8 933.3C527.1 933.4 538.7 928 546.6 918.7L549.1 915.5L812.6 540.6C821.8 527.4 822.601 510.3 814.901 496.4L812.6 492.7Z" fill="black"/>
                                            </svg>
                                    
                                    </i>
                                    </div> -->
                                    
                                    <p class="brand_name"></p>
                                    <a href="{{ 'product'|page({id: product.id}) }}">{{ product.name }}</a>
                                    <h6 class="product-price">{{ product.price }} TMT</h6>
                                    
                                    
                                </div>
                            </div>
                        </div>
                        {% endfor %}

                    </div>
                </div>
                {% if products.hasPages %}
                    <div class="shop_pagination_area mt-30">
                        <nav aria-label="Page navigation">
                            <ul class="pagination pagination-sm justify-content-center">
                                {% if products.currentPage > 1 %}
                                    <li class="page-item"><a class="page-link" href="{{ products.previousPageUrl }}{{params}}">Öňki</a></li>
                                {% endif %}
                    
                                {% for page in range(1, products.lastPage) %}
                                    {% if page == products.currentPage %}
                                        <li class="page-item active"><a class="page-link" href="{{ products.url(page) }}{{params}}">{{ page }}</a></li>
                                    {% elseif page > products.currentPage - 3 and page < products.currentPage + 3 %}
                                        <li class="page-item"><a class="page-link" href="{{ products.url(page) }}{{params}}">{{ page }}</a></li>
                                    {% elseif page == products.currentPage + 3 or page == products.currentPage - 3 %}
                                        <li>...</li>
                                    {% endif %}
                                {% endfor %}
                    
                                {% if products.lastPage > products.currentPage %}
                                    <li class="page-item"><a class="page-link" href="{{ products.nextPageUrl }}{{params}}">Indiki</a></li>
                                {% endif %}
                            </ul>
                        </nav>
                    </div>
                    {% endif %}
                    
                    
                    <div style="margin-top: 70px;">
                     {{userProfile.description|raw}}
                    </div>
            </div>
        </div>
   </div>
  </section>