Merge pull request #48 from Verpz/devel

Add Javascript Disabled Warning / Popup

css/js-warn.css

@@ -0,0 +1,54 @@
+/* Made by Verpz https://github.com/Verpz/ Licensed Under Apache License 2.0 Details On GitHub */
+.js-warn {
+  background: #EEE;
+  color: #555;
+  display: block;
+  width: 30%;
+  right: 0;
+  left: 0;
+  margin-right: auto;
+  margin-left: auto;
+  margin-top: 50px;
+  border-radius: 10px;
+  box-shadow: 0px 10px 70px;
+  text-align: center;
+  position: fixed;
+  font-family: sans-serif, serif;
+  font-weight: 300;
+  z-index: 9999;
+}
+.js-warn h1 {
+  font-family: sans-serif, serif;
+  font-weight: 300;
+  padding: 10px 10px 0 10px;
+}
+.js-warn p {
+  padding: 0 10px 10px 10px;
+}
+.js-warn a {
+  color: #355980;
+  text-decoration: none;
+  transition: all 0.2s linear;
+}
+.js-warn a:hover {
+  color: #000;
+}
+#js-hide:checked ~ #js-warn-exit {
+  display: none;
+}
+#js-hide {
+  position: fixed;
+  left: 100%;
+}
+#js-warn-exit {
+  padding: 1em;
+  overflow: auto;
+}
+#js-warn-exit label {
+  background: #355980;
+  color: white;
+  padding: 0.5em 0.75em;
+  cursor: pointer;
+  border-radius: 3px;
+  float: right;
+}

index.php

@@ -1,7 +1,15 @@
 <?php
     require "header.html";
 ?>
-
+<!-- JS Warning -->
+<div>
+  <link rel="stylesheet" type="text/css" href="css/js-warn.css">
+  <input type="checkbox" id="js-hide" />
+  <div class="js-warn" id="js-warn-exit"><h1>Javascript Is Disabled</h1><p>Javascript seems to be disabled. This will break some site features.</p>
+  <p>To enable Javascript click <a href="http://www.enable-javascript.com/" target="_blank">here</a></p><label for="js-hide">Close</label></div>
+  <script>var jswarn = document.getElementById("js-warn-exit"); jswarn.parentNode.removeChild(jswarn);</script>
+</div>
+<!-- /JS Warning -->
 <!-- Small boxes (Stat box) -->
 <div class="row">
     <div class="col-lg-3 col-xs-6">