Hello whiny.lol

layouts/_partials/dialog.html

@@ -0,0 +1,46 @@
+<dialog class="block" id="dialog" aria-labelledby="dialog-title">
+  {{ with .Site.Params.version.changelog }}
+    {{ with $.Site.GetPage . }}
+      <h2 class="block-title" id="dialog-title">{{ .Title }}</h2> 
+      
+      <div class="block-content prose">
+        {{ .Summary }}
+
+        <p><a href="{{ .RelPermalink }}">Read the full changelog</a></p>
+      </div>
+    {{ end }}
+  {{ end }}
+
+  <div class="block-content options">
+    <ul class="row">
+      <li>
+        <button id="close" class="link badge">Close</button>
+      </li>
+      <li>
+        <button id="hide" class="link badge">Hide until next update</button>
+      </li>
+    </ul>
+  </div>
+</dialog>
+
+<script>
+  const dialog = document.getElementById('dialog');
+  const hide = document.getElementById('hide');
+  const close = document.getElementById('close');
+  const currentVersion = "{{ .Site.Params.version.update }}";  
+
+  if (localStorage.getItem('siteVersion') !== currentVersion) {
+    dialog.showModal();
+  }
+  
+  function hideDialog() {
+    dialog.close();
+    localStorage.setItem('siteVersion', currentVersion);
+  }
+  
+  hide.addEventListener('click', hideDialog);
+  
+  close.addEventListener('click', () => {
+    dialog.close();
+  });
+</script>