Fix gallery item size

assets/css/gallery.css

@@ -0,0 +1,55 @@
+ .gallery {
+     display: grid;
+     grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
+     gap: 10px;
+     padding: 20px;
+ }
+
+ .gallery-item {
+     overflow: hidden;
+ }
+
+ .gallery-item img {
+     width: 100%;
+     height: auto;
+     display: block;
+ }
+
+ .modal {
+     display: none;
+     position: fixed;
+     z-index: 1;
+     padding-top: 100px;
+     left: 0;
+     top: 0;
+     width: 100%;
+     height: 100%;
+     overflow: auto;
+     background-color: rgba(0, 0, 0, 0.9);
+ }
+
+ .modal-content {
+     margin: auto;
+     display: block;
+     max-height: 900px;
+     width: auto;
+     height: 90%;
+ }
+
+ .close {
+     position: absolute;
+     top: 15px;
+     right: 35px;
+     color: #f1f1f1;
+     font-size: 40px;
+     font-weight: bold;
+     transition: 0.3s;
+ }
+
+ .close:hover,
+ .close:focus {
+     color: #bbb;
+     text-decoration: none;
+     cursor: pointer;
+ }
+

assets/css/main.scss

@@ -1,7 +1,7 @@
 /* VARIABLES ========================================================================== */
 
 // COLORS
-$teal: #63BDA2;
+$teal: #1F8455;
 $teal-darker: #359377;
 $gray-background: #F7F7F7;
 $gray-table-border: #EEEEEE;
