JSFiddle - React, Tailwind, and code Playground

by mynameisdonald

HTML

<script>
    cookielaw('boxportable', 750, '#5C9DFF', '#fff');
</script>

CSS

*{
    margin:0;
    padding:0;
}

JavaScript

function cookielaw(e, t, o, i) {
    function n(e, t) {
        function o() {
            i -= c, t.style.opacity = i, 0 >= i && (window.clearInterval(d), t.style.display = "none")
        }
        var i = 1,
            n = 50,
            c = n / e,
            d = window.setInterval(o, n)
    }
  if (document.cookie.indexOf("visited") >= 0) {
    alert("hello again");
  } else {
        document.body.innerHTML = '<div id="cookiebar"><div id="cookiewrapper">This web site uses cookies to improve your experience. By viewing the content of ' + e + ", you are accepting the use of cookies.</div></div>";
        var c = function () {
            n(750, this), expiry = new Date, expiry.setTime(expiry.getTime() + 6e5), document.cookie = "visited=yes; expires=" + expiry.toGMTString(), alert("this is your first time")
        };
        document.getElementById("cookiebar").onclick = c, document.getElementsByTagName("a").onclick = c
    }
    document.getElementById("cookiebar").style.position = "fixed", document.getElementById("cookiebar").style.bottom = "0", document.getElementById("cookiebar").style.width = "100%", document.getElementById("cookiebar").style.padding = "20px 0", document.getElementById("cookiebar").style.color = i, document.getElementById("cookiebar").style.background = o, document.getElementById("cookiebar").style.zIndex = "100", document.getElementById("cookiebar").style.fontFamily = "Arial", document.getElementById("cookiebar").style.fontWeight = "bold", document.getElementById("cookiebar").style.fontSize = "12px", document.getElementById("cookiebar").style.cursor = "pointer", document.getElementById("cookiewrapper").style.width = t + "px", document.getElementById("cookiewrapper").style.margin = "0 auto"
}