JSFiddle - React, Tailwind, and code Playground

HTML

<script type="text/javascript">
function setVisibility(id, visibility) {
document.getElementById(id).style.display = visibility;
}
</script>

<div id="cookies-notify" style="-webkit-box-shadow: 5px -5px 5px rgba(50, 50, 50, 0.3); -moz-box-shadow: 5px -5px 5px rgba(50, 50, 50, 0.3); box-shadow: 5px -5px 5px rgba(50, 50, 50, 0.3); font-family: helvetica neue, verdana, arial, sans-serif; position: absolute; bottom: 0; left: 0; height: 325px; width: 200px; padding: 10px; background: #eaeaea; border: 1px solid #fff;">
    <h1 style="font-size: 15px; color: #376499; text-decoration: underline; text-shadow: 0px 1px 0px #fff; margin-top: 0; margin-bottom: 10px;">This website uses cookies</h1>
    <p style="font-size: 13px; color: #4a4a4a; text-shadow: 0px 1px 0px #fff; margin-bottom: 10px;">To comply with EU Directives we are informing you that our website uses cookies for services such as Google Analytics, accessibility plugins and e-commerce functionality.</p>
    <p style="font-size: 13px; color: #4a4a4a; text-shadow: 0px 1px 0px #fff; margin-bottom: 10px;">Your data is completely safe and we do not record any personally identifiable information.</p>
    <p style="font-size: 13px; font-weight: bold; color: #4a4a4a; text-shadow: 0px 1px 0px #fff;">Please click the button to acknowledge and approve our use of cookies during your visit.</p>
    <input style="width: 150px; display: block; margin: 15px auto; text-align: center; background: #376499; border: 1px solid #fff; padding: 10px; color: #fff;" type="button" value="I accept" onclick="setVisibility('cookies-notify', 'none');document.cookie =
  'stupid-eu-law=accept-cookies; expires=Mon, 31 Dec 2525 23:59:59 UTC; path=/';" />
    <p><a style="font-size: 12px; text-align: center; font-weight: bold; color: #376499; text-shadow: 0px 1px 0px #fff;" href="http://nocookielaw.com/">Learn more about the Cookie Law</a></p>
</div>