Merge branch 'feature/bottom-notice' into dev

5 files changed, 63 insertions, 0 deletions

diff --git a/i18n/de.toml b/i18n/de.toml
index 3aa00d4..af97129 100644
--- a/i18n/de.toml
+++ b/i18n/de.toml
@@ -18,3 +18,5 @@
   other = "02.01.2006 um 15:04"
 [allTags]
   other = "Alle Tags"
+[gdprNotice]
+  other = "Damit wir sehen können was unseren Besuchern gefällt, speichern wir Zugriffe, Browser- und Betriebssystemversion, sowie die erste Hälfte der IP Adresse. Damit bist du nicht eindeutig verfolgbar. Diese Informationen sind auf unserem Server gespeichert (also nicht bei Google oder anderen Dritten) und wir geben sie niemandem weiter."
diff --git a/i18n/en.toml b/i18n/en.toml
index 8882fc5..6d52e6c 100644
--- a/i18n/en.toml
+++ b/i18n/en.toml
@@ -18,3 +18,5 @@
   other = "Jan 2, 2006 at 15:04"
 [allTags]
   other = "All tags"
+[gdprNotice]
+  other = "To see what our visitors like, we save among others the access, browser and operating system version and the first half of your IP address. You cannot be identified with these information. All of this is saved on our server (not at Google or other third parties) and we don't share anything with others."
diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html
index a9078f5..a469c5a 100644
--- a/layouts/partials/footer.html
+++ b/layouts/partials/footer.html
@@ -25,5 +25,28 @@
   for(g=0;g<i.length;g++)f(c,i[g]);b._i.push([a,e,d])};b.__SV=1.2;a=f.createElement("script");a.type="text/javascript";a.async=!0;a.src="//cdn.mxpnl.com/libs/mixpanel-2-latest.min.js";e=f.getElementsByTagName("script")[0];e.parentNode.insertBefore(a,e)}})(document,window.mixpanel||[]);
   mixpanel.init("{{ . }}");</script><!-- end Mixpanel -->
   {{ end }}
+  {{ if .Site.Params.ShowGDPRNotice }}
+  <div class="info" id="gdprInfo">
+    <div class="info-content">
+      {{ i18n "gdprNotice" }}
+    </div>
+    <div>
+      <a class="btn btn-default" onclick='document.cookie = "the-green-spot-gdpr-ok=true; path=/";document.getElementById("gdprInfo").style.display = "none";console.log("OK")'>
+        OK
+      </a>
+    </div>
+  </div>
+  <script type="text/javascript">
+    function getCookie(name) {
+      var value = "; " + document.cookie;
+      var parts = value.split("; " + name + "=");
+      if (parts.length == 2) return parts.pop().split(";").shift();
+    }
+    var gdprAlreadyShowed = getCookie("the-green-spot-gdpr-ok");
+    if (gdprAlreadyShowed) {
+      document.getElementById("gdprInfo").style.display = "none"
+    }
+  </script>
+  {{ end }}
 </body>
 </html>
diff --git a/static/css/color-theme.css b/static/css/color-theme.css
index 21ab4fd..0db7cb0 100644
--- a/static/css/color-theme.css
+++ b/static/css/color-theme.css
@@ -117,3 +117,8 @@ a.btn-primary.disabled:focus {
     background-color: #bdbdbd4d;
     border-color: #fff;
 }
+
+.info {
+  background-color: #393838;
+  color: #fff;
+}
diff --git a/static/css/main.css b/static/css/main.css
index 8723222..2f2bb68 100644
--- a/static/css/main.css
+++ b/static/css/main.css
@@ -311,3 +311,34 @@ I don't use the default pager-class because I want to use the normal buttons wit
     margin-bottom: 20px;
     border-radius: unset;
 }
+
+.info {
+    position: fixed;
+    bottom:0%;
+    width:100%;
+    padding: 10px;
+    display: flex;
+    text-align: center;
+    flex-direction: column;
+}
+
+.info-content {
+  margin: auto;
+  padding: 10px;
+}
+
+@media (min-width: 768px) {
+  .info-content {
+    width: 750px;
+  }
+}
+@media (min-width: 992px) {
+  .info-content {
+    width: 970px;
+  }
+}
+@media (min-width: 1200px) {
+  .info-content {
+    width: 1170px;
+  }
+}