Add a style particularly for parent item

In the case of matrix item , if we have to apply some styles, particularly for a parent item and it is not required for the child item.

We can add it by following the method

Retrieve the item information and check wehther it is parent item or not

after checking the condition apply the style

_.extend(ProductDetailsImageGalleryView.prototype, {
                    getContext: _.wrap(ProductDetailsImageGalleryView.prototype.getContext, function (fn) {
                        var context = fn.apply(this, _.toArray(arguments).slice(1));
                        var itemInfo = PDP.getItemInfo();
                        if(!!itemInfo){
                        var totalNoOfChild = itemInfo.item.matrixchilditems_detail?itemInfo.item.matrixchilditems_detail.length:null;
                        var selectedMatrix = PDP.getSelectedMatrixChilds();
                        var selectecNoOfMatrixChild = selectedMatrix?selectedMatrix.length:null;
                        if(totalNoOfChild === selectecNoOfMatrixChild){
                             // Adding styles to HTML
                             var styleElement = document.createElement('style');
                             styleElement.textContent = '.product-details-image-gallery .bx-wrapper .bx-pager a { display: none; } .product-details-image-gallery .bx-wrapper .bx-pager a.active { display: block; }';
                             document.head.appendChild(styleElement);
                        }
                        }
                        return context;
                    })
                });

Leave a comment

Your email address will not be published. Required fields are marked *