@@ -482,6 +482,8 @@ footer {
         display: inline-block;
         height: 2em;
         position: relative;
+        border: none;
+        background: none;
     }
 
     .social-icon>svg:hover {

assets/js/gallery.js

@@ -0,0 +1,11 @@
+function openModal(imageSrc) {
+    let modal = document.getElementById("myModal");
+    let modalImg = document.getElementById("modalImage");
+    modal.style.display = "block";
+    modalImg.src = imageSrc;
+}
+
+function closeModal() {
+    let modal = document.getElementById("myModal");
+    modal.style.display = "none";
+}

i18n/bg.toml

@@ -0,0 +1,29 @@
+[page]
+other = "Страница"
+
+[of]
+other = "от"
+
+[newer]
+other = "По-нови"
+
+[older]
+other = "По-стари"
+
+[tagged]
+other = "Тагнати"
+
+[tags]
+other = "Тагове"
+
+[read_more]
+other = "Прочети повече..."
+
+[archive]
+other = "Архив"
+
+[noteworthy_theme]
+other = "Тема Noteworthy"
+
+[built_with_hugo]
+other = "Направено с Hugo"

i18n/de.toml

@@ -0,0 +1,29 @@
+[page]
+other = "Seite"
+
+[of]
+other = "von"
+
+[newer]
+other = "Neuere"
+
+[older]
+other = "Ältere"
+
+[tagged]
+other = "Getaggt"
+
+[tags]
+other = "Tags"
+
+[read_more]
+other = "Mehr lesen..."
+
+[archive]
+other = "Archiv"
+
+[noteworthy_theme]
+other = "Noteworthy Theme"
+
+[built_with_hugo]
+other = "Gebaut mit Hugo"

i18n/en.toml

@@ -13,9 +13,15 @@ other = "Older"
 [tagged]
 other = "Tagged"
 
+[tags]
+other = "Tags"
+
 [read_more]
 other = "Read more..."
 
+[archive]
+other = "Archive"
+
 [noteworthy_theme]
 other = "Noteworthy theme"
 

i18n/it.toml

@@ -1,23 +0,0 @@
-[page]
-other = "Pagina"
-
-[of]
-other = "di"
-
-[newer]
-other = "Successivi"
-
-[older]
-other = "Precedenti"
-
-[tagged]
-other = "Contrassegnato"
-
-[read_more]
-other = "Continua a leggere..."
-
-[noteworthy_theme]
-other = "Tema Noteworthy"
-
-[built_with_hugo]
-other = "Realizzato con Hugo"

layouts/_default/single.html

@@ -26,9 +26,9 @@
         {{if .Params.tags}}
         <hr class="footer-divider">
         {{ range .Params.tags }}
-            <a class="tag" href="/tags/{{ . | urlize }}">#{{.}}</a>
+            <a class="tag" href="{{ "/tags/" | relURL }}{{ . | urlize }}">#{{.}}</a>
         {{ end }}
       {{ end }}
     </div>
 
-{{end}}
+{{end}}

layouts/index.html

@@ -8,6 +8,7 @@
         <!-- Range over the pages and only include the ones that are a post type -->
         {{ $pages := where site.RegularPages "Type" "in" site.Params.mainSections }}
         {{ range (.Paginate $pages).Pages }}
+        {{ if not (.Param "Archive")  }}
         <article>
             <h2>
                 <a href="{{ .Permalink }}">
@@ -26,13 +27,14 @@
             <!-- Display tags -->
             {{if .Params.tags}}
                 {{ range .Params.tags }}
-                    <a class="tag" href="{{ "/tags/" | relLangURL }}{{ . | urlize }}">#{{.}}</a>
+                    <a class="tag" href="{{ "/tags/" | relURL }}{{ . | urlize }}">#{{.}}</a>
                 {{ end }}
             {{ end }}
             </div> 
            
         </article>
         {{ end }}
+        {{ end }}
     </div>
         <!-- Custom paginator -->
         <div class="paginator">

layouts/partials/footer-mobile.html

@@ -2,11 +2,19 @@
 	{{ partial "social.html" . }}
 
 	<div class="footer-mobile-links">
-        <p><a href="https://github.com/kimcc/hugo-theme-noteworthy" target="_blank" rel="noopener">{{ i18n "noteworthy_theme" }}</a></p>
+        <p><a href="https://git.ivayloivanov.eu/ivo/hugo-theme-noteworthy" target="_blank" rel="noopener">{{ i18n "noteworthy_theme" }}</a></p>
 		<span class="divider-bar">|</span>
         <p><a href="https://gohugo.io" target="_blank" rel="noopener">{{ i18n "built_with_hugo" }}</a></p>
 	</div>
 
 	{{ $script := resources.Get "js/main.js" | minify | fingerprint -}}
 	<script src="{{ $script.Permalink }}" {{ printf "integrity=%q" $script.Data.Integrity | safeHTMLAttr }} crossorigin="anonymous"></script>
+
+  {{ $js := resources.Get "js/gallery.js" }}
+  {{ $jsFile := $js | resources.Minify }}
+  <script type="text/javascript" src="{{ $jsFile.Permalink }}"></script>
+
+  {{ $css := resources.Get "css/gallery.css" }}
+  {{ $cssFile := $css | resources.Minify }}
+  <link href="{{ $cssFile.Permalink }}" rel="stylesheet">
 </footer>

layouts/partials/footer.html

@@ -1,9 +1,16 @@
 <footer class="footer">
 	{{ partial "social.html" . }}
 
-    <p><a href="https://github.com/kimcc/hugo-theme-noteworthy" target="_blank" rel="noopener">{{ i18n "noteworthy_theme" }}</a></p>
+    <p><a href="https://git.ivayloivanov.eu/ivo/hugo-theme-noteworthy" target="_blank" rel="noopener">{{ i18n "noteworthy_theme" }}</a></p>
     <p><a href="https://gohugo.io" target="_blank" rel="noopener">{{ i18n "built_with_hugo" }}</a></p>
 
-	{{ $script := resources.Get "js/main.js" | minify | fingerprint -}}
+  <script src="{{ "/" | relURL }}js/main.js"></script>
-	<script src="{{ $script.Permalink }}" {{ printf "integrity=%q" $script.Data.Integrity | safeHTMLAttr }} crossorigin="anonymous"></script>
+
+  {{ $js := resources.Get "js/gallery.js" }}
+  {{ $jsFile := $js | resources.Minify }}
+  <script type="text/javascript" src="{{ $jsFile.Permalink }}"></script>
+
+  {{ $css := resources.Get "css/gallery.css" }}
+  {{ $cssFile := $css | resources.Minify }}
+  <link href="{{ $cssFile.Permalink }}" rel="stylesheet">
 </footer>

layouts/partials/head.html

@@ -6,13 +6,21 @@
 
     <title>{{ if .IsHome }}{{ .Site.Title }}{{ else }}{{ .Title }} | {{ .Site.Title }}{{ end }}</title>
     <!-- Icons -->
-    <link rel="apple-touch-icon" sizes="180x180" href="{{ "apple-touch-icon.png" | relURL }}">
+    <link rel="apple-touch-icon" sizes="180x180" href="{{ "/" | relURL }}favicon/apple-touch-icon.png">
-    <link rel="icon" type="image/png" sizes="32x32" href="{{ "favicon-32x32.png" | relURL }}">
+    <link rel="icon" type="image/png" sizes="32x32" href="{{ "/" | relURL }}favicon/favicon-32x32.png">
-    <link rel="icon" type="image/png" sizes="16x16" href="{{ "favicon-16x16.png" | relURL }}">
+    <link rel="icon" type="image/png" sizes="16x16" href="{{ "/" | relURL }}favicon/favicon-16x16.png">
-    <link rel="manifest" href="{{ "manifest.json" | relURL }}">
+    <link rel="manifest" href="{{ "/" | relURL }}favicon/manifest.json">
-    <link rel="mask-icon" href="{{ "safari-pinned-tab.svg" | relURL }}" color="#FF3DB4">
+    <link rel="mask-icon" href="{{ "/" | relURL }}favicon/safari-pinned-tab.svg" color="#FF3DB4">
     <meta name="theme-color" content="#ffffff">
 
+    <!-- SSO Metadata -->
+    <meta name="robots" content="follow, index, max-snippet:-1, max-video-preview:-1, max-image-preview:large"/>
+    <meta
+      name="description"
+      content="{{ if .Params.description }}{{ .Params.description }}{{ end }}"
+    />
+    {{ partial "schema.html" . }}
+
     <!-- Styles -->
     <!-- Use Hugo Pipes to process the Sass file (convert to CSS, minify, and add a hash) -->
     {{ $main_style := resources.Get "css/main.scss" | toCSS | minify | fingerprint }}
@@ -20,16 +28,18 @@
 
     <!-- Uncomment to add custom styles -->
     <!-- Modify the custom.scss file inside assets > css to use scss -->
-    <!-- {{ $custom_style := resources.Get "css/custom.scss" | toCSS | minify | fingerprint }} 
+    <!-- {{ $custom_style := resources.Get "css/custom.scss" | toCSS | minify | fingerprint }}
     <link rel="stylesheet" href="{{ $custom_style.Permalink }}"/> -->
 
     <!-- Modify the custom.css file inside static > css to use vanilla css -->
-    <!-- <link type="text/css" rel="stylesheet" href="{{ "/" | relURL }}css/custom.css"> -->
+    <link type="text/css" rel="stylesheet" href="{{ "/" | relURL }}css/custom.css">
- 
+
+    <link rel="stylesheet" href="{{ "/" | relURL }}css/bootstrap.min.css">
+
     {{ with .OutputFormats.Get "RSS" }}
     {{ printf `<link rel="%s" type="%s" href="%s" title="%s" />` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }}
     {{ end }}
-    {{- if not .Site.IsServer -}}
+    {{- if not hugo.IsServer -}}
       {{ template "_internal/google_analytics.html" . }}
     {{- end -}}
 </head>

layouts/partials/nav.html

@@ -1,11 +1,11 @@
 <!-- Sidebar navigation -->
 <nav>
-  {{ partial "header.html" . }}
+    {{ partial "header.html" . }}
-  <div class="nav-menu">
+    <div class="nav-menu">
-  {{ range .Site.Menus.main }}
+    {{ range .Site.Menus.main }}
-    <a class="color-link nav-link" href="{{ .URL }}">{{ .Name }}</a>
+      <a class="color-link nav-link" href="{{ .URL | relLangURL }}">{{ .Name }}</a>
-  {{ end }}
+    {{ end }}
-  <a class="color-link nav-link" href="{{ .Site.RSSLink }}" target="_blank" rel="noopener" type="application/rss+xml">RSS</a>
+      <a class="color-link nav-link" href="{{ .Site.BaseURL }}/archive/">{{ i18n "archive" }}</a>
-</div>
+    </div>
 {{ partial "footer.html" . }}
 </nav>

layouts/partials/schema.html

@@ -0,0 +1,66 @@
+{{ if .IsHome -}}
+<script type="application/ld+json">
+{
+    "@context": "http://schema.org",
+    "@type": "WebSite",
+    "name": "{{ .Site.Title }}",
+    "url": "{{ .Site.BaseURL }}",
+    "description": "{{ .Site.Params.description }}",
+    "thumbnailUrl": "{{ .Site.BaseURL }}favicon/favicon-32x32.png"
+}
+</script>
+{{ else if .IsPage }}
+{{ $author :=  or (.Params.author) (.Site.Params.Author.name) }}
+{{ $authorUrl :=  or (.Params.authorUrl) (.Site.Params.Author.url) }}
+{{ $org_name :=  .Site.Title }}
+<script type="application/ld+json">
+{
+    "@context": "http://schema.org",
+    "@type": "BlogPosting",
+    "name": "{{ .Title | safeJS }}",
+    "headline": "{{ .Title | safeJS }}",
+    "description": "{{ if .Description }}{{ .Description | safeJS }}{{ else }}{{if .IsPage}}{{ .Summary  }}{{ end }}{{ end }}",
+    "inLanguage": {{ .Site.LanguageCode | default "en-us" }},
+    "isFamilyFriendly": "true",
+    "mainEntityOfPage": {
+        "@type": "WebPage",
+        "@id": "{{ .Permalink }}"
+    },
+    "author" : {
+        "@type": "Person",
+        "name": "{{ $author }}",
+        "url": "{{ $authorUrl }}"
+    },
+    "creator" : {
+        "@type": "Person",
+        "name": "{{ $author }}"
+    },
+    "accountablePerson" : {
+        "@type": "Person",
+        "name": "{{ $author }}"
+    },
+    "copyrightHolder" : "{{ $org_name }}",
+    "copyrightYear" : "{{ .Date.Format "2006" }}",
+    "dateCreated": "{{ .Date.Format "2006-01-02T15:04:05.00Z" | safeHTML }}",
+    "datePublished": "{{ .PublishDate.Format "2006-01-02T15:04:05.00Z" | safeHTML }}",
+    "dateModified": "{{ .Lastmod.Format "2006-01-02T15:04:05.00Z" | safeHTML }}",
+    "publisher":{
+        "@type":"Organization",
+        "name": {{ $org_name }},
+        "url": {{ .Site.BaseURL }},
+        "logo": {
+            "@type": "ImageObject",
+            "url": "{{ .Site.BaseURL }}favicon/favicon-32x32.png",
+            "width":"32",
+            "height":"32"
+        }
+    },
+    "image": {{ if .Params.images }}[{{ range $i, $e := .Params.images }}{{ if $i }}, {{ end }}{{ $e | absURL }}{{ end }}]{{ else}}{{.Site.Params.logo | absURL }}{{ end }},
+    "url" : "{{ .Permalink }}",
+    "wordCount" : "{{ .WordCount }}",
+    "genre" : [ {{ range $index, $tag := .Params.tags }}{{ if $index }}, {{ end }}"{{ $tag }}" {{ end }}],
+    "keywords" : [ {{ range $index, $keyword := .Params.keywords }}{{ if $index }}, {{ end }}"{{ $keyword }}" {{ end }}]
+}
+</script>
+{{ end }}
+

layouts/partials/social.html

@@ -236,6 +236,36 @@
     </a>
     {{ end }}
 
+    {{ if isset .Site.Params "gitea" }}
+    <a class="social-icon" href="{{ .Site.Params.Gitea }}" target="_blank" rel="noopener" title="Gitea">
+        <svg width="40px" height="40px" viewBox="0 0 30 30" version="1.1" fill="#ABABAB" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink" style="margin-top: 20%;">
+            <path d="M4.209 4.603c-.247 0-.525.02-.84.088c-.333.07-1.28.283-2.054 1.027C-.403 7.25.035 9.685.089 10.052c.065.446.263 1.687 1.21 2.768c1.749 2.141 5.513 2.092 5.513 2.092s.462 1.103 1.168 2.119c.955 1.263 1.936 2.248 2.89 2.367c2.406 0 7.212-.004 7.212-.004s.458.004 1.08-.394c.535-.324 1.013-.893 1.013-.893s.492-.527 1.18-1.73c.21-.37.385-.729.538-1.068c0 0 2.107-4.471 2.107-8.823c-.042-1.318-.367-1.55-.443-1.627c-.156-.156-.366-.153-.366-.153s-4.475.252-6.792.306c-.508.011-1.012.023-1.512.027v4.474l-.634-.301c0-1.39-.004-4.17-.004-4.17c-1.107.016-3.405-.084-3.405-.084s-5.399-.27-5.987-.324c-.187-.011-.401-.032-.648-.032zm.354 1.832h.111s.271 2.269.6 3.597C5.549 11.147 6.22 13 6.22 13s-.996-.119-1.641-.348c-.99-.324-1.409-.714-1.409-.714s-.73-.511-1.096-1.52C1.444 8.73 2.021 7.7 2.021 7.7s.32-.859 1.47-1.145c.395-.106.863-.12 1.072-.12zm8.33 2.554c.26.003.509.127.509.127l.868.422l-.529 1.075a.686.686 0 0 0-.614.359a.685.685 0 0 0 .072.756l-.939 1.924a.69.69 0 0 0-.66.527a.687.687 0 0 0 .347.763a.686.686 0 0 0 .867-.206a.688.688 0 0 0-.069-.882l.916-1.874a.667.667 0 0 0 .237-.02a.657.657 0 0 0 .271-.137a8.826 8.826 0 0 1 1.016.512a.761.761 0 0 1 .286.282c.073.21-.073.569-.073.569c-.087.29-.702 1.55-.702 1.55a.692.692 0 0 0-.676.477a.681.681 0 1 0 1.157-.252c.073-.141.141-.282.214-.431c.19-.397.515-1.16.515-1.16c.035-.066.218-.394.103-.814c-.095-.435-.48-.638-.48-.638c-.467-.301-1.116-.58-1.116-.58s0-.156-.042-.27a.688.688 0 0 0-.148-.241l.516-1.062l2.89 1.401s.48.218.583.619c.073.282-.019.534-.069.657c-.24.587-2.1 4.317-2.1 4.317s-.232.554-.748.588a1.065 1.065 0 0 1-.393-.045l-.202-.08l-4.31-2.1s-.417-.218-.49-.596c-.083-.31.104-.691.104-.691l2.073-4.272s.183-.37.466-.497a.855.855 0 0 1 .35-.077z" fill="currentColor"></path>
+        </svg>
+    </a>
+    {{ end }}
+
+    <a class="social-icon" href="/index.xml" target="_blank" rel="noopener" type="application/rss+xml" title="RSS">
+        <svg width="22px" height="22px" viewBox="0 0 8 8" version="1.1" fill="#ABABAB" xmlns="https://www.w3.org/2000/svg" xmlns:xlink="https://www.w3.org/1999/xlink">
+            <style type="text/css">
+              .button {stroke: none; fill: #ABABAB;}
+              .symbol {stroke: none; fill: white;}
+              .button:hover {fill: #898989;}
+              .symbol:hover {fill: white;}
+            </style>
+
+            <rect class="button" width="8" height="8" rx="1.5"/>
+            <circle class="symbol" cx="2" cy="6" r="1"/>
+            <path class="symbol" d="m 1,4 a 3,3 0 0 1 3,3 h 1 a 4,4 0 0 0 -4,-4 z"/>
+            <path class="symbol" d="m 1,2 a 5,5 0 0 1 5,5 h 1 a 6,6 0 0 0 -6,-6 z"/>
+        </svg>
+    </a>
+
+    <button class="social-icon" onclick="toggleDarkMode()" rel="noopener" type="button" title="Dark Mode">
+        <svg fill="#ABABAB" width="28px" height="28px" viewBox="0 0 56 56" xmlns="http://www.w3.org/2000/svg">
+            <path d="M 27.9999 51.9062 C 41.0546 51.9062 51.9063 41.0547 51.9063 28.0000 C 51.9063 14.9219 41.0312 4.0938 27.9765 4.0938 C 14.8983 4.0938 4.0937 14.9219 4.0937 28.0000 C 4.0937 41.0547 14.9218 51.9062 27.9999 51.9062 Z M 34.9374 32.9453 C 36.5546 32.9453 38.1952 32.5938 39.1796 32.2422 C 39.4374 32.1719 39.6014 32.1484 39.7421 32.1484 C 40.1171 32.1484 40.5155 32.4766 40.5155 32.9687 C 40.5155 33.0625 40.4921 33.3672 40.3749 33.6719 C 38.6874 37.9375 33.8358 41.3828 28.2109 41.3828 C 20.4999 41.3828 14.6171 35.875 14.6171 28.1640 C 14.6171 22.6562 17.8749 17.4062 22.7265 15.4844 C 23.0312 15.3672 23.3124 15.3438 23.4765 15.3438 C 23.9687 15.3438 24.2499 15.7422 24.2499 16.0938 C 24.2499 16.2109 24.2265 16.3984 24.1093 16.7031 C 23.6874 17.8047 23.2890 19.8906 23.2890 21.3672 C 23.2890 28.4687 27.8358 32.9453 34.9374 32.9453 Z"/>
+        </svg>
+    </button>
+
 </div>
 
 

layouts/partials/tags.html

@@ -0,0 +1,5 @@
+<ul>
+  {{ range .Site.Taxonomies.tags }}
+    <li><a class="tag" href="{{ .Page.Permalink }}">{{ .Page.Title }}</a> {{ .Count }}</li>
+  {{ end }}
+</ul>

layouts/shortcodes/archive.html

@@ -0,0 +1,20 @@
+{{/*
+
+simple shortcode to display all posts in yearly sections on your archive page
+by Charl P. Botha
+
+this is a much simplified version of the yearly post archiving template at:
+https://rohanverma.net/blog/2019/11/15/archive-pages-group-by-year-hugo/
+
+*/}}
+
+{{ $prev := 3000}}
+{{range where .Site.RegularPages "Section" "posts"}}
+{{if .Date}}
+{{if gt $prev (.Date.Format "2006")}}
+## {{ .Date.Format "2006" }}
+{{end}}
+{{.Date.Format "02 Jan"}} -- [{{.Title}}]({{.Permalink}})
+{{ $prev = .Date.Format "2006"}}
+{{end}}
+{{end}}

layouts/shortcodes/col.html

@@ -0,0 +1 @@
+<div class="col-{{ index .Params 0 }}">{{ .Inner }}</div>

layouts/shortcodes/collapsible.html

@@ -0,0 +1,6 @@
+<div>
+<button type="button" class="collapsible">{{ index .Params 0 }}</button>
+<div class="collapsible-content">
+  {{ .Inner }}
+</div>
+</div>

layouts/shortcodes/container.html

@@ -0,0 +1 @@
+<div class="container">{{ .Inner }}</div>

layouts/shortcodes/fontawesome.html

@@ -0,0 +1,6 @@
+<span class="inline-svg" >
+    {{- $fname:=print "fontawesome/" ( .Get 0 ) ".svg" -}}
+    {{- $path:="<path" -}}
+    {{- $fill:="<path fill=\"currentColor\"" -}}
+    {{ replace (readFile $fname) $path $fill | safeHTML }}
+</span>

layouts/shortcodes/image-gallery.html

@@ -0,0 +1,48 @@
+{{/* https://www.geeksforgeeks.org/how-to-make-image-gallery-using-html-css-and-javascript/ */}}
+{{/*
+Add this to your config yaml to serve images from `static/albums``
+
+module:
+  mounts:
+    source: static/albums
+    target: assets/albums
+
+
+*/}}
+
+{{ $dir := string .Params.gallery_dir }}
+
+<div class="gallery">
+{{ range (readDir (print "/static" $dir)) }}
+  {{- $imageurl := printf "%s/%s" $dir .Name -}}
+  {{- $image := resources.Get $imageurl -}}
+  {{- $imagetitle := index (split .Name ".") 0 -}}
+    {{- if eq $image nil -}}
+    {{ return }}
+    {{- else -}}
+    <div class="gallery-item">
+        <img src="{{ $image.Permalink }}"
+            onclick="openModal('{{ $image.Permalink }}')"
+            alt="{{ $imagetitle }}">
+    </div>
+    {{- end -}}
+{{ end }}
+</div>
+
+<!-- Modal for Image Display -->
+<div id="myModal" class="modal">
+    <span class="close" onclick="closeModal()">&times;</span>
+    <img class="modal-content" id="modalImage">
+</div>
+
+<!-- JavaScript for Modal -->
+<script>    
+    function openModal(src) {
+        document.getElementById("modalImage").src = src;
+        document.getElementById("myModal").style.display = "block";
+    }
+
+    function closeModal() {
+        document.getElementById("myModal").style.display = "none";
+    }
+</script>

layouts/shortcodes/row.html

@@ -0,0 +1 @@
+<div class="row">{{ .Inner }}</div>

static/css/custom.css

@@ -0,0 +1,85 @@
+/** Link decoration */
+* .site-title a {
+    color: #898989;
+    text-decoration: none;
+}
+
+* .site-title a:hover {
+    color: #5F5F5F;
+    text-decoration: none;
+}
+
+* article h2 a {
+    color: #5F5F5F;
+    text-decoration: none;
+}
+
+* article h2 a:hover {
+    color: #5F5F5F;
+    text-decoration: none;
+}
+
+/** Post title colours */
+.post-title {
+    color: #5F5F5F;
+}
+
+/** Tag Link colours */
+.tag {
+    color: #898989;
+}
+
+.tag:hover {
+    color: #5F5F5F;
+}
+
+/** Icons */
+.inline-svg {
+    display: inline-block;
+    height: 1rem;
+    width: 1rem;
+    position: relative;
+}
+
+/** Dark Mode */
+.dark-mode {
+    background-color: black;
+    color: white;
+}
+
+.dark-mode * h2 a {
+    text-shadow: none;
+    box-shadow: none;
+    color: white;
+}
+
+
+/** Collapsible **/
+
+ /* Style the button that is used to open and close the collapsible content */
+.collapsible {
+  background-color: #eee;
+  color: #444;
+  cursor: pointer;
+  padding: 18px;
+  width: 100%;
+  border: none;
+  text-align: left;
+  outline: none;
+  font-size: 15px;
+}
+
+/* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) */
+.active, .collapsible:hover {
+  background-color: #ccc;
+}
+
+/* Style the collapsible content. Note: hidden by default */
+.collapsible-content {
+  padding: 0 18px;
+  display: none;
+  overflow: hidden;
+  background-color: #f1f1f1;
+  color: black;
+} 
+

static/js/main.js

@@ -0,0 +1,58 @@
+document.addEventListener("DOMContentLoaded", function() {
+  setDarkMode()
+
+  var coll = document.getElementsByClassName("collapsible")
+
+  for (let i = 0; i < coll.length; i++) {
+    coll[i].addEventListener("click", function() {
+      this.classList.toggle("active")
+      var content = this.nextElementSibling
+      if (content.style.display === "block") {
+        content.style.display = "none"
+      } else {
+        content.style.display = "block"
+      }
+    })
+  }
+})
+
+
+function setCookie(cname, cvalue, exdays) {
+  document.cookie = cname + "=" + cvalue + ";path=/"
+}
+
+function getCookie(cname) {
+  let name = cname + "="
+  let decodedCookie = decodeURIComponent(document.cookie)
+  let ca = decodedCookie.split(';')
+  for(let i = 0; i <ca.length; i++) {
+    let c = ca[i]
+    while (c.charAt(0) == ' ') {
+      c = c.substring(1)
+    }
+    if (c.indexOf(name) == 0) {
+      return c.substring(name.length, c.length)
+    }
+  }
+  return ""
+}
+
+function isStringTrue(val) {
+  return String(val).toLowerCase() === 'true'
+}
+
+function toggleDarkMode() {
+  let darkMode = getCookie("setDarkMode")
+  if(isStringTrue(darkMode))
+    setCookie("setDarkMode", false)
+  else
+    setCookie("setDarkMode", true)
+    document.body.classList.toggle("dark-mode")
+}
+
+
+function setDarkMode() {
+  let darkMode = getCookie("setDarkMode")
+  if(isStringTrue(darkMode))
+    document.body.classList.toggle("dark-mode")
+}

theme.toml

@@ -1,12 +1,12 @@
 name = "Noteworthy"
 license = "MIT"
-licenselink = "https://github.com/kimcc/hugo-theme-noteworthy/blob/master/LICENSE.md"
+licenselink = "https://git.ivayloivanov.eu/ivo/hugo-theme-noteworthy/src/branch/master/LICENSE.md"
 description = "A minimalist Hugo theme for writers and bloggers."
-homepage = "https://github.com/kimcc/hugo-theme-noteworthy"
+homepage = "https://git.ivayloivanov.eu/ivo/hugo-theme-noteworthy"
-tags = ["blog", "minimalist", "minimal", "clean", "simple", "responsive", "light"]
+tags = ["blog", "minimalist", "minimal", "clean", "simple", "responsive", "light", "dark"]
 features = ["blog", "responsive", "social media"]
 min_version = "0.55.2"
 
 [author]
-    name = "kimcc"
+    name = "ivo"
-    homepage = "https://github.com/kimcc"
+    homepage = "https://git.ivayloivanov.eu"