Opencart Two Columns Product View in Small Device - Need Help

Hi,

I just want to show my products in two column like below in small devices ....... my website is https://hopniche.com/


I search online and change few things in code at catalog/view/javascript/common.js (Col-sm and col-xs in code 12 to 6)

    $('#grid-view').click(function() {
        // What a shame bootstrap does not take into account dynamically loaded columns
        cols = $('#column-right, #column-left').length;
        if (cols == 2) {

            $('#content .product-list').attr('class', 'product-layout product-grid product-category product-item col-lg-6 col-md-6 col-sm-6 col-xs-6');
        } else if (cols == 1) {
            $('#content .product-list').attr('class', 'product-layout product-grid product-category product-item col-lg-4 col-md-4 col-sm-6 col-xs-6');
        } else {
            $('#content .product-list').attr('class', 'product-layout product-grid product-category product-item col-lg-3 col-md-3 col-sm-6 col-xs-6');
        }
         localStorage.setItem('display', 'grid');
    });

Code (markup):

Working with other devices like tab, medium devices but with small device work when device is in horizontal mode ... in verticle mode showing single product ..... can any expert help me that what i am missing .... i am not expert of opencart .. so please suggest me your best that what to do .... Thanks