Skip to content

Instantly share code, notes, and snippets.

@xyzshantaram

xyzshantaram/index.html

Created June 12, 2020 12:30
Show Gist options
  • Save xyzshantaram/a5b46ea0b2b94b8e3134606a4f7c8e40 to your computer and use it in GitHub Desktop.
Save xyzshantaram/a5b46ea0b2b94b8e3134606a4f7c8e40 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
index.html
<html>
<meta charset='UTF-8'>
<head>
<div class='blackout'>
It appears you're using a mobile browser to view our site. Sadly, the HackerBlocks editor is desktop-only. Please visit this page in a desktop browser to do the challenge.
</div>
<style>
.blackout {
position: fixed;
z-index: 999;
background: #000000;
color: #ffffff;
left: 0;
top: 0;
font-size: 4em;
padding: 20px;
width: 100%;
display: none;
height: 100%;
justify-content: center;
align-items: center;
}
</style>
<script>
const isMobile = {
Android: function () {
return navigator.userAgent.match(/Android/i);
},
BlackBerry: function () {
return navigator.userAgent.match(/BlackBerry/i);
},
iOS: function () {
return navigator.userAgent.match(/iPhone|iPad|iPod/i);
},
Opera: function () {
return navigator.userAgent.match(/Opera Mini/i);
},
Windows: function () {
return navigator.userAgent.match(/IEMobile/i) || navigator.userAgent.match(/WPDesktop/i);
},
any: function () {
return (isMobile.Android() || isMobile.BlackBerry() || isMobile.iOS() || isMobile.Opera() || isMobile.Windows());
}
};
window.onload = function () {
if (isMobile.any()) {
document.getElementsByClassName('blackout')[0].style.display = 'flex';
console.log('mobile');
}
}
</script>
</head>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment