LucienBrule/smimpleagecheckdemo.html

## smimpleagecheckdemo.html


<html>
<body>
  <script
  src="https://code.jquery.com/jquery-3.2.1.min.js"
  integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
  crossorigin="anonymous"></script>
<style>
#age-modal{
  visibility: hidden;
}
.modal-bg{
  z-index: 11;
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  text-align: center;
  padding-top: 10%;
  background-color: rgba(0,0,0,0.5);
}
.modal-fg{
  margin-left: auto;
  margin-right: auto;
  display: block;
  width: 15em;
  align-self: center;
  background-color: whitesmoke;
  padding: 2em;
}
.button{
  text-decoration: none !important;
  color: black;
  background-color: lightgray;
  margin: 10px;
  padding: 10px;
  cursor: pointer;
}
</style>
<script>
// alert("Template");
$( document ).ready(function() {
    console.log( "ready!" );
    // console.log(document.cookie);
    var x = document.cookie;
    if(document.cookie.indexOf('pristineisover21=') < 0){
      alert("cookie not set");
      $("#age-modal").css("visibility","visible");
    }
});

function isover21(){
  $("#age-modal").css("visibility","hidden");
  document.cookie = "pristineisover21=true";
}

function isunder21(){
  document.location.href = "http://www.google.com";
}
</script>
<div id="age-modal">
  <div class="modal-bg">
    <div class="modal-fg">
      <h1>Must Do</h1>
      <h3>21 or over?</h3>
      <br>
      <span>
        <a class="button" onclick="isover21()">yes</a>
        <a class="button" onclick="isunder21()">no</a>
      </span>
    </div>
  </div>
</div>
</body>
</html>





	<html>
	<body>
	<script
	src="https://code.jquery.com/jquery-3.2.1.min.js"
	integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
	crossorigin="anonymous"></script>
	<style>
	#age-modal{
	visibility: hidden;
	}
	.modal-bg{
	z-index: 11;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	text-align: center;
	padding-top: 10%;
	background-color: rgba(0,0,0,0.5);
	}
	.modal-fg{
	margin-left: auto;
	margin-right: auto;
	display: block;
	width: 15em;
	align-self: center;
	background-color: whitesmoke;
	padding: 2em;
	}
	.button{
	text-decoration: none !important;
	color: black;
	background-color: lightgray;
	margin: 10px;
	padding: 10px;
	cursor: pointer;
	}
	</style>
	<script>
	// alert("Template");
	$( document ).ready(function() {
	console.log( "ready!" );
	// console.log(document.cookie);
	var x = document.cookie;
	if(document.cookie.indexOf('pristineisover21=') < 0){
	alert("cookie not set");
	$("#age-modal").css("visibility","visible");
	}
	});

	function isover21(){
	$("#age-modal").css("visibility","hidden");
	document.cookie = "pristineisover21=true";
	}

	function isunder21(){
	document.location.href = "http://www.google.com";
	}
	</script>
	<div id="age-modal">
	<div class="modal-bg">
	<div class="modal-fg">
	<h1>Must Do</h1>
	<h3>21 or over?</h3>
	<br>
	<span>
	<a class="button" onclick="isover21()">yes</a>
	<a class="button" onclick="isunder21()">no</a>
	</span>
	</div>
	</div>
	</div>
	</body>
	</html>