A variation on torcriminalbrowser.com code that also has a "criminal mode". CSS only (can even criminalize a browser with no-JS :) ).
Last active
August 29, 2015 14:08
-
-
Save thedod/755852663855d680c483 to your computer and use it in GitHub Desktop.
Checkbox to "criminalizate" torcriminalbrowser.com :)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html> | |
<head> | |
<title>Tor: The Web Browser for Criminals</title> | |
<meta name="description" content="Tor, the web browser for criminals"> | |
<meta name="author" content="Jordan Rejaud"> | |
<meta name="keywords" content="tor, browser, web browser, privacy, web browser for criminals"> | |
<link rel="stylesheet" type="text/css" href="http://torcriminalbrowser.com/style/format.css"> | |
<link rel="shortcut icon" href="http://torcriminalbrowser.com/favicon.ico"> | |
<script> | |
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){ | |
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o), | |
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m) | |
})(window,document,'script','//www.google-analytics.com/analytics.js','ga'); | |
ga('create', 'UA-46626593-2', 'auto'); | |
ga('send', 'pageview'); | |
</script> | |
<!-- Begin criminalizer style --> | |
<style type="text/css"> | |
#criminalizer-wrapper { text-align:center; width:100% } | |
#criminalizer-wrapper h2 { padding-top:50px; font-weight:bold; font-size:120% } | |
#criminalized { | |
height:350px; | |
white-space: nowrap; | |
position:relative | |
} | |
#criminalizer+label+#criminalized #criminal, | |
#criminalizer:checked+label+#criminalized #lawful { | |
transition: all 4s ease-out; | |
position:absolute; | |
top:-1000px; | |
left:50%; | |
opacity: 0; | |
} | |
#criminalizer+label+#criminalized #lawful, | |
#criminalizer:checked+label+#criminalized #criminal { | |
transition: all 3s ease-in; | |
position:absolute; | |
top:8px; | |
left:50%; | |
text-align:center; | |
margin: 0 auto; | |
opacity: 1; | |
} | |
#criminalizer-wrapper img { vertical-align:middle } | |
#criminalizer-wrapper .image figcaption, | |
#criminalizer-wrapper .image span img { | |
position:relative; | |
left:-50%; | |
} | |
/* OT: tweak against empty space below piratebay item */ | |
/* text can overflow beyond 256, without obstructing float-left */ | |
.item { height: 256px } | |
</style> | |
<!-- End criminalizer style --> | |
<!-- Place this tag in your head or just before your close body tag. --> | |
<script src="https://apis.google.com/js/platform.js" async defer></script> | |
</head> | |
<body> | |
<div id="nav"> | |
<h1 id="logo"><a href="https://www.torproject.org/index.html.en">Tor</a></h1> | |
<nav> | |
<ul> | |
<li><a href="https://www.torproject.org/index.html.en">Home</a></li> | |
<li><a href="https://www.torproject.org/about/overview.html.en">About Tor</a></li> | |
<li><a href="https://www.torproject.org/docs/documentation.html.en">Documentation</a></li> | |
<li><a href="https://www.torproject.org/press/press.html.en">Press</a></li> | |
<li><a href="https://blog.torproject.org/blog/">Blog</a></li> | |
<li><a href="https://www.torproject.org/about/contact.html.en">Contact</a></li> | |
</ul> | |
</nav> | |
</div> | |
<!--Main Margins Block --> | |
<div> | |
<!-- Begin criminalizer --> | |
<div id="criminalizer-wrapper"> | |
<input id="criminalizer" type="checkbox"> | |
<label for="#criminalizer">Criminal mode</label> | |
<div id="criminalized"> | |
<h2><img src="ajax-loader.gif"> [de]criminalizating...</h2> | |
<!-- Lawful Image--> | |
<figure id="lawful" class="image"> | |
<span onclick="document.getElementById('criminalizer').click()"> | |
<img src="tor-header.jpg" alt="Mark of criminal quality"> | |
</span> | |
<figcaption>The Web Browser for Criminals</figcaption> | |
</figure> | |
<!-- Criminal Image--> | |
<figure id="criminal" class="image"> | |
<span onclick="document.getElementById('criminalizer').click()"> | |
<img src="criminal-header.jpg" alt="You're a criminal. Enjoy"> | |
</span> | |
<figcaption>Criminal mode engaged</figcaption> | |
</figure> | |
</div> | |
</div> | |
<!-- End criminalizer --> | |
<hr> | |
<div class="itemcontainer"> | |
<!-- Row 3 --> | |
<div class="item"> | |
<h2>iCloud Hacking</h2> | |
<img src="http://logonoid.com/images/icloud-logo.png"/> | |
<p>Tor lets you hack iCloud to bend someone's iPhone 6 using remote microwave radiation</p> | |
</div> | |
<div class="item"> | |
<h2>Arson</h2> | |
<img src="http://torcriminalbrowser.com/images/pyro.png"/> | |
<p>Tor can break through your victim's firewall to light their computer on fire</p> | |
</div> | |
<div class="item"> | |
<h2>Free Pedobear Doll</h2> | |
<img src="http://torcriminalbrowser.com/images/pedobear.jpg"/> | |
<p>Anyone who uses Tor gets a free Pedobear doll! Use it to gain a child's trust! Its nose is a webcam!</p> | |
</div> | |
<!-- Row 1 --> | |
<div class="item"> | |
<h2>Pirate Bay Search Engine</h2> | |
<img src="http://entertainmentagentblog.com/wp-content/uploads/2009/06/piratbyran.gif"/> | |
<p>The Pirate Bay is the default search engine in Tor. Why bother with Google? Cut out the middle man</p> | |
</div> | |
<div class="item"> | |
<h2>Hacker 4chan</h2> | |
<img src="http://img2.wikia.nocookie.net/__cb20111102014122/suicideprevention/images/0/01/4chan-logo.jpg"/> | |
<p>Tor is the official browser of infamous hacker, 4chan</p> | |
</div> | |
<div class="item"> | |
<h2>Aero-Narcotics</h2> | |
<img src="http://torcriminalbrowser.com/images/flyingcamel.png"/> | |
<p>Tor will use drones in Washington and Colorado to remotely fly illicit drugs to your home</p> | |
</div> | |
<!-- Row 2 --> | |
<div class="item"> | |
<h2>Bitcoin Integration</h2> | |
<img src="https://bitcoin.org/img/opengraph.png"/> | |
<p>Euro, USD, and all other fiat currency values are automatically converted and shown as Bitcoin (the currency for criminals) when using Tor</p> | |
</div> | |
<div class="item"> | |
<h2>Automobile download</h2> | |
<img src="downloadcar.png"/> | |
<p>The latest version of Tor finally lets you download a car. Only electric cars can be downloaded (because electricity = internet).</p> | |
</div> | |
<div class="item"> | |
<h2>NSA Proof</h2> | |
<img src="http://bloximages.chicago2.vip.townnews.com/host.madison.com/content/tncms/assets/v3/editorial/1/de/1ded273c-e892-11e2-af6c-001a4bcf887a/51dc0072f346e.preview-620.jpg"/> | |
<p>Tor browser is completely NSA proof. You can conduct your illegal and blatantly non-ethical activities with no oversight from Big Brother.</p> | |
</div> | |
<div class="clear"></div> | |
<hr> | |
<div class="clear"></div> | |
<div class="item"> | |
<h2>Requirements</h2> | |
<img src="http://torcriminalbrowser.com/images/comcast.png"/> | |
<p>Tor is optimized for modern ISPs (like Google Fiber) and is incompatible with Comcast</p> | |
</div> | |
<div class="item"> | |
<h2>Who uses Tor?</h2> | |
<img src="http://upload.wikimedia.org/wikipedia/en/c/c6/SPECTRE_Logo.png"/> | |
<p><del>People who are concerned about their privacy</del><br>Murderers, Terrorists, the Cobra Commander, Sauron, and Criminals</p> | |
</div> | |
<div class="item"> | |
<h2>Why use Tor?</h2> | |
<img src="http://upload.wikimedia.org/wikipedia/commons/thumb/1/15/Tor-logo-2011-flat.svg/1280px-Tor-logo-2011-flat.svg.png"/> | |
<p><del>*cough* NSA *cough* </del><br>Because you are a scoundrel, a knave, and you have criminal activities to hide. Why else would you want anonymity ?</p> | |
</div> | |
<div class="clear"></div> | |
<hr> | |
<div class="itemcontainer"> | |
<div class="item"> | |
<div class="g-plusone"></div> | |
<a href="https://twitter.com/share" class="twitter-share-button" data-via="JordanRejaud">Tweet</a> | |
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script> | |
</div> | |
<div class="item"> | |
<p> An obvious (I hope) satire by <br><a href="http://www.jordanrejaud.com/">Jordan Rejaud</a></p> | |
</div> | |
<div class="item"> | |
<a href="https://twitter.com/JordanRejaud" class="twitter-follow-button" data-show-count="false">Follow @JordanRejaud</a> | |
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script> | |
</div> | |
</div> | |
</div> | |
</div> | |
<script src="https://apis.google.com/js/platform.js" async defer></script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
The word [de]criminalizating started as a typo, but I've decided to pretend as if I've meme-engineered it 😈. Feel free to comment here what you think it means.