JSFiddle - React, Tailwind, and code Playground

by Brett

HTML

<div id="terms-and-conditions">
    
  <h1>Terms and Conditions</h1>
    <p>Example Content</p>
  
  <span class="accept-button"><a href="#" onclick="TermsAndConditions()">Accept</a></span></div>

CSS

#terms-and-conditions {
	height: 190px;
	width: auto;
}

JavaScript

function TermsAndConditions(){
   days=30;
   myDate = new Date();
   myDate.setTime(myDate.getTime()+(days*24*60*60*1000));
   document.cookie = 'TermsAndConditions=Accepted; expires=' + myDate.toGMTString();
}

var cookie = document.cookie.split(';')
    .map(function(x){ return x.trim().split('='); })
    .filter(function(x){ return x[0]==='TermsAndConditions'; })
    .pop();

if(cookie && cookie[1]==='Accepted') {
    $("#terms-and-conditions").hide();
}

$('.accept-button a').on('click', function(){
    TermsAndConditions();
    return false;
});