Mini Kabibi Habibi

<div data-options="dxView : { name: 'productCategory', title: 'products' } " >

    <div data-bind="dxCommand: { action: goBack, title: 'Back', iconSrc: 'images/back-icon.png', location: 'home' }"></div>
    
    <div class="products-category" data-options="dxContent : { targetPlaceholder: 'content' } " >
        
        <!-- ko ifnot: productsLoaded -->
        <img src="images/dxsk8-preloader.gif" class="preloader"/>
        <!-- /ko -->

        <div class="gallery" data-bind="dxGallery: { showIndicator: false, dataSource: products, selectedIndex: selectedIndex }">
            <div data-bind="dxAction: '#productDetail/{typeId}/{id}'" data-options="dxTemplate : { name: 'item' } " >
                <div data-bind="attr: { 'class': 'gallery-item '+ cssClass }">
                    <div class="item-container">
                        <img data-bind="attr: { src: imageSrc }" />
                    </div>
                </div>
            </div>
        </div>
        <!-- ko with: selectedItem -->
        <div class="item-details">
            <div data-bind="text: Brand.Name"></div>
            <div data-bind="text: Name"></div>
            <div class="price" data-bind="text: price"></div>
        </div>
        <!-- /ko -->
    </div>
</div>