6 files changed, 62 insertions, 6 deletions

diff --git a/themes/simple/layouts/_default/list.html b/themes/simple/layouts/_default/list.html
index 04589cb..2e66b0d 100755
--- a/themes/simple/layouts/_default/list.html
+++ b/themes/simple/layouts/_default/list.html
@@ -10,7 +10,12 @@
       {{ range (where .Site.RegularPages "Section" "posts") }}
       <li class="mb-5">
         <time class="block text-gray-400 font-medium text-xs">{{ .Date.Format "Monday Jan 2, 2006" }}</time>
-        <a href="{{.Permalink}}" itemprop="url" class="hover:bg-yellow-100">{{.Title}}</a>
+        <a href="/{{.Params.url}}" itemprop="url" class="hover:bg-yellow-100">
+          {{ if .Params.draft }}
+          <span class="bg-orange-600 text-white px-1.5">Draft</span>
+          {{ end }}
+          {{.Title}}
+        </a>
       </li>
       {{end}}
     </ul>
diff --git a/themes/simple/layouts/_default/single.html b/themes/simple/layouts/_default/single.html
index e8f27d1..c8e786a 100755
--- a/themes/simple/layouts/_default/single.html
+++ b/themes/simple/layouts/_default/single.html
@@ -34,7 +34,7 @@
   <!-- Read more -->
   {{ if in .Type "posts" }}
   <section>
-    <h1 class="text-2xl font-bold mb-6">Read more from this site</h1>
+    <h2 class="text-2xl font-bold mb-6">Read more from this site</h2>
     <nav itemscope itemtype="https://schema.org/SiteNavigationElement" class="mb-12">
       <meta itemprop="name" content="Article list">
       <ul>
@@ -42,7 +42,7 @@
         {{ range $randomPosts }}
         <li class="mb-6">
           <time class="block text-gray-400 font-medium text-xs">{{ .Date.Format "Mon Jan 2, 2006" }}</time>
-          <a href="{{.Permalink}}" itemprop="url" class="hover:bg-yellow-100 font-medium">{{.Title}}</a>
+          <a href="/{{.Params.url}}" itemprop="url" class="hover:bg-yellow-100 font-medium">{{.Title}}</a>
           <p class="text-gray-600 text-sm">{{.Summary}}</p>
         </li>
         {{end}}
diff --git a/themes/simple/layouts/partials/comments.html b/themes/simple/layouts/partials/comments.html
index 7978917..70b1d94 100755
--- a/themes/simple/layouts/partials/comments.html
+++ b/themes/simple/layouts/partials/comments.html
@@ -1,9 +1,9 @@
 <section class="comments">
+  <h2 class="text-xl font-bold mb-2">Leave a comment</h2>
   <p class="mb-4">You can write me an email at <a href="mailto:m@mitjafelicijan.com" class="underline hover:bg-yellow-100">m@mitjafelicijan.com</a> or comment bellow.</p>
   <div id="comment-section"></div>
 
   <script type="text/javascript" src="https://latest.cactus.chat/cactus.js"></script>
