ADD rel-tag to socials, ADD scrolleventlistener, ADD totop-button, ADD scroll progress bar

layouts/partials/components/icon.html

@@ -3,4 +3,7 @@ type: string - default: link
 text: string (optional)
 url: string
 -->
-<a href="{{ .url }}"><i class="{{ if .type }} icon-{{ .type }} {{ else }} icon-link {{ end }}"></i>{{ if .text }} {{ .text }}{{ end }}</a>
+<a href="{{ .url }}" rel="{{ .rel }}">
+  <i class="{{ if .type }} icon-{{ .type }} {{ else }} icon-link {{ end }}"></i>
+  {{ if .text }} {{ .text }}{{ end }}
+</a>

layouts/partials/components/image.html

@@ -3,8 +3,25 @@ type: string - default
 url: string
 alt: string
 -->
-
 {{ $avatar := "avatar"}}
-<img class="{{if eq .type $avatar}} avatar {{end}}" alt="{{ .alt }}" src="{{ .url }}">
+
+<picture>
+  <source 
+    type="image/avif"
+    src="{{ .url }}.avif"
+  />
+  <source 
+    type="image/webp"
+    src="{{ .url }}.webp"
+  />
+  <img 
+    class="{{if eq .type $avatar}} avatar {{end}}" 
+    alt="{{ .alt }}" 
+    src="{{ .url }}"
+    loading="lazy"
+    decoding="async"
+  >
+</picture>
+
 
 {{/*  https://www.brycewray.com/posts/2023/05/better-code-image-processing-hugo-render-hook-edition/  */}}