Untitled

(function() {
    if (!document.querySelector(".eg-container")) {
        try {
            /* main variables */
            var debug = 0;
            var variation_name = "search box at the bottom";
            var $;
            /* all Pure helper functions */

            function waitForElement(selector, trigger, delayInterval, delayTimeout) {
                var interval = setInterval(function() {
                    if (
                        document &&
                        document.querySelector(selector) &&
                        document.querySelectorAll(selector).length > 0
                    ) {
                        clearInterval(interval);
                        trigger();
                    }
                }, delayInterval);
                setTimeout(function() {
                    clearInterval(interval);
                }, delayTimeout);
            }

            function listener() {
                window.addEventListener("locationchange", function() {
                    if (window.location.pathname === "/") {
                        waitForElement('html body #__next > footer', init, 50, 15000);
                    } else if (document.querySelector(".eg-search-container")) {
                        document.querySelector(".eg-search-container").remove();
                    }
                });
                history.pushState = ((f) =>
                    function pushState() {
                        var ret = f.apply(this, arguments);
                        window.dispatchEvent(new Event("pushstate"));
                        window.dispatchEvent(new Event("locationchange"));
                        return ret;
                    })(history.pushState);
                history.replaceState = ((f) =>
                    function replaceState() {
                        var ret = f.apply(this, arguments);
                        window.dispatchEvent(new Event("replacestate"));
                        window.dispatchEvent(new Event("locationchange"));
                        return ret;
                    })(history.replaceState);
                window.addEventListener("popstate", () => {
                    window.dispatchEvent(new Event("locationchange"));
                });
            }


            let egSearchHTML = `
            <div class="container eg-container eg-search-container">
              <div class="eg-wrapper">
                   <!-- title -->
                  <h1>Get started by searching the most accurate and comprehensive electronic parts database online!</h1>
                  <div class="eg-box"></div>
                  <div class="eg-usps"></div>
              </div>
            </div>`;

            /* Variation Init */
            function init() {
                if (!document.querySelector(".eg-container") && (window.location.pathname === "/")) {
                    document.querySelector("html body #__next > footer").insertAdjacentHTML("beforebegin", egSearchHTML);
                    let egContainer = document.querySelector("html body #__next > div:nth-child(2)");
                    let egTakeTarget1 = document.querySelector("html body #__next .hero-wrapper .hero-header");
                    let egSearchBox = document.querySelector("html body #__next .hero-wrapper .hero > div.search-box");
                    // SEARCH BOX IS JUST BELOW TO THE egTakeTarget1
                    let egTakeTarget2 = document.querySelector("html body #__next .hero-wrapper .hero > div:nth-last-child(2)");
                    let egUsps = document.querySelector("html body #__next .hero-wrapper .hero > div:last-child");
                    //USPS BOX IS JUST BELOW TO THE egTakeTarget2

                    let egPutTarget1 = document.querySelector(".eg-box");
                    // SEARCH BOX WILL GO HERE 
                    let egPutTarget2 = document.querySelector(".eg-usps");
                    // USPS BOX WILL GO HERE

                    let egContainerBottom = egContainer.offsetTop + egContainer.offsetHeight;
                    // let egContainerBottom = egContainer.offsetTop + egContainer.offsetHeight;
                    window.addEventListener("scroll", function() {
                        if (window.scrollY >= egContainerBottom) {
                            // MOVING SEARCH BOX DOWN
                            if (!egPutTarget1.querySelector(".div.search-box")) {
                                egPutTarget1.insertAdjacentElement("afterbegin", egSearchBox);
                            }
                            // MOVING USPS DOWN
                            if (!egPutTarget2.querySelector(".feature")) {
                                egPutTarget2.insertAdjacentElement("afterbegin", egUsps);
                            }
                        } else {
                            // MOVING SEARCH BOX BACK TO ITS ORIGINAL POSITION
                            if (egTakeTarget1.nextElementSibling !== egSearchBox) {
                                egTakeTarget1.insertAdjacentElement("afterend", egSearchBox);
                            }
                            // MOVING USPS BOX BACK TO ITS ORIGINAL POSITION
                            if (egTakeTarget2.nextElementSibling !== egUsps) {
                                egTakeTarget2.insertAdjacentElement("afterend", egUsps);
                            }
                        }
                    });
                }
            }

            /* Initialize variation */
            if (window.location.pathname === "/") {
                waitForElement('html body #__next > footer', init, 50, 15000);
            } else if (document.querySelector(".eg-container:has(.eg-box)")) {
                document.querySelector(".eg-container:has(.eg-box)").remove()
            }

            listener();
        } catch (e) {
            if (debug) console.log(e, "error in Test" + variation_name);
        }
    }
})();


html body .eg-container {
    background: linear-gradient(277.62deg, #4676B2 14.37%, #1D324C 68.37%);
}

html body .eg-wrapper {
    padding: 66px 20px;
    margin-left: auto;
    margin-right: auto;
    max-width: 1100px;
}

html body .eg-wrapper>h1 {
    text-align: center;
    font-family: "Inter", "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 1.4;
    color: white;
    margin: 0;
    max-width: 928px;
    margin-left: auto;
    margin-right: auto;
}

html body .eg-box {
    margin-top: 36px;
    margin-bottom: 36px;
}

html body .eg-usps>div {
    padding-top: 0 !important;
    max-width: 920px;
    margin-left: auto;
    margin-right: auto;
}

html body .eg-usps>div .icon svg {
    width: 24px;
    height: 24px;
}

html body .eg-usps>div .icon+div {
    color: white;
    line-height: 1.6;
    font-weight: 300;
}

html body .eg-box input {
    font-size: 17px !important;
    letter-spacing: 0.2px;
}

@media(max-width:767px) {
    html body .eg-wrapper {
        padding: 30px 20px;
    }

    html body .eg-wrapper>h1 {
        font-size: 26px;
    }

    html body .eg-box {
        margin-top: 20px;
        margin-bottom: 0px; 
    }
}