-  <link rel="stylesheet" href="_https://latest.cactus.chat/style.css" type="text/css">
 
   <script>
     window.addEventListener('load', () => {
diff --git a/themes/simple/layouts/partials/footer.html b/themes/simple/layouts/partials/footer.html
index 95a1771..72252c7 100755
--- a/themes/simple/layouts/partials/footer.html
+++ b/themes/simple/layouts/partials/footer.html
@@ -6,10 +6,45 @@
   </p>
 </footer>
 
-<!-- katex math library -->
+<!-- KaTeX math library -->
 <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.13.13/dist/katex.min.css" integrity="sha384-RZU/ijkSsFbcmivfdRBQDtwuwVqK7GMOw6IMvKyeWL2K5UAlyp6WonmB8m7Jd0Hn" crossorigin="anonymous">
 <script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.13/dist/katex.min.js" integrity="sha384-pK1WpvzWVBQiP0/GjnvRxV4mOb0oxFuyRxJlk6vVw146n3egcN5C925NCP7a7BY8" crossorigin="anonymous"></script>
 <script defer src="https://cdn.jsdelivr.net/npm/katex@0.13.13/dist/contrib/auto-render.min.js" integrity="sha384-vZTG03m+2yp6N6BNi5iM4rW4oIwk5DfcNdFfxkk9ZWpDriOkXX8voJBFrAO7MpVl" crossorigin="anonymous" onload="renderMathInElement(document.body);"></script>
 
 <!-- Fathom - beautiful, simple website analytics -->
 <script src="https://cdn.usefathom.com/script.js" data-site="XHQARKXP" defer></script>
+
+<!-- Lazy loading of iframes -->
+<script>
+  window.addEventListener('load', () => {
+    const iframes = document.querySelectorAll('.ll-iframe');
+
+    if (iframes) {
+      iframes.forEach(iframe => {
+        iframe.addEventListener('click', (evt) => {
+          // If there are no elements yet in the target element add iframe.
+          if (!evt.target.dataset.alreadyLoaded) {
+            // Setting this element as already loaded so it doesn't
+            // attempt to load it again.
+            evt.target.dataset.alreadyLoaded = true;
+
+            // Clearing up all existing elements inside of the target one.
+            evt.target.innerHTML = '';
+            evt.target.classList.add('empty');
+            evt.target.classList.add('border-0');
+
+            // Creating iframe DOM element.
+            const iframeElement = document.createElement('iframe');
+            iframeElement.classList.add('w-full');
+            iframeElement.classList.add('h-full');
+            iframeElement.classList.add('rounded');
+            iframeElement.src = evt.target.dataset.src;
+
+            // Appending iframe as a child of current element.
+            evt.target.appendChild(iframeElement);
+          }
+        });
+      });
+    }
+  });
+</script>
diff --git a/themes/simple/layouts/partials/head.html b/themes/simple/layouts/partials/head.html
index b79a030..9499df6 100755
--- a/themes/simple/layouts/partials/head.html
+++ b/themes/simple/layouts/partials/head.html
@@ -5,7 +5,9 @@
 <link rel="alternate" type="application/rss+xml" href="/index.xml" title="{{ .Site.Author.name }}">
 <link rel="alternate" type="application/rss+xml" href="/yap/feed.xml" title="Microblog - {{ .Site.Author.name }}">
 
-<link rel="icon" type="image/gif" href="/general/favicon.gif" />
+<link
+  href="data:image/x-icon;base64,AAABAAEAEBAAAAEAIABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAL69vf8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAv76+/8LBwQkAAAAAAAAAAAAAAAC+vb3/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAL+9vf/Bv78JAAAAAAAAAAAAAAAAu7q6/wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAC7ubr/vr29CAAAAAAAAAAAy8nJAZ6foP8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAnqGj/6GipAoAAAAAHLjU/xcXHf/BwsL/I8XY/yPK3v8XGiD/IbjL/yPF2f8XGiD/Fxkf/yLF2f8gnK3/Fxog/62ztv8fwNf/FRcd/x271v8mz93/GRsi/xkXHf8p097/GiIp/xobIv8p0t3/KdPe/xocIv8fYmr/KNPe/xoZH/8aHCL/J87c/xy81/8VFxz/IsPZ/8zS0/8XGiD/Ir/R/yPH2/8XGiD/Fxkf/yPH2/8dd4T/GBog/yPJ3f8jyNr/uru9/xcUGv8cudb/EhITDKi5vRKlvMP/RUpOERwcHRAdOj4QHTk8EBwdHRAdNTgQHTo/EBwcHRAcHB0QSGduEKW4vf+koqQfHzg+EBqz0ewSFRv7EyMr/xq51vsTERb7ExUb+xq41fsau9j7ExUb+xiPp/sZudb7ExUb+xMVG/sZuNX/GKvI/BIUGfMdvdn/IrfL/xcaIP8n1eb/J9Dh/xkcIf8ZGR7/J8/f/xxCSv8ZGyH/J9Dg/ybQ4P8ZHCL/FSQs/yPK3/8UExj/GE1b/ybS5P8ZGB7/Ghwj/ynW5P8p2Ob/Ghwi/yWrtv8p1eH/Ghwi/xocIv8p1uT/J8XT/xkcIv8m1un/Hb7d/xUYH/8hzOr/HtHu/xcaIf8XGB//I8vi/xgxOv8XGSD/I8rg/yPK4P8XGiD/GUFL/yPP6f8SERj/Fhkh/x3A4f8AAAAAJ2f9/ydr//8mZPH/AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAlYu38J2v//ydo/f8AAAAAAAAAAAd8/fkFqf//Iob8sAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAMY39awWr//8FfP3/AAAAAAAAAAAFm/7/SfD//wR+/f8AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOB/f9B7v//BaX+/wAAAAAAAAAAQ878SAyZ/v9n1v4KAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAADu9v8DDJb+/z3N/XgAAAAA3/sAAN/7AADf+wAA3/sAAAAAAAAAAAAAAAAAAN/7AAAAAAAAAAAAAAAAAAAAAAAAj/EAAI/5AACP8QAA3/sAAA=="
+  rel="icon" type="image/x-icon" />
 
 <title>{{.Title}}</title>
 <meta name="description" content="{{ .Site.Params.description }}" />
diff --git a/themes/simple/layouts/partials/tailwind.html b/themes/simple/layouts/partials/tailwind.html
index 616ab3a..b6fd763 100755
--- a/themes/simple/layouts/partials/tailwind.html
+++ b/themes/simple/layouts/partials/tailwind.html
@@ -101,6 +101,20 @@
       @apply my-10;
     }
 
+    /* Lazy loading of iframes */
+    article.single .ll-iframe {
+      @apply bg-gray-100 rounded;
+    }
+
+    article.single .ll-iframe::before {
+      @apply h-full flex border-2 border-gray-300 rounded justify-center items-center font-medium text-sm cursor-pointer animate-pulse;
+      content: 'Click here to load resource…';
+    }
+
+    article.single .ll-iframe.empty::before {
+      content: none;
+    }
+
     /* Cactus Comments */
     .comments img {
       max-width: auto !important;