add cookie banner in web3 (#32)

static/css/web3.css

@@ -81,3 +81,40 @@ img {
 footer {
   text-align: center;
 }
+
+/* Cookie banner */
+#cookie .cookie-flag {
+  display: none;
+}
+
+#cookie .cookie-container {
+  display: block;
+  pointer-events: none;
+  position: relative;
+}
+
+#cookie .cookie-content {
+  border: 1px solid white;
+  background: black;
+  display: flex;
+}
+
+#cookie .cookie-flag:checked ~ .cookie-close,
+#cookie .cookie-flag:checked ~ .cookie-content {
+  display: none;
+}
+
+#cookie .cookie-close {
+  pointer-events: all;
+  position: absolute;
+  top: 1rem;
+  right: 1rem;
+  font-size: 32px;
+  cursor: pointer;
+}
+
+#cookie-icon {
+  font-size: 40px;
+  margin: 1%;
+  margin-top: 3rem;
+}

templates/web3.html

@@ -24,6 +24,23 @@
         welcome to my web3 space feel free to send me nfts as jpeg format
       </h2>
 
+      <!-- this web3 site doesn't use ANY cookies
+      can't you bring some next time? -->
+
+      <span id="cookie">
+        <label class="cookie-container">
+          <input type="checkbox" class="cookie-flag" />
+          <div class="cookie-content">
+            <div role="img" id="cookie-icon">🍪</div>
+            <div>
+              <h1>this web3 site doesn't use ANY cookies</h1>
+              <p>can't you bring some next time? ☆*: .｡. o(≧▽≦)o .｡.:*☆</p>
+            </div>
+          </div>
+          <div role="button" class="cookie-close">✖️</div>
+        </label>
+      </span>
+
       <p>
         idk if you know but i do love
         <img