reimplemented login system and added state list component.

dist/Js/auth/apiservice.js

@@ -1,14 +1,17 @@
 //let SERVERNAME = 'https://anwi.bizgaze.app';
 //let SERVERNAME = 'http://beta.bizgaze.com';
- let SERVERNAME = 'https://qa.anwisystems.com';
+let SERVERNAME = 'https://qa.anwisystems.com';
  //let SERVERNAME = 'http://localhost:3088';
 
 //template
-const STAT = '8041f78ba55b4847bc4aacaeae9d24ef';
+const STAT = 'd622a6ce4c8540ffadd0f885162ac8f4';
 
 //live
 //const STAT = '0c7ef2b000ca431290065753dfda56fe';
 
+const USER_AUTH_OKAY = 'USER_AUTH_OKAY';
+
+
 function imgServerNameBuild(path){
     return `https://appassets.bizgaze.app/${path}`;
 }
@@ -29,9 +32,10 @@ async function getStatAPIService(url,data={}){
     return response;
 }
 
-async function getStatAPIService(url,data={}){
+async function getAPIService(url,data={}){
+    debugger
     const config = {
-        url,
+        url:`${SERVERNAME}/${url}`,
         method: "get",
       };
     let response = await axios(config);
@@ -39,15 +43,11 @@ async function getStatAPIService(url,data={}){
     return response;
 }
 
-async function postStatAPIService(url,data={}){
+async function postAPIService(url,data={}){
     let config = {
-        url,
+        url:`${SERVERNAME}/${url}`,
         method:'post',
         data:data,
-        headers: {
-            'Authorization': `stat ${STAT}`,
-            'Content-Type': 'application/json'
-        },
     }
     let response = await axios(config);
 
@@ -55,15 +55,15 @@ async function postStatAPIService(url,data={}){
 }
 
 
-async function postAPIService(url,data={}){
+async function postStatAPIService(url,data={}){
     let config = {
-        url:`${SERVERNAME}/${url}`,
+        url,
         method:'post',
         data:data,
-        // headers: {
-        //     'Authorization': `Basic b67607dd-283e-478e-b2cf-35736e8bad69`,
-        //     'Content-Type': 'application/json'
-        // },
+        headers: {
+            'Authorization': `stat ${STAT}`,
+            'Content-Type': 'application/json'
+        },
     }
     let response = await axios(config);
 
@@ -71,6 +71,9 @@ async function postAPIService(url,data={}){
 }
 
 
+
+
+
 async function postAPIServiceLocal(url,data={}){
     let config = {
       url:`${SERVERNAME}/${url}`,

dist/Js/footer.js

@@ -26,7 +26,7 @@ $(document).ready(function () {
         <div class="accordion-body pt-0">
         <ul class="list-inline ">
             <li class="fs-6">
-                <a href="./ramproducts.html" class="text-white fs-9 text-decoration-none satoshi_font">Memory</a>
+                <a href="/ramproducts.html" class="text-white fs-9 text-decoration-none satoshi_font">Memory</a>
             </li>
             <li class="fs-6">
                 <a href="./storageproducts.html" class="text-white fs-9  text-decoration-none satoshi_font">Storage</a>
@@ -229,7 +229,7 @@ $(document).ready(function () {
                             <h5 class="fw-bold">Products</h5>
                             <ul class="list-inline ">
                                 <li class="fs-6">
-                                    <a href="./ramproducts.html" class="text-white fs-9 text-decoration-none satoshi_font">Memory</a>
+                                    <a href="/ramproducts.html" class="text-white fs-9 text-decoration-none satoshi_font">Memory</a>
                                 </li>
                                 <li class="fs-6">
                                     <a href="./storageproducts.html" class="text-white fs-9  text-decoration-none satoshi_font">Storage</a>
@@ -274,8 +274,14 @@ $(document).ready(function () {
                         <div class="col-lg-3 last-col-footer">
                             <h5 class="fw-bold">Account</h5>
                             <ul class="list-inline">
-                                <li>My Shopping Cart</li>
-                                <li>My Account
+                            <li>
+                            <a href="/shopping-cart.html" class="text-white text-decoration-none satoshi_font"> My Shopping Cart</a>
+                           </li>
+                      
+                            <li>
+                            <a href="/myaccount.html" class="text-white text-decoration-none satoshi_font"> My Account</a>
+                            
+                            </li>
                                 </li>
                             </ul>
                             <h5 class="fw-bold">Follow Us</h5>

dist/Js/main.js

@@ -31,12 +31,12 @@
         var scroll = win.scrollTop();
         if (scroll < 100) {
             header.removeClass('stick');
-            $("body.about_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#000");
+            $("body.about_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#fff");
             $("body.product_pg").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#fff");
-            $("body.services_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#000");
+            $("body.services_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#fff");
             // $('.header-bottom-flex').find('svg path').attr('fill','#fff');
             $("body").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#fff");
-            $("body.services_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#000");
+            $("body.services_page").find(".header-large-device").find(".header-action-wrap").find(".same-style").find("svg").find("path").attr("fill","#fff");
            
             if ($body_pg == true) {
                 $(".main-menu").find("nav ul li a").addClass("text-dark");
@@ -87,474 +87,478 @@
     /*--------------------------------
         Slider active 1
     -----------------------------------*/
-    $('.slider-active-1').slick({
-        slidesToShow: 1,
-        slidesToScroll: 1,
-        fade: true,
-        loop: true,
-        dots: false,
-        arrows: true,
-        prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
-        nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
-        responsive: [{
-                breakpoint: 1500,
-                settings: {
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 1199,
-                settings: {
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 991,
-                settings: {
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 767,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            }
-        ]
-    });
-    
-    /*--------------------------------
-        Slider active 2
-    -----------------------------------*/
-    $('.slider-active-2').slick({
-        slidesToShow: 1,
-        slidesToScroll: 1,
-        fade: true,
-        loop: true,
-        dots: true,
-        arrows: false,
-        prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
-        nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
-        responsive: [{
-                breakpoint: 1500,
-                settings: {
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 1199,
-                settings: {
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 991,
-                settings: {
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 767,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            }
-        ]
-    });
-    
-    /*--
-        Slider active 3
-    -----------------------------------*/
-    $('.slider-active-3').slick({
-        arrows: false,
-        infinite: true,
-        slidesToShow: 1,
-        dots: true,
-        fade: true,
-        autoplay: false,
-        autoplaySpeed: 5000,
-        customPaging : function(slider, i) {
-            var thumb = $(slider.$slides[i]).data('thumb');
-            return '<button class="overlay"><img src="'+thumb+'"></button>';
-        },
-        responsive: [
-            {
-            breakpoint: 767,
-                settings: {
-                    dots: true,
-                    autoplay: false,
-                    autoplaySpeed: 5000,
-                }
-            }
-        ]
-    });
-    
-    
-    /*--------------------------------
-        slider active 4
-    -----------------------------------*/
-    $('.slider-active-4').slick({
-        slidesToShow: 1,
-        slidesToScroll: 1,
-        fade: true,
-        loop: true,
-        dots: true,
-        arrows: false,
-        prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
-        nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
-        responsive: [{
-                breakpoint: 1500,
-                settings: {
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 1199,
-                settings: {
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 991,
-                settings: {
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 767,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            }
-        ]
-    });
-    
-    /*--------------------------------
-        Slider active 5
-    -----------------------------------*/
-    $('.slider-active-5').slick({
-        slidesToShow: 1,
-        slidesToScroll: 1,
-        fade: true,
-        loop: true,
-        dots: true,
-        arrows: false,
-        prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
-        nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
-    });
-    
-    
-    /*--------------------------------
-        Product slider active 1
-    -----------------------------------*/
-    $('.product-slider-active-1').slick({
-        slidesToShow: 3,
-        slidesToScroll: 1,
-        loop: true,
-        dots: false,
-        arrows: false,
-        responsive: [{
-                breakpoint: 1500,
-                settings: {
-                    slidesToShow: 3,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 1199,
-                settings: {
-                    slidesToShow: 3,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 991,
-                settings: {
-                    slidesToShow: 2,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 767,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 2,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 575,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            }
-        ]
-    });
-    
-    
-    /*--------------------------------
-        Product slider active 2
-    -----------------------------------*/
-    $('.product-slider-active-2').slick({
-        slidesToShow: 6,
-        slidesToScroll: 1,
-        loop: true,
-        dots: false,
-        arrows: false,
-        responsive: [{
-                breakpoint: 1500,
-                settings: {
-                    slidesToShow: 6,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 1199,
-                settings: {
-                    slidesToShow: 4,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 991,
-                settings: {
-                    slidesToShow: 3,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 767,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 2,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 575,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            }
-        ]
-    });
-    
-    
-    /*--------------------------------
-        Product slider active 3
-    -----------------------------------*/
-    $('.product-slider-active-3').slick({
-        slidesToShow: 2,
-        slidesToScroll: 1,
-        loop: true,
-        dots: false,
-        arrows: false,
-        responsive: [{
-                breakpoint: 1500,
-                settings: {
-                    slidesToShow: 2,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 1199,
-                settings: {
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 991,
-                settings: {
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 767,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 575,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            }
-        ]
-    });
-    
-    /*--------------------------------
-        Product slider active 4
-    -----------------------------------*/
-    $('.product-slider-active-4').slick({
-        slidesToShow: 4,
-        slidesToScroll: 1,
-        loop: true,
-        dots: false,
-        arrows: false,
-        responsive: [{
-                breakpoint: 1500,
-                settings: {
-                    slidesToShow: 4,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 1199,
-                settings: {
-                    slidesToShow: 3,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 991,
-                settings: {
-                    slidesToShow: 2,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 767,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 2,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 575,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 1,
-                    slidesToScroll: 1,
-                }
-            }
-        ]
-    });
-    
-    
-    /*--------------------------------
-        Brand logo active
-    -----------------------------------*/
-    $('.brand-logo-active , .brand-logo-active-2').slick({
-        slidesToShow: 6,
-        slidesToScroll: 1,
-        loop: true,
-        dots: false,
-        arrows: false,
-        responsive: [{
-                breakpoint: 1500,
-                settings: {
-                    slidesToShow: 6,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 1199,
-                settings: {
-                    slidesToShow: 5,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 991,
-                settings: {
-                    slidesToShow: 4,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 767,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 3,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 575,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 2,
-                    slidesToScroll: 1,
-                }
-            }
-        ]
-    });
-    
-    /*--------------------------------
-        Brand logo active 3
-    -----------------------------------*/
-    $('.brand-logo-active-3').slick({
-        slidesToShow: 6,
-        slidesToScroll: 1,
-        loop: true,
-        dots: true,
-        arrows: false,
-        responsive: [{
-                breakpoint: 1500,
-                settings: {
-                    slidesToShow: 6,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 1199,
-                settings: {
-                    slidesToShow: 5,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 991,
-                settings: {
-                    slidesToShow: 4,
-                    slidesToScroll: 1,
-                }
+    sliders();
+    function sliders(){
+        if(window.location.href.includes('login')) return;
+        $('.slider-active-1').slick({
+            slidesToShow: 1,
+            slidesToScroll: 1,
+            fade: true,
+            loop: true,
+            dots: false,
+            arrows: true,
+            prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
+            nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
+            responsive: [{
+                    breakpoint: 1500,
+                    settings: {
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 1199,
+                    settings: {
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 991,
+                    settings: {
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 767,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                }
+            ]
+        });
+        
+        /*--------------------------------
+            Slider active 2
+        -----------------------------------*/
+        $('.slider-active-2').slick({
+            slidesToShow: 1,
+            slidesToScroll: 1,
+            fade: true,
+            loop: true,
+            dots: true,
+            arrows: false,
+            prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
+            nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
+            responsive: [{
+                    breakpoint: 1500,
+                    settings: {
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 1199,
+                    settings: {
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 991,
+                    settings: {
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 767,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                }
+            ]
+        });
+        
+        /*--
+            Slider active 3
+        -----------------------------------*/
+        $('.slider-active-3').slick({
+            arrows: false,
+            infinite: true,
+            slidesToShow: 1,
+            dots: true,
+            fade: true,
+            autoplay: false,
+            autoplaySpeed: 5000,
+            customPaging : function(slider, i) {
+                var thumb = $(slider.$slides[i]).data('thumb');
+                return '<button class="overlay"><img src="'+thumb+'"></button>';
             },
-            {
+            responsive: [
+                {
                 breakpoint: 767,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 3,
-                    slidesToScroll: 1,
-                }
-            },
-            {
-                breakpoint: 575,
-                settings: {
-                    autoplay: false,
-                    slidesToShow: 2,
-                    slidesToScroll: 1,
+                    settings: {
+                        dots: true,
+                        autoplay: false,
+                        autoplaySpeed: 5000,
+                    }
                 }
-            }
-        ]
-    });
+            ]
+        });
+        
+        
+        /*--------------------------------
+            slider active 4
+        -----------------------------------*/
+        $('.slider-active-4').slick({
+            slidesToShow: 1,
+            slidesToScroll: 1,
+            fade: true,
+            loop: true,
+            dots: true,
+            arrows: false,
+            prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
+            nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
+            responsive: [{
+                    breakpoint: 1500,
+                    settings: {
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 1199,
+                    settings: {
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 991,
+                    settings: {
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 767,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                }
+            ]
+        });
+        
+        /*--------------------------------
+            Slider active 5
+        -----------------------------------*/
+        $('.slider-active-5').slick({
+            slidesToShow: 1,
+            slidesToScroll: 1,
+            fade: true,
+            loop: true,
+            dots: true,
+            arrows: false,
+            prevArrow: '<span class="slider-icon slider-icon-prev"><i class="icofont-simple-left"></i></span>',
+            nextArrow: '<span class="slider-icon slider-icon-next"><i class="icofont-simple-right"></i></span>',
+        });
+        
+        
+        /*--------------------------------
+            Product slider active 1
+        -----------------------------------*/
+        $('.product-slider-active-1').slick({
+            slidesToShow: 3,
+            slidesToScroll: 1,
+            loop: true,
+            dots: false,
+            arrows: false,
+            responsive: [{
+                    breakpoint: 1500,
+                    settings: {
+                        slidesToShow: 3,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 1199,
+                    settings: {
+                        slidesToShow: 3,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 991,
+                    settings: {
+                        slidesToShow: 2,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 767,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 2,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 575,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                }
+            ]
+        });
+        
+        
+        /*--------------------------------
+            Product slider active 2
+        -----------------------------------*/
+        $('.product-slider-active-2').slick({
+            slidesToShow: 6,
+            slidesToScroll: 1,
+            loop: true,
+            dots: false,
+            arrows: false,
+            responsive: [{
+                    breakpoint: 1500,
+                    settings: {
+                        slidesToShow: 6,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 1199,
+                    settings: {
+                        slidesToShow: 4,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 991,
+                    settings: {
+                        slidesToShow: 3,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 767,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 2,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 575,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                }
+            ]
+        });
+        
+        
+        /*--------------------------------
+            Product slider active 3
+        -----------------------------------*/
+        $('.product-slider-active-3').slick({
+            slidesToShow: 2,
+            slidesToScroll: 1,
+            loop: true,
+            dots: false,
+            arrows: false,
+            responsive: [{
+                    breakpoint: 1500,
+                    settings: {
+                        slidesToShow: 2,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 1199,
+                    settings: {
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 991,
+                    settings: {
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 767,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 575,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                }
+            ]
+        });
+        
+        /*--------------------------------
+            Product slider active 4
+        -----------------------------------*/
+        $('.product-slider-active-4').slick({
+            slidesToShow: 4,
+            slidesToScroll: 1,
+            loop: true,
+            dots: false,
+            arrows: false,
+            responsive: [{
+                    breakpoint: 1500,
+                    settings: {
+                        slidesToShow: 4,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 1199,
+                    settings: {
+                        slidesToShow: 3,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 991,
+                    settings: {
+                        slidesToShow: 2,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 767,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 2,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 575,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 1,
+                        slidesToScroll: 1,
+                    }
+                }
+            ]
+        });
+        
+        
+        /*--------------------------------
+            Brand logo active
+        -----------------------------------*/
+        $('.brand-logo-active , .brand-logo-active-2').slick({
+            slidesToShow: 6,
+            slidesToScroll: 1,
+            loop: true,
+            dots: false,
+            arrows: false,
+            responsive: [{
+                    breakpoint: 1500,
+                    settings: {
+                        slidesToShow: 6,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 1199,
+                    settings: {
+                        slidesToShow: 5,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 991,
+                    settings: {
+                        slidesToShow: 4,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 767,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 3,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 575,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 2,
+                        slidesToScroll: 1,
+                    }
+                }
+            ]
+        });
+        
+        /*--------------------------------
+            Brand logo active 3
+        -----------------------------------*/
+        $('.brand-logo-active-3').slick({
+            slidesToShow: 6,
+            slidesToScroll: 1,
+            loop: true,
+            dots: true,
+            arrows: false,
+            responsive: [{
+                    breakpoint: 1500,
+                    settings: {
+                        slidesToShow: 6,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 1199,
+                    settings: {
+                        slidesToShow: 5,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 991,
+                    settings: {
+                        slidesToShow: 4,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 767,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 3,
+                        slidesToScroll: 1,
+                    }
+                },
+                {
+                    breakpoint: 575,
+                    settings: {
+                        autoplay: false,
+                        slidesToShow: 2,
+                        slidesToScroll: 1,
+                    }
+                }
+            ]
+        });
+    }
     
     /*---------------------
         Countdown 1

dist/Js/myaccount/Address.js

@@ -2,9 +2,64 @@ async function addressDetails() {
   debugger;
   // const user_addr_num =$("#Profile_Phone_num").val();
   getbillinginfoBind();
-  let addr_phone=$('#phonenumber');
-  let addr_addrline =$('#addressdes');
-  let addr_zip =$('#zipcode');
+  let addr_phone = $('#phonenumber');
+  let addr_addrline = $('#addressdes');
+  let addr_zip = $('#zipcode');
+
+  let stateArr = [];
+
+  function getCustomDropDownHTML({ cityid, cityname, countryid }) {
+    return ` <div class="bg-white stateoption px-2 border-bottom py-2 cursor-pointer" data-name="${cityname}" data-value="${cityid}">${cityname}</div>`;
+  }
+
+  function renderCustomStateDropdown(stateList) {
+    let html = ``;
+    debugger;;
+    let maxLen = stateList.length > 10 ? 10 : stateList.length
+    for (let i = 0; i < maxLen; i++) {
+      let currItem = stateList[i];
+      html += getCustomDropDownHTML(currItem);
+    }
+
+    $('.stateBox').html(html);
+
+    $('.stateoption').off().click(function (e) {
+      debugger;
+      const name = $(e.target).data('name');
+      const id = $(e.target).data('value');
+      $('#state').val(name);
+      $('#state').attr('data-id', id);
+    })
+  }
+
+  function loadDropdownStateEvents() {
+    $('#state').off().focus(function () {
+      $('.stateBox').removeClass('d-none');
+      $(document).off('click').click(closeDrop);
+
+
+    })
+
+
+    $(document).off().click(closeDrop);
+
+    function closeDrop(e) {
+      let id = $(e.target).hasClass('stateoption');
+      if ($(e.target).attr('id') === 'state') return;
+      if (id) {
+        $('.stateBox').addClass('d-none');
+        $(document).off();
+      } else {
+        $('.stateBox').addClass('d-none');
+        $(document).off();
+      }
+
+    }
+
+    $('#state').keyup(debounce(function (event) {
+      onChangeState(event)
+    }));
+  }
 
   function getbillinginfoBind() {
     return new Promise(async (resolve, reject) => {
@@ -22,63 +77,67 @@ async function addressDetails() {
       addr_phone.val(res.phonenumber);
       $('#Profile_User_name').val(res.organizationname)
       $('#Profile_Phone_num').val(res.phonenumber)
-        let Profileusername =$('#Profile_User_name').val()
-        let Profileuserphone=$('#Profile_Phone_num').val()
+      let Profileusername = $('#Profile_User_name').val()
+      let Profileuserphone = $('#Profile_Phone_num').val()
       $('.overview_user_name').html(Profileusername);
-        $('.overview_user_phone').html(Profileuserphone);
+      $('.overview_user_phone').html(Profileuserphone);
       if (res.cityid == "0") {
         $(".profile_Address").html(
           `<div class=User_address><button class="btn btn-outline-primary create_address" type="button"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-plus-circle" viewBox="0 0 16 16"><path d="M8 15A7 7 0 1 1 8 1a7 7 0 0 1 0 14zm0 1A8 8 0 1 0 8 0a8 8 0 0 0 0 16z"/><path d="M8 4a.5.5 0 0 1 .5.5v3h3a.5.5 0 0 1 0 1h-3v3a.5.5 0 0 1-1 0v-3h-3a.5.5 0 0 1 0-1h3v-3A.5.5 0 0 1 8 4z"/></svg> ADD NEW ADDRESS</button></div>`
         );
-        
+
         $(".address_edit").hide();
         $(".create_address").on("click", function () {
-            debugger
-            $(this).hide();
-            $('.saveaddress').hide()
-            $(".addresslist").show();
-            $(".Createaddress").show();
-            getCountryStateCurrency();
-          });
-        $('.Createaddress').on('click',async function(){
-            if( addr_zip.val() == "" || addr_addrline.val()  == ""){
-                // toastr.error('Required Feilds are Empty!');
-                //  if(addr_phone.val() == '' || addr_phone.val().length <10){
-                //     addr_phone.addClass("is-invalid");
-                //  }
-                //  else{
-                //     addr_phone.removeClass("is-invalid");
-                //  }
-                 if(addr_zip.val() == '' || addr_zip.val().length < 6){
-                    addr_zip.addClass("is-invalid");
-                 }
-                 else{
-                    addr_zip.removeClass("is-invalid");
-                 }
-                 if(addr_addrline.val() == ''){
-                    addr_addrline.addClass("is-invalid");
-                 }   else{
-                    addr_addrline.removeClass("is-invalid");
-                 }
-               }
-               else{
-                $(".addresslist").hide();
-                $(".profile_Address").show();
-                $(".address_edit").show();
-                $(".address_edit_cancel").hide();
-                await createBillingForm() 
-                 await getbillinginfoBind();
-               }
-    
+          debugger
+          $(this).hide();
+          $('.saveaddress').hide()
+          $(".addresslist").show();
+          $(".Createaddress").show();
+          getCountryStateCurrency();
+        });
+        $('.Createaddress').on('click', async function () {
+          if (addr_zip.val() == "" || addr_addrline.val() == "") {
+            // toastr.error('Required Feilds are Empty!');
+            //  if(addr_phone.val() == '' || addr_phone.val().length <10){
+            //     addr_phone.addClass("is-invalid");
+            //  }
+            //  else{
+            //     addr_phone.removeClass("is-invalid");
+            //  }
+            if (addr_zip.val() == '' || addr_zip.val().length < 6) {
+              addr_zip.addClass("is-invalid");
+            }
+            else {
+              addr_zip.removeClass("is-invalid");
+            }
+            if (addr_addrline.val() == '') {
+              addr_addrline.addClass("is-invalid");
+            } else {
+              addr_addrline.removeClass("is-invalid");
+            }
+          }
+          else {
+            $(".addresslist").hide();
+            $(".profile_Address").show();
+            $(".address_edit").show();
+            $(".address_edit_cancel").hide();
+            await createBillingForm()
+            await getbillinginfoBind();
+          }
+
         })
       } else {
         $(".profile_Address").html(
-          `<div class=User_address><address><p><strong class="text-capitalize">${res.organizationname}</strong><p>${res.addressline},${res.cityname}<br>${res.statename},${res.zipcode}<p>Mobile: ${res.phonenumber}</address></div>`
+          `<div class=User_address><address><p><strong class="">${res.organizationname}</strong><p>${res.addressline},${res.cityname},${res.zipcode}<p>Mobile: ${res.phonenumber}</address></div>`
         );
+        $('#state').val(res.cityname)
+        $('#state').attr('data-id',res.cityid);
+        $('#zipcode').val(res.zipcode);
+        $('#addressdes').val(res.addressline);
       }
       resolve();
     });
-  }   debugger
+  } debugger
 
 
   $(".address_edit").on("click", function () {
@@ -87,7 +146,7 @@ async function addressDetails() {
     $(".addresslist").show();
     $(".address_edit_cancel").show();
     getCountryStateCurrency();
-    getbillinginfoBind() 
+    getbillinginfoBind()
   });
 
   $(".address_edit_cancel").on("click", function () {
@@ -100,9 +159,9 @@ async function addressDetails() {
   $(".saveaddress")
     .off("click")
     .click(async function () {
- 
-    debugger
-      if(addr_zip.val() == "" || addr_addrline.val()  == ""){
+
+      debugger
+      if (addr_zip.val() == "" || addr_addrline.val() == "") {
         // toastr.error('Required Feilds are Empty!');
         //  if(addr_phone.val() == '' || addr_phone.val().length <10){
         //     addr_phone.addClass("is-invalid");
@@ -110,33 +169,56 @@ async function addressDetails() {
         //  else{
         //     addr_phone.removeClass("is-invalid");
         //  }
-         if(addr_zip.val() == '' || addr_zip.val().length < 6){
-            addr_zip.addClass("is-invalid");
-         }
-         else{
-            addr_zip.removeClass("is-invalid");
-         }
-         if(addr_addrline.val() == ''){
-            addr_addrline.addClass("is-invalid");
-         }   else{
-            addr_addrline.removeClass("is-invalid");
-         }
-       }
-       else{
+        if (addr_zip.val() == '' || addr_zip.val().length < 6) {
+          addr_zip.addClass("is-invalid");
+        }
+        else {
+          addr_zip.removeClass("is-invalid");
+        }
+        if (addr_addrline.val() == '') {
+          addr_addrline.addClass("is-invalid");
+        } else {
+          addr_addrline.removeClass("is-invalid");
+        }
+      }
+      else {
         $(".addresslist").hide();
         $(".profile_Address").show();
         $(".address_edit").show();
         $(".address_edit_cancel").hide();
         $('.spinner-border').removeClass('d-none')
         $('.saveaddress').find('span').addClass('d-none')
-         await AddresssaveForm();
-         $('.spinner-border').addClass('d-none')
-         $('.saveaddress').find('span').removeClass('d-none')
-         await getbillinginfoBind();
-       }
-     
+        await AddresssaveForm();
+        $('.spinner-border').addClass('d-none')
+        $('.saveaddress').find('span').removeClass('d-none')
+        await getbillinginfoBind();
+      }
+
     });
+
+    function onChangeState(e){
+      let userItem = e.target.value.toLowerCase();
+      let limit = 10;
+      let results = [];
+      let maxLen = stateArr.length > 10 ? 10 :stateArr.length;
+      debugger
+      for(let i=0;i<stateArr.length;i++){
+          let currItem = stateArr[i];
+          let stateName = currItem.cityname.toLowerCase();
+          if(stateName.includes(userItem)){
+              results.push(currItem);
+              if(results.length>=10) break;
+          }
+      }
+      $('.stateBox').removeClass('d-none');
+      renderCustomStateDropdown(results);
+      loadDropdownStateEvents();
+
+
+  }
+
   async function getCountryStateCurrency() {
+ 
     const countryRes = await API_SERVICES_ACTIONS.getAPIService(
       "apis/v4/bizgaze/integrations/anwiauth/getcountry"
     );
@@ -169,22 +251,9 @@ async function addressDetails() {
     let stateData = JSON.parse(stateRes.response.result);
 
     console.log(stateData, "state");
-
-    $("#state").html("");
-    console.log("start");
-    let html = "";
-    statesList = stateData;
-    for (let i = 0; i < stateData.length; i++) {
-      html += `<option value="${stateData[i].cityid}" data-id="${stateData[i].cityid}">${stateData[i].cityname}</option>`;
-    }
-
-    $("#state").append(html);
-
-    $("#state").select2({
-      placeholder: "Select a City",
-      allowClear: true,
-    });
-
+    stateArr = stateData;
+    renderCustomStateDropdown(stateArr);
+    loadDropdownStateEvents();
     const currencyRes = await API_SERVICES_ACTIONS.getAPIService(
       "apis/v4/bizgaze/integrations/anwiauth/getcurrencies"
     );
@@ -285,14 +354,15 @@ async function addressDetails() {
     let resAnwi = JSON.parse(response.result);
     console.log(resAnwi, "befores");
     resAnwi = resAnwi[resAnwi.length - 1];
-    let stateId = parseInt($("#state").val());
+    let stateId = parseInt($("#state").data('id'));
     let payload = {
       ...resAnwi,
       phonenumber: $("#phonenumber").val(),
       addressline1: $("#addressdes").val(),
       zipcode: $("#zipcode").val(),
       cityid: stateId,
-      CityName: $(`[data-id="${stateId}"`).html(),
+      CityName: $('#state').val(),
+      cityname: $('#state').val(),
     };
     console.log(payload, "addresssaave");
     //

dist/Js/navbar.js

@@ -20,20 +20,22 @@ function navINIT() {
     }
     async function loadCart(){
 
-        let files = ['./dist/js/shoppingcart/addtocart.js'];
-        await loadHelper();
-        for(let i=0;i<files.length;i++){
-            if ($(`script[src="${files[i]}"]`).length > 0) {
-                continue;
-            }
-            try {
-        
-                await loadHelper(files[i])
-                console.log("done");
-
-            } catch (error) {
-                console.log(error);
-                return;
+        if(!window.location.href.includes('services/paymentmethod.html')){
+            let files = ['./dist/js/shoppingcart/addtocart.js'];
+            await loadHelper();
+            for(let i=0;i<files.length;i++){
+                if ($(`script[src="${files[i]}"]`).length > 0) {
+                    continue;
+                }
+                try {
+            
+                    await loadHelper(files[i])
+                    console.log("done");
+    
+                } catch (error) {
+                    console.log(error);
+                    return;
+                }
             }
         }
 
@@ -45,7 +47,7 @@ function navINIT() {
       
     }
     let URLNAMENAV = window.location.href;
-    const isTransparent = URLNAMENAV.includes('login')||URLNAMENAV.includes('orderconfirmation');
+    const isTransparent = URLNAMENAV.includes('login')||URLNAMENAV.includes('orderconfirmation')|| URLNAMENAV.includes('services/paymentmethod.html');
     let nav_html = `
 <header class="header-area section-padding-1 transparent-bar" ${isTransparent ?'style="background:#0A1039"' :''}>
             <div class="header-large-device">
@@ -55,7 +57,7 @@ function navINIT() {
                             <div class="logo-menu-wrap d-flex">
                                 <div class="logo">
                                     <a href="../index.html">
-                                        <img src="../dist/assets/imgs/anwi-logo-2.png" alt="logo" class="w-50">
+                                        <img src="/dist/assets/imgs/anwi-logo-2.png" alt="logo" class="w-50">
                                     </a>
                                 </div>
                                 <div class="main-menu menu-lh-1 main-menu-padding-1">
@@ -200,13 +202,13 @@ function navINIT() {
                             </div>
                             <div class="header-action-wrap header-action-flex header-action-width header-action-mrg-1">
                                 <div class="same-style">
-                                <a href="./myaccount.html" class="my_avatar">
+                                <a href="/myaccount.html" class="my_avatar">
                       
                                 <svg style="width:20px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-2f4a9ed6" data-di-rand="1682677695656"><path fill="#fff" d="M48 50c17.346 0 32 14.221 32 31.054V89c0 2.757-2.243 5-5 5H21c-2.757 0-5-2.243-5-5v-7.946C16 64.221 30.654 50 48 50zm0 8c-12.785 0-24 10.773-24 23.054V86h48v-4.946C72 68.773 60.785 58 48 58zm-.002-56c12.133 0 22.003 9.87 22.003 22.001C70 36.131 60.13 46 47.998 46c-12.13 0-21.997-9.869-21.997-21.999C26 11.87 35.867 2 47.998 2zm0 8c-7.718 0-13.997 6.281-13.997 14.001C34 31.72 40.28 38 47.998 38 55.718 38 62 31.72 62 24.001 62 16.281 55.719 10 47.998 10z"></path></svg>
                                 </a>
                                 </div>
                                 <div class="same-style header-cart">
-                                <a class="cart-active1 position-relative" href="./shopping-cart.html">
+                                <a class="cart-active1 position-relative" href="/shopping-cart.html">
                                 <svg  style="width:20px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-90f52cd9" data-di-rand="1682677695656"><path  fill="#fff"  d="M72.848 70.25c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11 4.925-11 11-11zm-35 0c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11c0-6.074 4.926-11 11-11zm35 7a4 4 0 10.002 8.001 4 4 0 00-.002-8.001zm-35 0a4 4 0 100 8 4 4 0 000-8zM13.892 3.75c2.287 0 4.376 1.55 5.058 3.72l.064.22 2.97 11.187h68.128a4.727 4.727 0 014.661 5.786l-.048.2-9.559 36.291c-.583 2.216-2.618 3.842-4.894 3.944l-.228.005H30.06c-2.287 0-4.377-1.55-5.06-3.72l-.063-.219-13.124-49.413-10.7.006-.004-8 12.782-.007zm72.03 23.127H24.108l8.027 30.226H77.96l7.962-30.226z"></path></svg>
                                 
                                 <span class="position-absolute cartnumcount d-none" >0</span>
@@ -231,7 +233,7 @@ function navINIT() {
                                 </div>
                                 <div class="mobile-logo mobile-logo-width ps-3">
                                     <a href="../index.html">
-                                        <img alt="" src="../dist/assets/imgs/anwi-logo-1.png" class="w-50">
+                                        <img alt="" src="/dist/assets/imgs/anwi-logo-1.png" class="w-50">
                                     </a>
                                 </div>
                             </div>
@@ -239,10 +241,10 @@ function navINIT() {
                         <div class="col-6">
                             <div class="header-action-wrap header-action-flex header-action-mrg-1">
                                 <div class="same-style">
-                                <a href="./myaccount.html" class="my_avatar"> <svg style="width:22px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-2f4a9ed6" data-di-rand="1682677695656"><path fill="#fff" d="M48 50c17.346 0 32 14.221 32 31.054V89c0 2.757-2.243 5-5 5H21c-2.757 0-5-2.243-5-5v-7.946C16 64.221 30.654 50 48 50zm0 8c-12.785 0-24 10.773-24 23.054V86h48v-4.946C72 68.773 60.785 58 48 58zm-.002-56c12.133 0 22.003 9.87 22.003 22.001C70 36.131 60.13 46 47.998 46c-12.13 0-21.997-9.869-21.997-21.999C26 11.87 35.867 2 47.998 2zm0 8c-7.718 0-13.997 6.281-13.997 14.001C34 31.72 40.28 38 47.998 38 55.718 38 62 31.72 62 24.001 62 16.281 55.719 10 47.998 10z"></path></svg></a>
+                                <a href="/myaccount.html" class="my_avatar"> <svg style="width:22px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-2f4a9ed6" data-di-rand="1682677695656"><path fill="#fff" d="M48 50c17.346 0 32 14.221 32 31.054V89c0 2.757-2.243 5-5 5H21c-2.757 0-5-2.243-5-5v-7.946C16 64.221 30.654 50 48 50zm0 8c-12.785 0-24 10.773-24 23.054V86h48v-4.946C72 68.773 60.785 58 48 58zm-.002-56c12.133 0 22.003 9.87 22.003 22.001C70 36.131 60.13 46 47.998 46c-12.13 0-21.997-9.869-21.997-21.999C26 11.87 35.867 2 47.998 2zm0 8c-7.718 0-13.997 6.281-13.997 14.001C34 31.72 40.28 38 47.998 38 55.718 38 62 31.72 62 24.001 62 16.281 55.719 10 47.998 10z"></path></svg></a>
                                 </div>
                                 <div class="same-style header-cart">
-                                <a class="cart-active1 position-relative" href="./shopping-cart.html"> <svg  style="width:22px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-90f52cd9" data-di-rand="1682677695656"><path  fill="#fff"  d="M72.848 70.25c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11 4.925-11 11-11zm-35 0c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11c0-6.074 4.926-11 11-11zm35 7a4 4 0 10.002 8.001 4 4 0 00-.002-8.001zm-35 0a4 4 0 100 8 4 4 0 000-8zM13.892 3.75c2.287 0 4.376 1.55 5.058 3.72l.064.22 2.97 11.187h68.128a4.727 4.727 0 014.661 5.786l-.048.2-9.559 36.291c-.583 2.216-2.618 3.842-4.894 3.944l-.228.005H30.06c-2.287 0-4.377-1.55-5.06-3.72l-.063-.219-13.124-49.413-10.7.006-.004-8 12.782-.007zm72.03 23.127H24.108l8.027 30.226H77.96l7.962-30.226z"></path></svg>
+                                <a class="cart-active1 position-relative" href="/shopping-cart.html"> <svg  style="width:22px;" viewBox="0 0 96 96" xmlns="http://www.w3.org/2000/svg" focusable="false" aria-hidden="true" class="icon" data-di-res-id="e576e1a9-90f52cd9" data-di-rand="1682677695656"><path  fill="#fff"  d="M72.848 70.25c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11 4.925-11 11-11zm-35 0c6.075 0 11 4.925 11 11s-4.925 11-11 11-11-4.925-11-11c0-6.074 4.926-11 11-11zm35 7a4 4 0 10.002 8.001 4 4 0 00-.002-8.001zm-35 0a4 4 0 100 8 4 4 0 000-8zM13.892 3.75c2.287 0 4.376 1.55 5.058 3.72l.064.22 2.97 11.187h68.128a4.727 4.727 0 014.661 5.786l-.048.2-9.559 36.291c-.583 2.216-2.618 3.842-4.894 3.944l-.228.005H30.06c-2.287 0-4.377-1.55-5.06-3.72l-.063-.219-13.124-49.413-10.7.006-.004-8 12.782-.007zm72.03 23.127H24.108l8.027 30.226H77.96l7.962-30.226z"></path></svg>
                                 <span class="position-absolute cartnumcount d-none"  style="top:-27%;right:-80%">0</span>
                                 </a>
                                 </div>
@@ -259,7 +261,7 @@ function navINIT() {
                 <div class="col-6">
                     <div class="mobile-logo mobile-logo-width">
                         <a href="../index.html">
-                            <img alt="" src="../dist/assets/imgs/anwi-logo-1.png" class="w-75">
+                            <img alt="" src="/dist/assets/imgs/anwi-logo-1.png" class="w-75">
                         </a>
                     </div>
                 </div>

dist/Js/products/products.js

@@ -8,6 +8,7 @@ function ramProductsInit(){
 
     function getProductIdService(){
         return new Promise(async (reslove,reject)=>{
+            
             let resData =await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/products/getallproducts`,true); 
            if(resData.isError){
                 alert(resData.errorMsg.message);
@@ -56,7 +57,7 @@ function ramProductsInit(){
 
         console.log(res);
         let html = '';
-debugger;
+
         for(let i=0;i<res.length;i++){
             html += getRamCardHTML(res[i]);
         }
@@ -64,10 +65,10 @@ debugger;
         $('.product_card_section').html(html);
 
         $('.ramcard').click(function(e){
-            debugger;
+     
             let sku = $(e.target).data('itemid');
             let itemid = $(e.target).data('itemid');
-            debugger;
+   
             window.location.href = `/productdetails.html?productId=${RAM_ID}#itemid=${itemid}`
 
         })
@@ -168,5 +169,5 @@ debugger;
 
     init();
 }
-debugger;
+
 ramProductsInit();

dist/Js/shoppingcart/select_delivery.js

@@ -117,10 +117,12 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
     }
 
     function clearAllInputs(){
-        $("#state").select2({
-            placeholder: "Select a City",
-            allowClear: true
-        });
+        // $("#state").select2({
+        //     placeholder: "Select a City",
+        //     allowClear: true
+        // });
+
+        $('#state').val(null);
 
         $('#phonenumber').val(null);
         $('#addressdes').val(null);
@@ -141,11 +143,14 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
             $('#addressdes').val(addressline);
             $('#zipcode').val(zipcode);
             debugger;
+             $('#state').attr('data-id',cityid);
+            $('#state').val(cityname)
             $('.userNamelogin').html(`${userName}`);
 
         editMode = true;
-        console.log(stateArr);
-        renderStates(stateArr);
+//        console.log(stateArr);
+        renderCustomStateDropdown(stateArr);
+        //renderStates(stateArr);
 
     }
 
@@ -185,6 +190,8 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
             $('#addressdes').val(addressline);
             $('#zipcode').val(zipcode);
             debugger;
+             $('#state').attr('data-id',cityid);
+            $('#state').val(cityname);
             $('.userNamelogin').html(`${userName}`);
             changeAddressBtnAction.addChangeAddressBtn()
             getCountryStateCurrency();
@@ -200,7 +207,7 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
     }
 
     function setAddressHeader({name,phonenumber,addressline,cityname,zipcode}){
-        $('.innerDisplayAddress').html(`${name}-${phonenumber}, ${addressline}, ${cityname} - `);
+        $('.innerDisplayAddress').html(`${phonenumber}, ${addressline}, ${cityname} - `);
         $('.zipcodeAddress').html(`${zipcode}`);
 
     }
@@ -209,7 +216,7 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
    
         let number = $('#phonenumber').val();
         let zipcode = $('#zipcode').val();
-        let state = $('#state').val();
+        let state = $('#state').data('id');
         let address = $('#addressdes').val();
 
         let isTrue = false;
@@ -244,7 +251,7 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
         let { userId, name } = cookieRes;
         const ctyId =   await getCountryId();
         
-        let stateId = parseInt($('#state').val());
+        let stateId = parseInt($('#state').data('id'));
          let payload = {
                 "cityid": stateId,
                 "CityName":$(`[data-id="${stateId}"`).html(),
@@ -273,7 +280,7 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
             // http://localhost:3088/apis/v4/bizgaze/crm/address/savebillinginfo
 
 
-            setAddressHeader({name,phonenumber:$('#phonenumber').val(),addressline: $('#addressdes').val(),cityname:$(`[data-id="${stateId}"`).html(),zipcode:$('#zipcode').val()});
+            setAddressHeader({name,phonenumber:$('#phonenumber').val(),addressline: $('#addressdes').val(),cityname:$('#state').val(),zipcode:$('#zipcode').val()});
 
             return new Promise((reslove,reject) => {
                 reslove(res);
@@ -291,14 +298,14 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
         console.log(resAnwi, 'befores');
         resAnwi = resAnwi[resAnwi.length - 1];
 
-        let stateId = parseInt($('#state').val());
+        let stateId = parseInt($('#state').data('id'));
         let payload = {
             ...resAnwi,
             phonenumber:$('#phonenumber').val(),
             addressline1:$('#addressdes').val(),
             zipcode:$('#zipcode').val(),
             cityid:stateId,
-            CityName:$(`[data-id="${stateId}"`).html(),
+            CityName:$('#state').val(),
            
         }
 
@@ -314,9 +321,62 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
         })
     }
 
+
+    function onChangeState(e){
+        let userItem = e.target.value.toLowerCase();
+        let limit = 10;
+        let results = [];
+        let maxLen = stateArr.length > 10 ? 10 :stateArr.length;
+        debugger
+        for(let i=0;i<stateArr.length;i++){
+            let currItem = stateArr[i];
+            let stateName = currItem.cityname.toLowerCase();
+            if(stateName.includes(userItem)){
+                results.push(currItem);
+                if(results.length>=10) break;
+            }
+        }
+
+        renderCustomStateDropdown(results);
+        loadDropdownStateEvents();
+
+
+    }
+
+    function loadDropdownStateEvents(){
+        $('#state').off().focus(function (){
+            $('.stateBox').removeClass('d-none');
+            $(document).off('click').click(closeDrop);
+
+           
+        })
+
+     
+        $(document).off().click(closeDrop);
+
+        function closeDrop(e){
+            let id = $(e.target).hasClass('stateoption');
+            if($(e.target).attr('id')==='state') return;
+            if(id) {
+                $('.stateBox').addClass('d-none');
+                $(document).off();
+            }else{
+                $('.stateBox').addClass('d-none');
+                $(document).off();
+            }
+
+        }
+
+        $('#state').keyup(debounce(function (event){
+            onChangeState(event)
+        })); 
+    }
     
 
     async function loadEvents() {
+
+        loadDropdownStateEvents();
+
         $('.addnewAddressContainer').off('click').click(function (e) {
             $('.addnewAddressContainer').addClass('d-none');
             $('.addresslist').removeClass('d-none');
@@ -353,7 +413,7 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
 
         
         $('.saveanddeliver').off('click').click(async function (e) {
-           
+           debugger;
             saveFormLoading.addSpinner()
             let isErrorForm =  checkForm();
 
@@ -365,7 +425,7 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
             if(editMode){
                 res = await saveForm();
             }else{
-                res = createBillingForm();
+                res = await createBillingForm();
             }
             saveFormLoading.removeSpinner();
 
@@ -389,8 +449,8 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
             // zipcode:$('#zipcode').val(),
             // cityid:stateId,
             // CityName:$(`[data-id="${stateId}"`).html(),
-            let stateId = parseInt($('#state').val());
-            setAddressHeader({name,addressline:$('#addressdes').val(),cityname:$(`[data-id="${stateId}"`).html(),phonenumber:$('#phonenumber').val(),zipcode:$('#zipcode').val()});
+            let stateId = parseInt($('#state').data('id'));
+            setAddressHeader({name,addressline:$('#addressdes').val(),cityname:$(`#state`).val(),phonenumber:$('#phonenumber').val(),zipcode:$('#zipcode').val()});
 
 
             $('.errMsgFormEdit').html('');
@@ -551,7 +611,7 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
     function renderStates(data){
         $('#state').off('select2:select');
         let html = '';
-        for (let i = 0; i < data.length; i++) {
+        for (let i = 0; i < 10; i++) {
             html += `<option value="${data[i].cityid}" data-id="${data[i].cityid}">${data[i].cityname}</option>`
 
         }
@@ -585,6 +645,7 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
             }
         }
 
+        //    const stateRes = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/unibase/platform/forms/autocomplete/docpropertyid/116631530005773/columnname/statusid/value/1%7C/formpropertyid/116631620000066/formid/116631640000040/bindeddata/undefined/term/h/authtoken/2cd31fdd-440b-4eea-9039-659ab090628a?term=h&type=GET`);
         const stateRes = await API_SERVICES_ACTIONS.getAPIService(`apis/v4/bizgaze/integrations/anwiauth/getcities/countryid/${countryID}`);
 
         if (stateRes.isError) {
@@ -595,15 +656,16 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
 
         let stateData = JSON.parse(stateRes.response.result);
 
-        console.log(stateData, 'state');
+//        console.log(stateData, 'state');
 
 
-        $('#state').html('');
+        $('#state').val(null);
         console.log("start")
         let html = '';
         statesList = stateData;
         stateArr = stateData;
-        renderStates(stateArr)
+        renderCustomStateDropdown(stateArr);
+        //renderStates(stateArr)
 
        
 
@@ -627,6 +689,30 @@ let Newuser =window.localStorage.getItem('isaccountCreated');
         }
     }
 
+    function getCustomDropDownHTML({cityid,cityname,countryid}){
+        return ` <div class="bg-white stateoption px-2 border-bottom py-2 cursor-pointer" data-name="${cityname}" data-value="${cityid}">${cityname}</div>`;
+    }
+
+    function renderCustomStateDropdown(stateList){
+        let html = ``;
+        debugger;;
+        let maxLen = stateList.length > 10 ? 10 :stateList.length
+        for(let i=0;i<maxLen;i++){
+            let currItem = stateList[i];
+            html+=getCustomDropDownHTML(currItem);
+        }
+
+        $('.stateBox').html(html);
+
+        $('.stateoption').off().click(function(e){
+            debugger;
+            const name = $(e.target).data('name');
+            const id = $(e.target).data('value');
+            $('#state').val(name);
+            $('#state').attr('data-id',id);
+        })
+    }
+
     function loadShippingProducts(){
         $('.detailsAddressBg').removeClass('detailsAddressBg');
         $('.ordersummaryheader ').addClass('detailsAddressBg')
@@ -644,10 +730,11 @@ debugger;
         // $('.orderslist').html(productsHTML);
         $('.orderslist').addClass("p-3")
         $('.orderslist').html(` <label for="online">
-        Online
         <input checked data-op="online" name="payment" type="radio" class="paymentbtn   " id="online">
+        <span>Pay Via (Card, Net Banking, Wallet)</span>
+       
     </label>
-    <label for="cod">
+    <label for="cod" class="d-none">
         Cash on delivery
         <input data-op="cod" name="payment" type="radio" class="paymentbtn  " id="cod">
     </label>`);

dist/Js/shoppingcart/shoppingcart.js

@@ -6,14 +6,14 @@ function shoppingCartInit() {
     let DELETE_FILTER = null;
 
     let insufficientQtyActions = {
-        moreQtyAdd(e){
+        moreQtyAdd(e) {
             $(e.target).parents('.mainselectcontainer').find('.insufficientqty').removeClass('d-none');
         },
 
-        moreQtyRemove(e){
+        moreQtyRemove(e) {
             $(e.target).parents('.mainselectcontainer').find('.insufficientqty').addClass('d-none');
         }
-        
+
     }
 
     function shoppingCartAppend() {
@@ -28,19 +28,19 @@ function shoppingCartInit() {
         let html = '';
         let products = data;
 
-        
+
 
         // for(let i=0;i<products.length;i++){
         //     const {img,name,price,quantity,total} = products[i];
         //     debugger;
         //     html += shoppingCartDesktopHTML(products[i]);
         // }
-        if(Object.keys(data).length === 0) {
+        if (Object.keys(data).length === 0) {
             $('.checkoutbtn').addClass('d-none');
             $('.emptyShow').removeClass('d-none');
         }
         setLengthCart();
-        console.log(products,'products');
+        console.log(products, 'products');
         for (let product in products) {
 
             html += shoppingCartDesktopHTML({ ...products[product], total: products[product].quantity * products[product].price, id: product });
@@ -67,11 +67,11 @@ function shoppingCartInit() {
                         $(e.target).parents('.mainselectcontainer').find('.inputcartaddmore button').off().click(function (item) {
                             const val = $(item.target).parent().find('input').val();
                             debugger;
-                            let totalQty  = $(this).parents('.mainselectcontainer').data('qty');
+                            let totalQty = $(this).parents('.mainselectcontainer').data('qty');
 
-                            if(val<=0 || totalQty< val){
+                            if (val <= 0 || totalQty < val) {
                                 insufficientQtyActions.moreQtyAdd(e);
-                                return; 
+                                return;
                             }
 
                             let id = $(item.target).parents('.mainselectcontainer').data('id');
@@ -84,11 +84,11 @@ function shoppingCartInit() {
 
                         })
                     } else {
-                        let totalQty  = $(e.target).parents('.mainselectcontainer').data('qty');
+                        let totalQty = $(e.target).parents('.mainselectcontainer').data('qty');
                         const val = $(e.target).parent().find('input').val();
-                        if(val<=0 || totalQty< val){
+                        if (val <= 0 || totalQty < val) {
                             insufficientQtyActions.moreQtyAdd(e);
-                            return; 
+                            return;
                         }
                         let id = $(e.target).parents('.mainselectcontainer').data('id');
                         updateCartQuantity(id, num);
@@ -99,16 +99,16 @@ function shoppingCartInit() {
             } else {
                 $(element).parents('.mainselectcontainer').find('.inputcartaddmore button').off().click(function (item) {
                     debugger;
-                  
+
                     const val = $(item.target).parent().find('input').val()
-                    let totalQty  = $(this).parents('.mainselectcontainer').data('qty');
+                    let totalQty = $(this).parents('.mainselectcontainer').data('qty');
 
-                    if(val<=0 || totalQty< val){
+                    if (val <= 0 || totalQty < val) {
                         insufficientQtyActions.moreQtyAdd(item);
-                      
-                        return; 
+
+                        return;
                     }
-                   
+
                     let id = $(item.target).parents('.mainselectcontainer').data('id');
                     updateCartQuantity(id, val);
                     //    $(item.target).parents('.mainselectcontainer').find('.inputcartaddmore').addClass('d-none');
@@ -120,24 +120,24 @@ function shoppingCartInit() {
             }
         });
 
-        $('.removeitemcartmodal').off('click').click(function (){
-            
-           
-                setCartData( DELETE_FILTER );
-                setLengthCart();
-                shoppingCartAppend();
-
-                let len = Object.keys(DELETE_FILTER).length
-                if(!len){
-    
-                    $('.checkoutbtn').addClass('d-none');
-                    $('.emptyShow').removeClass('d-none');
-                }else{
-                    $('.checkoutbtn').removeClass('d-none');
-                    $('.emptyShow').addClass('d-none');
-                }
+        $('.removeitemcartmodal').off('click').click(function () {
+
+
+            setCartData(DELETE_FILTER);
+            setLengthCart();
+            shoppingCartAppend();
+
+            let len = Object.keys(DELETE_FILTER).length
+            if (!len) {
+
+                $('.checkoutbtn').addClass('d-none');
+                $('.emptyShow').removeClass('d-none');
+            } else {
+                $('.checkoutbtn').removeClass('d-none');
+                $('.emptyShow').addClass('d-none');
+            }
+
 
-             
         });
 
         $('.btndeletecart').each(function (i, element) {
@@ -149,44 +149,44 @@ function shoppingCartInit() {
                 debugger;
                 const products = data;
                 const productsFilter = {};
-              
+
                 $('#modalremovecart').html(products[cardId].name);
                 for (let product in products) {
                     if (product != cardId) productsFilter[product] = products[product];
                 }
 
 
-                data  = productsFilter;
+                data = productsFilter;
 
                 console.log(data);
-                DELETE_FILTER  = data;
+                DELETE_FILTER = data;
                 // setCartData(data);
                 // setLengthCart();
                 // shoppingCartAppend();
             });
         });
 
-        $('.checkoutbtn').click(async function (e){
+        $('.checkoutbtn').click(async function (e) {
             $('.checkoutbtn').find('span').addClass('d-none');
             $('.checkoutbtn').find('div').removeClass('d-none');
             const res = await COOKIE_HELPER.validateToken();
-            if(!res.response){
-                localStorage.setItem(CART_ADD,true);
+            if (!res.response) {
+                localStorage.setItem(CART_ADD, true);
                 window.location.href = '/login.html';
-                
+
                 $('.checkoutbtn').find('span').removeClass('d-none');
                 $('.checkoutbtn').find('div').addClass('d-none');
-                 return;
+                return;
             }
             window.location.href = '/selectdelivery.html';
             $('.checkoutbtn').find('span').removeClass('d-none');
             $('.checkoutbtn').find('div').addClass('d-none');
-            
-            
+
+
         });
     }
 
-    function getQuantityHTML(value,totalQty, id) {
+    function getQuantityHTML(value, totalQty, id) {
         return `<div data-id="${id}" data-qty="${totalQty}" class="mainselectcontainer w-100">
         <div class="w-50">
        
@@ -217,64 +217,70 @@ function shoppingCartInit() {
         </div>`
     }
 
-    function shoppingCartDesktopHTML({ id, img, name, price, description, quantity, total,totalQty,productid,itemid }) {
-        const [currencySymbol,amt] = getCurrencySymbol(price);
+    function shoppingCartDesktopHTML({ id, img, name, price, description, quantity, total, totalQty, productid, itemid }) {
+        const [currencySymbol, amt] = getCurrencySymbol(price);
+      let tamt = 0;
+        {
+            const [currencySymbol, amt] = getCurrencySymbol(total);
+            tamt = amt;
+        }
         return `
-        <div class="row bg-white  border-bottom py-4 d-flex justify-content-center align-items-center">
-        <div class="col-md-2 text-center"><img src="${img}" alt="${name}" class="img-fluid"></div>
-        <div class="col-md-4 ">
-          
-            <a class="text-decoration-none text-blue fw-600 cursor-pointer" href="productdetails.html?productId=${productid}#itemid=${itemid}">${name}</a>
-            <small>${description||''}</small>
-            <span class="badge d-none text-bg-warning">8 Offers ></span>   
-        </div>
-        <div class="col-md-2">
-            <p class="text-right m-0"><span>${currencySymbol}</span> ${amt}</p>
-        </div>
-        <div class="col-md-2 ">
-   
-            ${getQuantityHTML(quantity,totalQty, id)}
-        </div>
-        <div class="col-md-2 ">
-            <div class="d-flex justify-content-between w-100">
-                <p class="fw-bold m-0"><svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-currency-rupee" viewBox="0 0 16 16">
-                    <path d="M4 3.06h2.726c1.22 0 2.12.575 2.325 1.724H4v1.051h5.051C8.855 7.001 8 7.558 6.788 7.558H4v1.317L8.437 14h2.11L6.095 8.884h.855c2.316-.018 3.465-1.476 3.688-3.049H12V4.784h-1.345c-.08-.778-.357-1.335-.793-1.732H12V2H4v1.06Z"/>
-                  </svg>${total}</p>
-                <span class="btndeletecart cursor-pointer fw-500 text-danger" data-cartid="${id}" data-bs-toggle="modal" data-bs-target="#deletecartmodal">x</span>
-            </div>
-        </div>
-        <div class="warrenty-sec px-3 sec-space-4 d-none">
-            <div class="row align-items-center border  py-2 mx-4">
-                <div class="col-md-8">
-                    <p class="mb-0 "> <img src="./dist/assets/imgs/Home/Anwi-cart-logo.png" alt="shopping-cart-item-img"> Anwi Extended Warranty 2 Year: Protect your Laptop for another 2 years Learn more </p>
-                </div>
-                <div class="col-md-3">
-                    <p class="text-end mb-0"> ₹3,200 (2 year)
-                    </p>
-                </div>
-            </div>
-            <div class="row align-items-center border  py-2 mx-4 mt-3">
-                <div class="col-md-8">
-                    <p class="mb-0"> <img src="./dist/assets/imgs/Home/Anwi-cart-logo-2.png" alt="shopping-cart-item-img"> Anwi Extended Warranty 2 Year: Protect your Laptop for another 2 years Learn more </p>
-                </div>
-                <div class="col-md-3">
-                    <p class="text-end mb-0"> ₹2,900 (2 year)
-                    </p>
-                </div>
-            </div>
-        </div>
+       <div class="d-none d-md-block">
+       
+       <div  class="row bg-white   border-bottom py-4 d-flex justify-content-center align-items-center">
+       <div class="col-md-2 text-center"><img src="https://appassets.bizgaze.app/_files/documents/663/5f6dc634-ffba-47d3-90d2-63004d9d41b6/LAPTOP_DDR5_32GB.jpeg" alt="${name}" class="img-fluid"></div>
+       <div class="col-md-4 ">
+         
+           <a class="text-decoration-none text-blue fw-600 cursor-pointer" href="productdetails.html?productId=${productid}#itemid=${itemid}">${name}</a>
+           <small>${description || ''}</small>
+           <span class="badge d-none text-bg-warning">8 Offers ></span>   
+       </div>
+       <div class="col-md-2">
+           <p class="text-right m-0"><span>${currencySymbol}</span> ${amt}</p>
+       </div>
+       <div class="col-md-2 ">
+  
+           ${getQuantityHTML(quantity, totalQty, id)}
+       </div>
+       <div class="col-md-2 ">
+           <div class="d-flex justify-content-between w-100">
+               <p class="fw-bold m-0">
+                 ${currencySymbol}${tamt}</p>
+               <span class="btndeletecart cursor-pointer fw-500 text-danger" data-cartid="${id}" data-bs-toggle="modal" data-bs-target="#deletecartmodal">x</span>
+           </div>
+       </div>
+       
+   </div>
+
+       </div>
+    <div class="row d-block d-md-none smallcart py-3">
+    <div class="row bg-white py-5 m-0">
+    <div class="col-4 text-center">
+    <img src="https://appassets.bizgaze.app/_files/documents/663/5f6dc634-ffba-47d3-90d2-63004d9d41b6/LAPTOP_DDR5_32GB.jpeg" alt="${name}" class="img-fluid">
+</div>
+<div class="col-8 position-relative d-flex flex-column gap-1">
+
+    <div class="">
+        <span>
+            <a class="text-decoration-none text-blue fw-600 cursor-pointer" href="productdetails.html?productId=${productid}#itemid=${itemid}"><span class="">${name}</span></a>
+        </span>
     </div>
+    <div>
+    <p class="fw-bold m-0">
+    ${currencySymbol}${tamt}</p>
+    </div>
+    <div class="text-truncate d-none">
+            <small>${description || ''}</small>
+    </div>
+     <div class="">
 
-    <div class=" bg-white mt-3 rounded py-3 d-block d-sm-none ">
-        <div class="row">
-            <div class=""></div>
-        </div>
-
-
-        <div>
-
-        </div>
+        ${getQuantityHTML(quantity, totalQty, id)}
+    </div>
+   
+    <span class="btndeletecart cursor-pointer fw-500 text-danger" data-cartid="${id}" data-bs-toggle="modal" data-bs-target="#deletecartmodal">x</span>
+    </div>
     </div>
+</div>
         `;
     }
 }

dist/Js/utils/helpers.js

@@ -1,5 +1,5 @@
 
-const uid = function(){
+const uid = function () {
     return Date.now().toString(36) + Math.random().toString(36).substr(2);
 }
 
@@ -22,46 +22,66 @@ function shuffleArray(array) {
     }
 }
 
-function getCurrencySymbol(value=0) {
+function debounce(func, delay=500) {
+    let timeoutId;
+    return function(...args) {
+      const context = this;
+      clearTimeout(timeoutId);
+      timeoutId = setTimeout(() => {
+        func.apply(context, args);
+      }, delay);
+    };
+  }
+
+function getCurrencySymbol(value = 0) {
     let type = 'INR'
     if (type) {
         const ans = new Intl.NumberFormat('en-IN', { style: 'currency', currency: type }).format(value);;
         const res = ans.split(/(\D+)/);
         const currencySymbol = res[1];
-        const amount = res.slice(2,res.length).join('')
+        const amount = res.slice(2, res.length).join('')
 
 
-        return [currencySymbol,amount]
+        return [currencySymbol, amount]
     } else {
-        console.log("errrrrrrrrrrrrrrrrrrrrrrrrr",type);
-        return ['',0];
+        console.log("errrrrrrrrrrrrrrrrrrrrrrrrr", type);
+        return ['', 0];
     }
 }
 
-function toasterHelper(type,message,align='toast-top-center'){
+function toasterHelper(type, message, align = 'toast-top-center') {
     // toasterOpts()
     debugger;
     toastr.clear()
     toasterOpts(align);
-Command: toastr[type](message);
+    Command: toastr[type](message);
 
-function toasterOpts(align){
-    toastr.options = {
-        "closeButton": true,
-        "debug": false,
-        "newestOnTop": true,
-        "progressBar": true,
-        "positionClass": align,
-        "preventDuplicates": true,
-        "onclick": null,
-        "showDuration": "300",
-        "hideDuration": "1000",
-        "timeOut": "5000",
-        "extendedTimeOut": "1000",
-        "showEasing": "swing",
-        "hideEasing": "linear",
-        "showMethod": "fadeIn",
-        "hideMethod": "fadeOut"
+    function toasterOpts(align) {
+        toastr.options = {
+            "closeButton": true,
+            "debug": false,
+            "newestOnTop": true,
+            "progressBar": true,
+            "positionClass": align,
+            "preventDuplicates": true,
+            "onclick": null,
+            "showDuration": "300",
+            "hideDuration": "1000",
+            "timeOut": "5000",
+            "extendedTimeOut": "1000",
+            "showEasing": "swing",
+            "hideEasing": "linear",
+            "showMethod": "fadeIn",
+            "hideMethod": "fadeOut"
+        }
     }
-  }
-}
+}
+
+
+function containsSpecialCharsHelper(str) {
+    const specialChars = /[`!@#$%^&*()_+\-=\[\]{};':"\\|,.<>\/?~]/;
+    return specialChars.test(str);
+}
+const isUpperCaseHelper = (string) => /^(?=.*[A-Z])/.test(string);
+const isLowerCaseHelper = (string) => /^(?=.*[a-z])/.test(string);
+const isNumberContainsHelper = (string) => /\d/.test(string);

dist/css/main.css

@@ -1541,7 +1541,8 @@ display: none;
 /* Styles for verification */
 .pswd_info {
     position: absolute;
-    top: 100%;
+    top: -160px;
+    right: 0;
     width: 250px;
     padding: 10px;
     background: #fefefe;
@@ -1555,13 +1556,14 @@ display: none;
 .pswd_info::before {
     content: "\25B2";
     position: absolute;
-    top: -12px;
+    bottom: -12px;
     left: 45%;
     font-size: 14px;
     line-height: 14px;
     color: #ddd;
     text-shadow: none;
     display: block;
+    transform: rotate(180deg);
 }
 
 .pswd_invalid {

dist/css/style.css

@@ -31822,4 +31822,40 @@ input[type=number]::-webkit-outer-spin-button {
   #carouselExampleAutoplaying{
     padding-top: 3rem;
   }
+  .services.bg-gradient-anwi{
+    display: none;
+  }
+}
+
+.form-control.is-invalid, .was-validated .form-control:invalid{
+  background-image: none !important;
+}
+
+.authloginLoadingBtn,.otploading {
+  width: 20px;
+  height: 20px;
+}
+.btnForgotback{
+  cursor: pointer;
+}
+
+.smallcart .btndeletecart{
+  position: absolute;
+  top: -35%;
+  right: 0;
+  font-size: 25px;
+}
+
+.stateBoxParent{
+ 
+  position: relative;
+}
+
+.stateBox{
+  height: 170px;
+    position: absolute;
+    bottom: -170px;
+    width: 94%;
+    z-index: 1;
+    overflow-y: auto;
 }

index.html

@@ -390,11 +390,11 @@
     <script src="./libs/bootstrap/js/bootstrap.bundle.min.js"></script>
     <script src="./dist/js/jquery.min.js"></script>
     <script src="./libs/owlcarousel/js/owl.carousel.min.js"></script>
-    <script src="./dist/js/navbar.js"></script>
+
    <script src="./libs/axios.min.js"></script>
-    <script src="./dist/js/footer.js"></script>
+
       <script src="./libs/cookies.min.js"></script>
-    <script src="./dist/js/auth/apiservice.js"></script>
+
     <script src="./dist/toaster/toastr.js"></script>
     <script src="./dist/js/fontawesome.all.js"></script>
     <script src="./dist/js/fontawesome.min.js"></script>
@@ -413,25 +413,29 @@
     <script src="./dist/js/plugins/magnific-popup.js"></script> -->
     <!-- Main JS -->
 
+    <script src="./dist/js/footer.js"></script>
+    <script src="./dist/js/auth/apiservice.js"></script>
+    <script src="./dist/js/navbar.js"></script>
     <script src="./dist/js/main.js"></script>
     <script src="./dist/js/index/index.js"></script>
 
 
     <script>
-            $(document).ready(function() {
-        let Newuser =window.localStorage.getItem('isaccountCreated');
-        let Loginstatus =window.localStorage.getItem('Isloggedintoaster')
-        if(Newuser == 'true'){
+             $(document).ready(function() {
+        let Newuser =window.localStorage.getItem(USER_AUTH_OKAY);
+      
+        if(Newuser == 1){
             toasteropts()
             Command: toastr["success"]("Account Created Successfully");
-            window.localStorage.removeItem('isaccountCreated')
+            window.localStorage.removeItem(USER_AUTH_OKAY)
             return
-        }
-        if(Loginstatus == 'true'){
+        }else if(Newuser == 2){
+          
             toasteropts()
             Command: toastr["success"]("Logged In Successfully");
-            window.localStorage.removeItem('Isloggedintoaster')
+            window.localStorage.removeItem(USER_AUTH_OKAY)
             return
+       
         }
     function toasteropts(){
        toastr.options = {

login.html

@@ -7,28 +7,16 @@
     <meta http-equiv="X-UA-Compatible" content="ie=edge" />
 
     <link rel="stylesheet" href="./libs/bootstrap/css/bootstrap.min.css" />
+    <link rel="stylesheet" href="./dist/css/fontawesome.all.css" />
+    <link rel="stylesheet" href="./dist/toaster/toastr.css" />
+
     <link rel="stylesheet" href="./dist/css/main.css" />
     <link rel="stylesheet" href="./styles/style.css" />
+    <link rel="stylesheet" href="./dist/css/style.css" />
     <link rel="stylesheet" href="./style.css" />
-    <link rel="stylesheet" href="./libs/owlcarousel/Css/owl.carousel.min.css" />
-    <link rel="stylesheet" href="./libs/owlcarousel/Css/owl.theme.default.min.css" />
     <link rel="stylesheet" href="./dist/css/login.css" />
-    <link rel="stylesheet" href="./dist/css/vendor/bootstrap.min.css" />
-    <link rel="stylesheet" href="./dist/css/vendor/bootstrap.min.css" />
-    <link rel="stylesheet" href="./dist/css/vendor/vandella.css" />
-    <link rel="stylesheet" href="./dist/css/vendor/jellybelly.css" />
-    <link rel="stylesheet" href="./dist/css/vendor/fontello.css" />
-    <link rel="stylesheet" href="./dist/css/plugins/easyzoom.css" />
-    <link rel="stylesheet" href="./dist/css/plugins/slick.css" />
-    <link rel="stylesheet" href="./dist/css/plugins/nice-select.css" />
-    <link rel="stylesheet" href="./dist/css/plugins/animate.css" />
-    <link rel="stylesheet" href="./dist/css/plugins/magnific-popup.css" />
-    <link rel="stylesheet" href="./dist/css/plugins/jquery-ui.css" />
-    <link rel="stylesheet" href="./dist/css/style.css" />
-    <link rel="stylesheet" href="./dist/css/fontawesome.all.css" />
-    <!-- <link rel="stylesheet" href="./dist/css/fontawesome.min.css" /> -->
-    <!-- <link rel="stylesheet" href="./libs/toaster/toastr.js" /> -->
-    <link rel="stylesheet" href="./dist/toaster/toastr.css" />
+
+
     <title>Anwi</title>
 
     <style>
@@ -39,6 +27,9 @@
         body {
             height: 100%;
         }
+        .form-control.is-valid, .was-validated .form-control:valid{
+            background-image: none;
+        }
     </style>
 </head>
 
@@ -48,506 +39,29 @@
     <!-- end-navbar -->
     <!-- main-body -->
     <section class="mainLogin h-100 mt-0 myaccount-content p-0">
-        <div class="container">
-            <div class="spinner d-flex justify-content-center align-items-center">
-                <div class="spinner-border d-none" role="status">
-                    <span class="visually-hidden">Loading...</span>
-                </div>
-            </div>
-        </div>
-        
         <div class="loginContainer mainLogin bg-gradient-violet mt-0 pt-md-5 h-100 satoshi_font d-flex align-items-center">
-           
             <div class="container">
                 <div class="row  justify-content-center">
                     <div class="col-sm-4 ">
-                        <div class="card p-4 shadow rounded-3">
-                           <a href="index.html" class="text-center mx-auto   mb-5 mt-2"><img src="../dist/assets/imgs/anwi-logo-1.png" alt="logo" class="w-50"></a> 
-                            <div class="alert alert-danger error_msg " role="alert" style="font-size:12px;display:none"><svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.2646 3.41366C11.7212 3.15681 12.2788 3.15681 12.7354 3.41366L19.2354 7.06991C19.7077 7.33558 20 7.83536 20 8.37727V15.6227C20 16.1646 19.7077 16.6644 19.2354 16.9301L12.7354 20.5863C12.2788 20.8432 11.7212 20.8432 11.2646 20.5863L4.76461 16.9301C4.29229 16.6644 4 16.1646 4 15.6227V8.37727C4 7.83536 4.29229 7.33559 4.76461 7.06991L11.2646 3.41366Z" fill="#FF3A2E"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 7.4C11 7.17909 11.1791 7 11.4 7H12.6C12.8209 7 13 7.17909 13 7.4V12.6C13 12.8209 12.8209 13 12.6 13H11.4C11.1791 13 11 12.8209 11 12.6V7.4Z" fill="white"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 16C11 15.4477 11.4477 15 12 15C12.5523 15 13 15.4477 13 16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16Z" fill="white"></path></svg>
-                              <span class="error_msg_res" ></span> 
-                              </div>
-
-                            <div class="login_section">
-                            <form id="login_form">
-                                <div class="login-email-password-div">
-                                    <div class="input-group has-validation email-login-inputgroup">
-                                        <div class="form-floating py-0">
-                                            <input type="email" class="form-control shadow-none h-50p"
-                                                id="User_Email" placeholder="Enter Your Email"
-                                                autocomplete="off">
-                                            <label for="User_Email">Email address</label>
-                                        </div>
-                                        <div class="invalid-feedback">
-                                            Please enter your email.
-                                        </div>
-                                    </div>
-                                    <div class="input-group has-validation mt-3 password-login-inputgroup">
-                                        <div class="form-floating py-0" id="password-input-div">
-                                            <input type="password" class="form-control shadow-none h-50p"
-                                                id="User_password" placeholder="Password"
-                                                autocomplete="no password">
-                                            <label for="User_password">Password</label>
-                                        </div>
-                                        <div class="invalid-feedback">
-                                            Please enter your password.
-                                        </div>
-                                    </div>
-                                    <div class="my-2">
-                                        <a href="#" class="text-theme-color fs-9 fw-500" id="forgotPassword">Forgot password?</a>
-                                    </div>
-                                    <div class="fs-7 mt-2 satoshi_font">
-                                        By continuing, I agree to the
-                                        <a href="#"
-                                            class="text-theme-color text-decoration-underline fs-7 fw-600">Terms
-                                            of
-                                            Use</a>
-                                        &amp;
-                                        <a href="#"
-                                            class="text-theme-color text-decoration-underline fs-7 fw-600">Privacy
-                                            Policy</a>
-                                    </div>
-                                    <div class="mt-4 ">
-                                        <div>
-                                            <div class="btn bg-gradient-anwi w-100 loader-btn"
-                                                style="display: none;">
-                                                <span class="loader"></span>
-                                            </div>
-                                            <a href="#" class="btn bg-gradient-anwi w-100 fw-500" id="Login_btn"
-                                                type="submit">Login</a>
-                                        </div>
-                                    </div>
-                                    <div class="my-3 mt-4">
-                                    <p class="or_line"><span>or</span></p>
-
-                                    </div>
-                                    <div class="mt-4  mb-5">
-                                            <a href="#" class="btn bg-gradient-anwi-outline w-100 fw-500 register_sectionbtn" id="register_sectionbtn"
-                                                >Sign Up</a>
-                                    </div>
-                                </div>
-                                <div class="login-forgot-password-div" style="display:none">
-                                    <div
-                                        class="font-16 d-flex justify-content-end font-w600 text-darkgrey w-100 backtologin">
-                                        <!-- <span>Forgot Password?</span> -->
-                                        <a href="./login.html" class="" id="forgot_Password_Back"><span
-                                                class=" cursor-pointer text-center d-flex align-items-center"><i
-                                                    class="fa-solid fa-arrow-left"></i></span></a>
-                                    </div>
-                                    <div class="email-validation">
-                                        <div class="font-14 w-100">Please enter your email address.
-                                        </div>
-                                        <div class="input-group has-validation forgot-password-inputgroup">
-                                            <div class="form-floating py-0">
-                                                <input type="email" class="form-control shadow-none h-50p"
-                                                    id="forgot_User_Email" placeholder="Enter Your Email"
-                                                    autocomplete="off">
-                                                <label for="forgot_User_Email">Email address</label>
-                                            </div>
-                                            <div class="invalid-feedback">
-                                                Please enter your email.
-                                            </div>
-                                        </div>
-                                        <div class="mt-3">
-                                            <div>
-                                                <div class="btn bg-gradient-anwi w-100 loader-btn"
-                                                    style="display: none;">
-                                                    <span class="loader"></span>
-                                                </div>
-                                                <a href="#" class="btn bg-gradient-anwi w-100 text-white fw-500"
-                                                    id="forgot_password_submit" type="submit">Submit</a>
-                                            </div>
-                                        </div>
-                                    </div>
-                                    <div class="otp-validation">
-                                        <div class="otp-input-group mt-3" style="display: none;">
-                                            <div>
-                                                <h4 class="text-center">Enter OTP</h4>
-                                                <div class="text-center">we have sent an OTP to this Email
-                                                </div>
-                                                <p class="user_email text-center"></p>
-                                                <div class="otp-sent-email fw-600 text-center"></div>
-                                            </div>
-                                            <div class="d-flex my-4">
-                                                <div class="col">
-                                                    <div class="form-group">
-                                                        <input type="text" class="press form-control"
-                                                            name="code" maxlength="1" tabindex="1"
-                                                            autocomplete="off">
-                                                    </div>
-                                                </div>
-
-                                                <div class="col">
-                                                    <div class="form-group">
-                                                        <input type="text" class="press form-control"
-                                                            name="code" maxlength="1" tabindex="2"
-                                                            autocomplete="off">
-                                                    </div>
-                                                </div>
-
-                                                <div class="col">
-                                                    <div class="form-group">
-                                                        <input type="text" class="press form-control"
-                                                            name="code" maxlength="1" tabindex="3"
-                                                            autocomplete="off">
-                                                    </div>
-                                                </div>
-
-                                                <div class="col">
-                                                    <div class="form-group">
-                                                        <input type="text" class="press form-control"
-                                                            name="code" maxlength="1" tabindex="4"
-                                                            autocomplete="off">
-                                                    </div>
-                                                </div>
-
-                                                <div class="col">
-                                                    <div class="form-group">
-                                                        <input type="text" class="press form-control"
-                                                            name="code" maxlength="1" tabindex="5"
-                                                            autocomplete="off">
-                                                    </div>
-                                                </div>
-
-                                                <div class="col">
-                                                    <div class="form-group">
-                                                        <input type="text" class="press form-control"
-                                                            name="code" maxlength="1" tabindex="6"
-                                                            autocomplete="off">
-                                                    </div>
-                                                </div>
-                                            </div>
-                                            <div>
-                                                <div class="btn bg-gradient-anwi w-100 loader-btn"
-                                                    style="display: none;">
-                                                    <span class="loader"></span>
-                                                </div>
-                                                <a href="#" class="bg-gradient-anwi btn fw-500 text-white w-100"
-                                                    id="Forgot_pass_proceed" type="submit">CONFIRM</a>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-
-                                <div class="login-forgot-password-details-div" style="display:none">
-                                    <!-- <div
-                                        class="font-16 d-flex justify-content-between font-w600 text-darkgrey w-100 backtologin">
-                                    <span>Forgot Password?</span>
-                                        <a href="#" class=""
-                                            id="forgot_Password_Details_Back"><span
-                                                class=" cursor-pointer text-center d-flex align-items-center"><i
-                                                    class="fa-solid fa-arrow-left"></i></span></a>
-                                    </div> -->
-                                    <div class="font-14 w-100 password_display">Please Enter your New Password.
-                                    </div>
-                                    <div class="input-group has-validation forgot-password-details-inputgroup">
-                                        <div class=" align-items-center d-flex form-floating position-relative py-0">
-                                            <input type="password"
-                                                class="form-control shadow-none h-50p user_pass"
-                                                id="forgot-password-input-one" placeholder="Enter New Password "
-                                                autocomplete="off">
-                                                <span class="end-0 pswd_eye me-3 position-absolute"><svg
-                                                    class="svg-inline--fa fa-eye" aria-hidden="true"
-                                                    focusable="false" data-prefix="fas" data-icon="eye"
-                                                    role="img" xmlns="http://www.w3.org/2000/svg"
-                                                    viewBox="0 0 576 512" data-fa-i2svg="">
-                                                    <path fill="currentColor"
-                                                        d="M288 32c-80.8 0-145.5 36.8-192.6 80.6C48.6 156 17.3 208 2.5 243.7c-3.3 7.9-3.3 16.7 0 24.6C17.3 304 48.6 356 95.4 399.4C142.5 443.2 207.2 480 288 480s145.5-36.8 192.6-80.6c46.8-43.5 78.1-95.4 93-131.1c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C433.5 68.8 368.8 32 288 32zM144 256a144 144 0 1 1 288 0 144 144 0 1 1 -288 0zm144-64c0 35.3-28.7 64-64 64c-7.1 0-13.9-1.2-20.3-3.3c-5.5-1.8-11.9 1.6-11.7 7.4c.3 6.9 1.3 13.8 3.2 20.7c13.7 51.2 66.4 81.6 117.6 67.9s81.6-66.4 67.9-117.6c-11.1-41.5-47.8-69.4-88.6-71.1c-5.8-.2-9.2 6.1-7.4 11.7c2.1 6.4 3.3 13.2 3.3 20.3z">
-                                                    </path>
-                                                </svg><!-- <i class="fa-solid fa-eye"></i> Font Awesome fontawesome.com --></span>
-                                            <label for="forgot-password-input-one">Enter New Password</label>
-                                        </div>
-                                        <div class="invalid-feedback">
-                                            Please enter your Password.
-                                        </div>
-                                        <div class="pswd_info" style="display: none;z-index: 1;">
-                                            <p>Password must contain:</p>
-                                            <ul>
-                                                <li id="chck_capital" class="invalid">At least <strong>one
-                                                        capital
-                                                        letter</strong></li>
-                                                <li id="chck_special" class="invalid">At least <strong>one
-                                                        special
-                                                        letter</strong></li>
-                                                <li id="chck_number" class="invalid">At least <strong>one
-                                                        number</strong></li>
-                                                <li id="chck_length" class="invalid">At least <strong>8
-                                                        characters</strong></li>
-                                            </ul>
-                                        </div>
-                                    </div>
-                                    <div
-                                        class="input-group has-validation forgot-password-details-inputgroup mt-4">
-                                        <div class="form-floating py-0">
-                                            <input type="text" class="form-control shadow-none h-50p user_pass"
-                                                id="forgot-password-input-two"
-                                                placeholder="Confirm New Password" autocomplete="off">
-                                            <label for="forgot-password-input-two">Confirm New Password</label>
-                                        </div>
-                                        <div class="invalid-feedback">
-                                            Please enter your Password.
-                                        </div>
-                                    </div>
-                                    <div class="mt-3 ">
-                                        <div>
-                                            <div class="btn bg-gradient-anwi w-100 loader-btn"
-                                                style="display: none;">
-                                                <span class="loader"></span>
-                                            </div>
-                                            <a href="#" class="btn bg-gradient-anwi w-100 text-white fw-500"
-                                                id="forgot_password_details_submit" type="submit">Submit</a>
-                                        </div>
-                                    </div>
-                                </div>
-                              
-                               
-                               
-                            </form>
-                            
+                        <div class="align-items-center card d-flex flex-column justify-content-center p-4 position-relative rounded-3 shadow" style="min-height: 500px;">
+                           <a href="index.html" class="mb-3 mt-2 mx-auto position-absolute text-center"  style="
+                           top: 4%;
+                           left: 50%;
+                           transform: translateX(-50%);
+                         
+                       "><img src="../dist/assets/imgs/anwi-logo-1.png" alt="logo" class="w-50 logoauth d-none"></a> 
+                         
+                           <div class="alert alert-danger error_msg  w-100 d-none" role="alert" style="font-size: 12px;">
+                            <span>
+                                <svg width="18" height="18" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M11.2646 3.41366C11.7212 3.15681 12.2788 3.15681 12.7354 3.41366L19.2354 7.06991C19.7077 7.33558 20 7.83536 20 8.37727V15.6227C20 16.1646 19.7077 16.6644 19.2354 16.9301L12.7354 20.5863C12.2788 20.8432 11.7212 20.8432 11.2646 20.5863L4.76461 16.9301C4.29229 16.6644 4 16.1646 4 15.6227V8.37727C4 7.83536 4.29229 7.33559 4.76461 7.06991L11.2646 3.41366Z" fill="#FF3A2E"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 7.4C11 7.17909 11.1791 7 11.4 7H12.6C12.8209 7 13 7.17909 13 7.4V12.6C13 12.8209 12.8209 13 12.6 13H11.4C11.1791 13 11 12.8209 11 12.6V7.4Z" fill="white"></path><path fill-rule="evenodd" clip-rule="evenodd" d="M11 16C11 15.4477 11.4477 15 12 15C12.5523 15 13 15.4477 13 16C13 16.5523 12.5523 17 12 17C11.4477 17 11 16.5523 11 16Z" fill="white"></path></svg>
+                            </span>
+                            <span class="error_msg_res">Email is not verified <a class="validate_mail text-danger d-none"><b>Validate Email</b></a></span> 
                             </div>
-                            <div class="email-validate-div" style="display:none">
-                                <div
-                                    class="font-16 d-flex justify-content-end font-w600 text-darkgrey w-100 backtologin">
-                                    <!-- <span>Forgot Password?</span> -->
-                                    <a href="./login.html" class="" id="email_validate_back"><span
-                                            class=" cursor-pointer text-center d-flex align-items-center"><i
-                                                class="fa-solid fa-arrow-left"></i></span></a>
-                                </div>
-                                <div class="email-validation">
-                                    <div class="font-14 w-100">Please enter your email address.
-                                    </div>
-                                    <div class="input-group has-validation forgot-password-inputgroup">
-                                        <div class="form-floating py-0">
-                                            <input type="email" class="form-control shadow-none h-50p"
-                                                id="email_validation_input" placeholder="Enter Your Email"
-                                                autocomplete="off">
-                                            <label for="email_validation_input">Email address</label>
-                                        </div>
-                                        <div class="invalid-feedback">
-                                            Please enter your email.
-                                        </div>
-                                    </div>
-                                    <div class="mt-3">
-                                        <div>
-                                            <div class="btn bg-gradient-anwi w-100 loader-btn"
-                                                style="display: none;">
-                                                <span class="loader"></span>
-                                            </div>
-                                            <a href="#" class="btn bg-gradient-anwi w-100 text-white fw-500"
-                                                id="email_validate_submit" type="submit">Submit</a>
-                                        </div>
-                                    </div>
-                                </div>
-                                <div class="otp-validation">
-                                    <div class="otp-input-group mt-3" style="display: none;">
-                                        <div>
-                                            <h4 class="text-center">Enter OTP</h4>
-                                            <div class="text-center">we have sent an OTP to this Email
-                                            </div>
-                                            <p class="user_email text-center"></p>
-                                            <div class="otp-sent-email fw-600 text-center"></div>
-                                        </div>
-                                        <div class="d-flex my-4">
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control"
-                                                        name="code" maxlength="1" tabindex="1"
-                                                        autocomplete="off">
-                                                </div>
-                                            </div>
-
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control"
-                                                        name="code" maxlength="1" tabindex="2"
-                                                        autocomplete="off">
-                                                </div>
-                                            </div>
-
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control"
-                                                        name="code" maxlength="1" tabindex="3"
-                                                        autocomplete="off">
-                                                </div>
-                                            </div>
-
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control"
-                                                        name="code" maxlength="1" tabindex="4"
-                                                        autocomplete="off">
-                                                </div>
-                                            </div>
-
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control"
-                                                        name="code" maxlength="1" tabindex="5"
-                                                        autocomplete="off">
-                                                </div>
-                                            </div>
-
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control"
-                                                        name="code" maxlength="1" tabindex="6"
-                                                        autocomplete="off">
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div>
-                                            <div class="btn bg-gradient-anwi w-100 loader-btn"
-                                                style="display: none;">
-                                                <span class="loader"></span>
-                                            </div>
-                                            <a href="#" class="bg-gradient-anwi btn fw-500 text-white w-100"
-                                                id="email_validate_proceed" type="submit">CONFIRM</a>
-                                        </div>
-                                    </div>
-                                </div>
-                            </div>
-                            <div class="register_section" style="display: none;">
-                                <form id="register_form">
-                                    <div class="email-password-group">
-                                        <div class="input-group has-validation email-login-inputgroup">
-                                            <div class="form-floating py-0">
-                                                <input type="email" class="form-control shadow-none h-50p"
-                                                    id="User_Email" placeholder="Enter Your Email"
-                                                    autocomplete="off">
-                                                <label for="User_Email">Email address</label>
-                                            </div>
-                                            <div class="invalid-feedback">
-                                                Please enter your email.
-                                            </div>
-                                        </div>
-                                        <div class="input-group has-validation mt-3 password-login-inputgroup">
-                                            <div class="align-items-center d-flex form-floating position-relative py-0"
-                                                id="password-input-div">
-                                                <input type="password" class="form-control shadow-none h-50p"
-                                                    id="User_password" placeholder="Password"
-                                                    autocomplete="no password" required="">
-                                                <span class="end-0 pswd_eye me-4 pe-2 position-absolute"><svg
-                                                        class="svg-inline--fa fa-eye" aria-hidden="true"
-                                                        focusable="false" data-prefix="fas" data-icon="eye"
-                                                        role="img" xmlns="http://www.w3.org/2000/svg"
-                                                        viewBox="0 0 576 512" data-fa-i2svg="">
-                                                        <path fill="currentColor"
-                                                            d="M288 32c-80.8 0-145.5 36.8-192.6 80.6C48.6 156 17.3 208 2.5 243.7c-3.3 7.9-3.3 16.7 0 24.6C17.3 304 48.6 356 95.4 399.4C142.5 443.2 207.2 480 288 480s145.5-36.8 192.6-80.6c46.8-43.5 78.1-95.4 93-131.1c3.3-7.9 3.3-16.7 0-24.6c-14.9-35.7-46.2-87.7-93-131.1C433.5 68.8 368.8 32 288 32zM144 256a144 144 0 1 1 288 0 144 144 0 1 1 -288 0zm144-64c0 35.3-28.7 64-64 64c-7.1 0-13.9-1.2-20.3-3.3c-5.5-1.8-11.9 1.6-11.7 7.4c.3 6.9 1.3 13.8 3.2 20.7c13.7 51.2 66.4 81.6 117.6 67.9s81.6-66.4 67.9-117.6c-11.1-41.5-47.8-69.4-88.6-71.1c-5.8-.2-9.2 6.1-7.4 11.7c2.1 6.4 3.3 13.2 3.3 20.3z">
-                                                        </path>
-                                                    </svg><!-- <i class="fa-solid fa-eye"></i> Font Awesome fontawesome.com --></span>
-                                                <label for="User_password">Password</label>
-                                            </div>
-                                            <div class="invalid-feedback">
-                                                Please enter your password.
-                                            </div>
-                                            <div class="pswd_info" style="display: none;">
-                                                <p>Password must contain:</p>
-                                                <ul>
-                                                    <li id="chck_capital" class="invalid">At least <strong>one
-                                                            capital
-                                                            letter</strong></li>
-                                                    <li id="chck_special" class="invalid">At least <strong>one
-                                                            special
-                                                            letter</strong></li>
-                                                    <li id="chck_number" class="invalid">At least <strong>one
-                                                            number</strong></li>
-                                                    <li id="chck_length" class="invalid">At least <strong>8
-                                                            characters</strong></li>
-                                                </ul>
-                                            </div>
-                                        </div>
-                                        <div class="fs-7 mt-2 satoshi_font">
-                                            By continuing, I agree to the
-                                            <a href="#"
-                                                class="text-theme-color text-decoration-underline fs-7 fw-600">Terms
-                                                of
-                                                Use</a>
-                                            &amp;
-                                            <a href="#"
-                                                class="text-theme-color text-decoration-underline fs-7 fw-600">Privacy
-                                                Policy</a>
-                                        </div>
-                                        <div class="mt-3 ">
-                                            <div>
-                                                <div class="btn bg-gradient-anwi w-100 loader-btn"
-                                                    style="display: none;">
-                                                    <span class="loader"></span>
-                                                </div>
-                                                <a href="#" class="btn bg-gradient-anwi text-white w-100 fw-500"
-                                                    id="register_btn" type="submit">Sign Up</a>
-                                            </div>
-                                        </div>
-                                        <div class="my-3 mt-4">
-                                            <p class="or_line"><span>or</span></p>
-        
-                                            </div>
-                                            <div class="mt-4  mb-5">
-                                                    <a href="#" class="btn bg-gradient-anwi-outline w-100 fw-500" id="login_sectionbtn"
-                                                        >Login</a>
-                                            </div>
-                                    </div>
-
-                                    <div class="register_otp otp-input-group mt-3" style="display: none;">
-                                        <div>
-                                            <h4 class="text-center">Enter OTP</h4>
-                                            <div class="text-center">we have sent an OTP to this Email </div>
-                                            <div class="otp-sent-email fw-600 text-center"></div>
-                                        </div>
-                                        <div class="d-flex my-4">
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control" name="code"
-                                                        maxlength="1" tabindex="1" autocomplete="off">
-                                                </div>
-                                            </div>
-
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control" name="code"
-                                                        maxlength="1" tabindex="2" autocomplete="off">
-                                                </div>
-                                            </div>
-
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control" name="code"
-                                                        maxlength="1" tabindex="3" autocomplete="off">
-                                                </div>
-                                            </div>
-
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control" name="code"
-                                                        maxlength="1" tabindex="4" autocomplete="off">
-                                                </div>
-                                            </div>
-
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control" name="code"
-                                                        maxlength="1" tabindex="5" autocomplete="off">
-                                                </div>
-                                            </div>
-
-                                            <div class="col">
-                                                <div class="form-group">
-                                                    <input type="text" class="press form-control" name="code"
-                                                        maxlength="1" tabindex="6" autocomplete="off">
-                                                </div>
-                                            </div>
-                                        </div>
-                                        <div>
-                                            <div class="btn bg-gradient-anwi w-100 loader-btn"
-                                                style="display: none;">
-                                                <span class="loader"></span>
-                                            </div>
-                                            <a href="#" class="btn btn-primary w-100 fw-500" id="proceed"
-                                                type="submit">CONFIRM</a>
-                                        </div>
-                                    </div>
-
-                                </form>
+                            <div class="login_section authContainerUI">
+                            
                             </div>
+                        
+                          
                         </div>
                     </div>
                     
@@ -560,61 +74,24 @@
 
     <!-- <div id="footer-head"></div> -->
     <!-- end-footer -->
+    <script src="../dist/js/fontawesome.all.js"></script>
     <script src="./libs/bootstrap/js/bootstrap.bundle.min.js"></script>
     <script src="./dist/js/jquery.min.js"></script>
-    <script src="./dist/js/utils/helpers.js"></script>
-
-    <script src="./libs/owlcarousel/js/owl.carousel.min.js"></script>
-    <script src="./dist/js/shoppingcart/addtocart.js"></script>
-    <script src="./dist/js/auth/apiservice.js"></script>
+    <script src="./dist/toaster/toastr.js"></script>
     <script src="./libs/cookies.min.js"></script>
      <script src="./libs/axios.min.js"></script>
-    <!-- <script src="./dist/js/auth/login.js"></script> -->
-    <script src="./dist/js/vendor/modernizr-3.11.7.min.js"></script>
-    <script src="./dist/js/vendor/jquery-v3.6.0.min.js"></script>
-    <script src="./dist/js/vendor/jquery-migrate-v3.3.2.min.js"></script>
-    <script src="./dist/js/vendor/bootstrap.min.js"></script>
-    <script src="./dist/js/plugins/slick.js"></script>
-    <script src="./dist/js/plugins/wow.js"></script>
-    <script src="./dist/js/plugins/svg-injector.min.js"></script>
-    <script src="./dist/js/plugins/jquery.nice-select.min.js"></script>
-    <script src="./dist/js/plugins/mouse-parallax.js"></script>
-    <script src="./dist/js/plugins/images-loaded.js"></script>
-    <script src="./dist/js/plugins/isotope.js"></script>
-    <script src="../dist/js/fontawesome.all.js"></script>
-    <script src="./dist/js/utils/CookieHelper.js"></script>
-    <script src="./dist/toaster/toastr.js"></script>
+     <script src="./dist/js/utils/helpers.js"></script>
+    <script src="./dist/js/shoppingcart/addtocart.js"></script>
+    <script src="./dist/js/auth/apiservice.js"></script>
+  
+
+
     <script src="./dist/js/auth/login.js"></script>
     <script src="./dist/js/navbar.js"></script>
     <script src="./dist/js/footer.js"></script>
     <!-- Main JS -->
     <script src="./dist/js/main.js"></script>
-    <script>
-        $(".register_sectionbtn").click(function(){
-          debugger;
-          $('#User_Email').val('');
-        $('#User_password').val('');
-          $(".login_section").css("display","none");
-          $(".register_section").css("display","block");
-          $(".login_section").find("#User_Email").removeClass("is-invalid");
-          $(".login_section").find(".form-floating").removeClass("is-invalid");
-          $(".login_section").find("#User_password").removeClass("is-invalid");
-          $(".login_section").find(".form-floating").removeClass("is-invalid");
-          $('.error_msg').hide();
-        });
-        $("#login_sectionbtn").click(function(){
-            $("#register_form").find('#User_Email').val('');
-            $("#register_form").find('#User_password').val('');
-          $(".login_section").css("display","block");
-          $(".register_section").css("display","none");
-          $(".register_section").find("#User_Email").removeClass("is-invalid");
-          $(".register_section").find(".form-floating").removeClass("is-invalid");
-          $(".register_section").find("#User_password").removeClass("is-invalid");
-          $(".register_section").find(".form-floating").removeClass("is-invalid");
-          $('.error_msg').hide();
-        });
-     
-     </script>
+    
 </body>
 
 </html>

myaccount.html

@@ -247,7 +247,7 @@
                                                                         <div class="form-floating">
                                                                             <!-- <input type="number" class="form-control" id="phonenumber"
                                                                                 placeholder="Phone Number"> -->
-                                                                                <input type="number" inputmode="tel" class="form-control addr_phone" pattern="[1-9]{1}[0-9]{9}^[0-9]*$" onKeyPress="if(this.value.length==10) return false;" maxlength="10"  id="phonenumber" placeholder="Phone Number" disabled  required>
+                                                                                <input type="number" inputmode="tel" class="form-control " pattern="[1-9]{1}[0-9]{9}^[0-9]*$" onKeyPress="if(this.value.length==10) return false;" maxlength="10"  id="phonenumber" placeholder="Phone Number"   required>
                                                                             <label for="phonenumber">Phonenumber</label>
                                                                             <div class="invalid-feedback ">
                                                                                 Please choose a valid Phone Number.
@@ -276,15 +276,20 @@
                                                                             </div>
                                                                         </div>
                                                                     </div>
-                                                                    <div class="col-sm-6">
-                                                                        <div class="form-floating h-100">
-                                                                            <select name="state" id="state"
-                                                                                class="form-control h-100 pt-2"></select>
-                        
+                                                                    <div class="col-6 stateBoxParent">
+                                                                        <div class="form-floating">
+                                                                            <input type="text" class="form-control" id="state"
+                                                                                placeholder="Phone Number">
+                                                                            <label 
+                                                                            class="d-flex align-items-center"
+                                                                            for="state">City </label>
                                                                             <div class="invalid-feedback ">
-                                                                                Please choose a valid state.
+                                                                                Please choose a valid City
                                                                             </div>
                                                                         </div>
+                                                                        <div class="stateBox border d-none">
+                                                                           
+                                                                        </div>
                                                                     </div>
                                                                 </div>
                                                                 <div class="py-2">
@@ -460,7 +465,7 @@
                                                             <div class="col-md-6 py-2">
                                                                 <div class="form-floating py-0 ">
                                                                     <input type="text"
-                                                                        class="form-control shadow-none h-50p profile_info cursor-notvalid text-capitalize"
+                                                                        class="form-control shadow-none h-50p profile_info cursor-notvalid "
                                                                         id="Profile_User_name"
                                                                         placeholder="Enter Your Name" autocomplete="off"
                                                                         disabled>

ramproducts.html

@@ -110,13 +110,24 @@
     <!-- end-footer -->
     <script src="./libs/bootstrap/js/bootstrap.bundle.min.js"></script>
     <script src="./dist/js/jquery.min.js"></script>
+    <script src="./libs/owlcarousel/js/owl.carousel.min.js"></script>
+ 
    <script src="./libs/axios.min.js"></script>
 
-    <script src="./libs/cookies.min.js"></script>
+      <script src="./libs/cookies.min.js"></script>
+
+    <script src="./dist/toaster/toastr.js"></script>
     <script src="./dist/js/fontawesome.all.js"></script>
     <script src="./dist/js/fontawesome.min.js"></script>
+    <script src="./dist/js/vendor/modernizr-3.11.7.min.js"></script>
     <script src="./dist/js/vendor/jquery-v3.6.0.min.js"></script>
+    <script src="./dist/js/vendor/jquery-migrate-v3.3.2.min.js"></script>
     <script src="./dist/js/vendor/bootstrap.min.js"></script>
+    <script src="./dist/js/plugins/slick.js"></script>
+    <script src="./dist/js/plugins/wow.js"></script>
+    <script src="./dist/js/plugins/svg-injector.min.js"></script>
+    <script src="./dist/js/plugins/jquery.nice-select.min.js"></script>
+
 
 
 <!-- Main JS -->

selectdelivery.html

@@ -95,7 +95,7 @@
                                 <!-- <div>Add A NEW ADDRESS</div> -->
                             </div>
                             <div class="p-3 addresslist d-none">
-
+                               
                                 <label class="form-check-label addresslabel w-100" for="address1">
                                     <input checked type="radio" id="address1" class="d-none">
                                     <div>
@@ -110,7 +110,22 @@
                                                     </div>
                                                 </div>
                                             </div>
+
                                             <div class="col-sm-6">
+                                                <div class="form-floating">
+                                                    <input type="number" class="form-control" id="zipcode"
+                                                        placeholder="Phone Number">
+                                                    <label for="zipcode">zipcode</label>
+                                                    <div class="invalid-feedback ">
+                                                        Please choose a valid Phone zipcode.
+                                                    </div>
+                                                </div>
+                                            </div>
+                                           
+                                            
+                                        </div>
+                                        <div class="row">
+                                            <div class="col-sm-12">
                                                 <div class="form-floating">
                                                     <input type="text" class="form-control" id="addressdes"
                                                         placeholder="Phone Number">
@@ -121,18 +136,24 @@
                                                 </div>
                                             </div>
                                         </div>
+                                     
                                         <div class="row">
-                                            <div class="col-sm-6">
+                                            <div class="col-6 stateBoxParent">
                                                 <div class="form-floating">
-                                                    <input type="number" class="form-control" id="zipcode"
+                                                    <input type="text" class="form-control" id="state"
                                                         placeholder="Phone Number">
-                                                    <label for="zipcode">zipcode</label>
+                                                    <label 
+                                                    class="d-flex align-items-center"
+                                                    for="state">City </label>
                                                     <div class="invalid-feedback ">
-                                                        Please choose a valid Phone zipcode.
+                                                        Please choose a valid City
                                                     </div>
                                                 </div>
+                                                <div class="stateBox  d-none">
+                                                   
+                                                </div>
                                             </div>
-                                            <div class="col-sm-6">
+                                            <!-- <div class="col-sm-6">
                                                 <div class="form-floating h-100">
                                                     <select name="state" id="state"
                                                         class="form-control h-100 pt-2"></select>
@@ -141,8 +162,21 @@
                                                         Please choose a valid state.
                                                     </div>
                                                 </div>
-                                            </div>
+                                            </div> -->
+                                            <div class="col-sm-6">
+                                                <div class="form-floating">
+                                                    <input disabled type="text" 
+                                                    value="India" class="form-control" id="name_form"
+                                                        placeholder="Country">
+                                                    <label for="name_form">Country </label>
+                                                    <div class="invalid-feedback ">
+                                                        Please choose a valid Country.
+                                                    </div>
+                                                </div>
+                                            </div>  
                                         </div>
+                                      
+                                       
                                         <div class="py-2">
                                             <div class="text-danger errMsgFormEdit d-none"></div>
                                             <button style="width: 100px;height: 35px;"
@@ -279,7 +313,7 @@
     <script src="./dist/js/auth/apiservice.js"></script>
     <script src="./dist/js/main.js"></script>
     <script src="./dist/js/components/authloader/authloader.js"></script>
-
+    <script src="./dist/js/components/select/selectcomponent.js"></script>
     <script src="./dist/js/localstorage/checkout.js"></script>
     <script src="./dist/js/navbar.js"></script>
     <!-- <script src="./dist/js/shoppingcart/selectdelivery.js"></script> -->

services/paymentmethod.html

@@ -88,13 +88,15 @@
     </main>
     <!-- footer -->
     <div id="footer-head"></div>
+    
+    <!-- <img src="./../dist/assets/imgs/anwi-logo-2.png" alt="logo" class="w-50"> -->
     <!-- end-footer -->
     <script src="../libs/bootstrap/js/bootstrap.bundle.min.js"></script>
     <script src="../dist/js/jquery.min.js"></script>
     <script src="../libs/owlcarousel/js/owl.carousel.min.js"></script>
-    <script src="../dist/js/navbar.js"></script>
+  
     <script src="../libs/axios.min.js"></script>
-    <script src="../dist/js/footer.js"></script>
+
     <script src="../libs/cookies.min.js"></script>
 
     <script src="../dist/js/fontawesome.all.js"></script>
@@ -113,6 +115,11 @@
     <script src="../dist/js/plugins/jquery-ui.js"></script>
     <script src="../dist/js/plugins/magnific-popup.js"></script>
 <!-- Main JS -->
+<script src="./../dist/js/utils/helpers.js"></script>
+<script src="./../dist/js/auth/apiservice.js"></script>
+<script src="./../dist/js/shoppingcart/addtocart.js"></script>
+<script src="../dist/js/navbar.js"></script>
+<script src="../dist/js/footer.js"></script>
 <script src="../dist/js/main.js"></script>
 </body>
 

shopping-cart.html

@@ -30,6 +30,14 @@
     <link rel="stylesheet" href="./dist/css/fontawesome.min.css">
     <title>Anwi</title>
 
+    <style>
+        *,*::after,::before{
+            box-sizing: border-box;
+            padding: 0;
+            margin: 0;
+        }
+    </style>
+
 </head>
 
 <body>
@@ -399,7 +407,7 @@
     <script src="./dist/js/jquery.min.js"></script>
     <script src="./libs/owlcarousel/js/owl.carousel.min.js"></script>
     <script src="./dist/js/utils/helpers.js"></script>
-    <script src="./dist/js/navbar.js"></script>
+
     <script src="./libs/axios.min.js"></script>
     <script src="./dist/js/footer.js"></script>
     <script src="./libs/cookies.min.js"></script>
@@ -424,7 +432,8 @@
     <script src="./dist/js/main.js"></script>
     <script src="./dist/js/auth/apiservice.js"></script>
     <script src="./dist/js/shoppingcart/addtocart.js"></script>  
-    <script src="./dist/js/shoppingcart/shoppingcart.js"></script>  
+    <script src="./dist/js/shoppingcart/shoppingcart.js"></script> 
+    <script src="./dist/js/navbar.js"></script> 
     <script>
         $(window).scroll(function() {
             if (isScrolledIntoView('#footer-head'))

storageproducts.html

@@ -119,15 +119,25 @@
     <!-- footer -->
     <div id="footer-head"></div>
     <!-- end-footer -->
-      <script src="./libs/bootstrap/js/bootstrap.bundle.min.js"></script>
+    <script src="./libs/bootstrap/js/bootstrap.bundle.min.js"></script>
     <script src="./dist/js/jquery.min.js"></script>
+    <script src="./libs/owlcarousel/js/owl.carousel.min.js"></script>
+ 
    <script src="./libs/axios.min.js"></script>
 
-    <script src="./libs/cookies.min.js"></script>
+      <script src="./libs/cookies.min.js"></script>
+
+    <script src="./dist/toaster/toastr.js"></script>
     <script src="./dist/js/fontawesome.all.js"></script>
     <script src="./dist/js/fontawesome.min.js"></script>
+    <script src="./dist/js/vendor/modernizr-3.11.7.min.js"></script>
     <script src="./dist/js/vendor/jquery-v3.6.0.min.js"></script>
+    <script src="./dist/js/vendor/jquery-migrate-v3.3.2.min.js"></script>
     <script src="./dist/js/vendor/bootstrap.min.js"></script>
+    <script src="./dist/js/plugins/slick.js"></script>
+    <script src="./dist/js/plugins/wow.js"></script>
+    <script src="./dist/js/plugins/svg-injector.min.js"></script>
+    <script src="./dist/js/plugins/jquery.nice-select.min.js"></script>
 
 
 <!-- Main JS -->