From 327f17dd398cbf2056d33a72bc9216be9003099a Mon Sep 17 00:00:00 2001
From: Hoernschen <julian.hoernschemeyer@mailbox.org>
Date: Fri, 8 Jul 2022 17:35:15 +0200
Subject: [PATCH] ADD Image description, REFACTORING

---
 assets/scss/index.scss        |  2 +-
 layouts/404.html              |  2 +-
 layouts/_default/single.html  |  2 +-
 layouts/_default/term.html    | 26 ++++++++++++++------------
 layouts/partials/header.html  |  2 +-
 layouts/partials/links.html   | 14 --------------
 layouts/partials/posts.html   |  4 ++--
 layouts/partials/service.html |  4 ++--
 layouts/partials/team.html    |  4 ++--
 layouts/posts/list.html       |  4 ++--
 layouts/posts/single.html     |  6 +++---
 layouts/team/list.html        |  4 ++--
 layouts/team/single.html      | 26 ++++++++++++++------------
 13 files changed, 45 insertions(+), 55 deletions(-)

diff --git a/assets/scss/index.scss b/assets/scss/index.scss
index 669e00f..c988009 100644
--- a/assets/scss/index.scss
+++ b/assets/scss/index.scss
@@ -419,7 +419,7 @@ button {
     box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
     max-width: 350px;
     height: 400px;
-    margin: 5px;
+    margin: auto;
     justify-content: center;
 }
 
diff --git a/layouts/404.html b/layouts/404.html
index 25db2e6..98e5238 100644
--- a/layouts/404.html
+++ b/layouts/404.html
@@ -1,5 +1,5 @@
 {{ define "main" }}
     <div class="notfound">
-        <img class="notfoundimage" src="/images/undraw_page_not_found_su7k.svg">
+        <img class="notfoundimage" src="/images/undraw_page_not_found_su7k.svg" alt="Not Found Image">
     </div>
 {{ end }}
\ No newline at end of file
diff --git a/layouts/_default/single.html b/layouts/_default/single.html
index 2ccfa6b..2918eba 100644
--- a/layouts/_default/single.html
+++ b/layouts/_default/single.html
@@ -1,7 +1,7 @@
 {{ define "main" }}
     {{ with .Params.image }}
         {{ if .url }}
-            <img class="coverimage" src="{{ .url }}" />
+            <img class="coverimage" src="{{ .url }}" alt="{{ .alt }}" />
         {{ else }}
             <img class="coverimage" src="{{ . }}" />
         {{ end }}
diff --git a/layouts/_default/term.html b/layouts/_default/term.html
index d5ab45d..9339310 100644
--- a/layouts/_default/term.html
+++ b/layouts/_default/term.html
@@ -9,18 +9,20 @@
   </article>
   <div class="cardList">
   {{ range .Pages }}
-    <a href="{{.Permalink}}">
-      <div class="card">
-        {{ if .Params.image }}
-          <img class="cardImage" src="{{ .Params.image }}" />
-        {{ else }}
-          <img class="cardImage" src="{{ $.Site.Params.defaultimage }}"  />
-        {{ end }}
-        <div class="cardTitle">{{.Title}}</div>
-        <div class="cardDescription">{{ .Content | safeHTML | truncate 250 }}</div>
-        <div class="cardDetail">{{.Date.Format "02.01.2006"}} | {{.ReadingTime}} Minuten</div>
-      </div>
-    </a>
+    <div class="card">
+      <a href="{{.Permalink}}">
+        <div class="cardContent">
+          {{ if .Params.image }}
+            <img class="cardImage {{ if eq .Params.image.cover false }} noCover {{ end }}" alt="{{ .Params.image.alt }}" src="{{ .Params.image.url }}" />
+          {{ else }}
+            <img class="cardImage" src="{{ .Site.Params.defaultimage }}" alt="Default Image" />
+          {{ end }}
+          <div class="cardTitle">{{.Title}}</div>
+          <div class="cardDescription">{{ .Content | safeHTML | truncate 250 }}</div>
+          <div class="cardDetail">{{.Date.Format "02.01.2006"}} | {{.ReadingTime}} Minuten</div>
+        </div>
+      </a>
+    </div>
   {{ end }}
   </div>
 </div>
diff --git a/layouts/partials/header.html b/layouts/partials/header.html
index 8438d04..ef1f315 100644
--- a/layouts/partials/header.html
+++ b/layouts/partials/header.html
@@ -13,7 +13,7 @@
 <div class="progress"></div>
 <header class="header" id="header">
     <div class="header-container">
-        <a class="home" href="/#"><img id="logo" class="logo" src="{{ .Site.Params.logo }}"></a>
+        <a class="home" href="/#"><img id="logo" class="logo" src="{{ .Site.Params.logo }}" alt="Logo"></a>
         <div class="header-items" id="header-items">
             {{- range $links}}
             {{ if .links }}
diff --git a/layouts/partials/links.html b/layouts/partials/links.html
index 25790ec..92f8d26 100644
--- a/layouts/partials/links.html
+++ b/layouts/partials/links.html
@@ -33,20 +33,6 @@
             </div>
           </a>
         </div>
-        {{/*  <a href="{{ .url }}">
-          <div class="mediumCard">
-            {{ if .image }}
-              <img class="cardImage" alt="{{ .image.alt }}" src="{{ .image.url }}" />
-            {{ else if .icon }}
-              <div class="cardImage">
-                <i class="fas fa-{{ .icon }} cardIcon"></i>
-              </div>
-            {{ else }}
-              <img class="cardImage" alt="default image" src="{{ $defaultimage }}"  />
-            {{ end }}
-            <div class="cardTitle">{{.title}}</div>
-          </div>
-        </a>  */}}
       {{- end}}
     </div>
   </div>
diff --git a/layouts/partials/posts.html b/layouts/partials/posts.html
index 39b5fe1..fc230ac 100644
--- a/layouts/partials/posts.html
+++ b/layouts/partials/posts.html
@@ -20,9 +20,9 @@
                     <a href="{{.Permalink}}">
                         <div class="cardContent">
                             {{ if .Params.image }}
-                                <img class="cardImage {{ if eq .Params.image.cover false }} noCover {{ end }}" src="{{ .Params.image.url }}" />
+                                <img class="cardImage {{ if eq .Params.image.cover false }} noCover {{ end }}" alt="{{ .Params.image.alt }}" src="{{ .Params.image.url }}" />
                             {{ else }}
-                                <img class="cardImage" src="{{ $defaultimage }}"  />
+                                <img class="cardImage" src="{{ $defaultimage }}" alt="Defaul Image" />
                             {{ end }}
                             <div class="cardTitle">{{.Title}}</div>
                             <div class="cardDescription">{{ .Content | safeHTML | truncate 250 }}</div>
diff --git a/layouts/partials/service.html b/layouts/partials/service.html
index f39a291..2d4cfe8 100644
--- a/layouts/partials/service.html
+++ b/layouts/partials/service.html
@@ -11,7 +11,7 @@
     <div class="section-content services">
         {{if and ($service.image) (eq $service.image.direction "left")}}
         <div class="service-icon-container col-4">
-            <img class="service-icon" src="{{ $service.image.url }}">
+            <img class="service-icon" src="{{ $service.image.url }}" alt="{{ $service.image.alt }}">
         </div>
         {{end}}
         <div class="service-description {{if $service.image}} col-8 {{end}}">
@@ -26,7 +26,7 @@
         </div>
         {{if and ($service.image) (eq $service.image.direction "right")}}
         <div class="service-icon-container col-4">
-            <img class="service-icon" src="{{ $service.image.url }}">
+            <img class="service-icon" src="{{ $service.image.url }}" alt="{{ $service.image.alt }}">
         </div>
         {{end}}
     </div>
diff --git a/layouts/partials/team.html b/layouts/partials/team.html
index 04abb0e..442c3aa 100644
--- a/layouts/partials/team.html
+++ b/layouts/partials/team.html
@@ -19,9 +19,9 @@
             <a href="{{.Permalink}}">
                 <div class="teammember">
                     {{ if .Params.image }}
-                        <img class="avatar" src="{{ .Params.image }}" alt="Avatar">
+                        <img class="avatar" src="{{ .Params.image }}" alt="{{ .Params.name }} Avatar">
                     {{ else }}
-                        <img class="avatar" src="{{ $defaultimage }}" alt="Avatar">
+                        <img class="avatar" src="{{ $defaultimage }}" alt="Default Avatar">
                     {{ end }}
                     <h1 class="teammember-title">{{ .Params.name }}</h1>
                     {{- range .Params.jobs }}
diff --git a/layouts/posts/list.html b/layouts/posts/list.html
index b8a2208..f9a1583 100644
--- a/layouts/posts/list.html
+++ b/layouts/posts/list.html
@@ -15,9 +15,9 @@
             <a href="{{.Permalink}}">
                 <div class="cardContent">
                     {{ if .Params.image }}
-                        <img class="cardImage {{ if eq .Params.image.cover false }} noCover {{ end }}" src="{{ .Params.image.url }}" />
+                        <img class="cardImage {{ if eq .Params.image.cover false }} noCover {{ end }}" alt="{{ .Params.image.alt }}" src="{{ .Params.image.url }}" />
                     {{ else }}
-                        <img class="cardImage" src="{{ .Site.Params.defaultimage }}"  />
+                        <img class="cardImage" src="{{ .Site.Params.defaultimage }}" alt="Default Image" />
                     {{ end }}
                     <div class="cardTitle">{{.Title}}</div>
                     <div class="cardDescription">{{ .Content | safeHTML | truncate 250 }}</div>
diff --git a/layouts/posts/single.html b/layouts/posts/single.html
index ee4f9f2..a663cf6 100644
--- a/layouts/posts/single.html
+++ b/layouts/posts/single.html
@@ -41,7 +41,7 @@
 
 {{ define "main" }}
     {{ with .Params.image }}
-        <img class="coverimage {{ if eq .cover false }} noCover {{ end }}" src="{{ .url }}" />
+        <img class="coverimage {{ if eq .cover false }} noCover {{ end }}" alt="{{ .alt }}" src="{{ .url }}" />
         {{ with .copyright }}
             <div class="image-copyright">© {{ . }}</div>
         {{ end }}
@@ -67,9 +67,9 @@
                 <a href="{{.Permalink}}">
                     <div class="author">
                         {{ if .Params.image }}
-                            <img class="avatar-small" src="{{ .Params.image }}" alt="Avatar">
+                            <img class="avatar-small" src="{{ .Params.image }}" alt="{{ .Params.name }} Avatar">
                         {{ else }}
-                            <img class="avatar-small" src="{{ $.Site.Params.defaultimage }}" alt="Avatar">
+                            <img class="avatar-small" src="{{ $.Site.Params.defaultimage }}" alt="Default Avatar">
                         {{ end }}
                         <h4 class="author-title">{{ .Params.name }}</h4>
                         <div class="social-media">
diff --git a/layouts/team/list.html b/layouts/team/list.html
index e249a88..586ebf2 100644
--- a/layouts/team/list.html
+++ b/layouts/team/list.html
@@ -12,9 +12,9 @@
         <a href="{{.Permalink}}">
             <div class="teammember">
                 {{ if .Params.image }}
-                    <img class="avatar" src="{{ .Params.image }}" alt="Avatar">
+                    <img class="avatar" src="{{ .Params.image }}" alt="{{ .Params.name }} Avatar">
                 {{ else }}
-                    <img class="avatar" src="{{ $.Site.Params.defaultimage }}" alt="Avatar">
+                    <img class="avatar" src="{{ $.Site.Params.defaultimage }}" alt="Default Avatar">
                 {{ end }}
                 <h1 class="teammember-title">{{ .Params.name }}</h1>
                 {{- range .Params.jobs }}
diff --git a/layouts/team/single.html b/layouts/team/single.html
index 7b1b4d7..c68e7f2 100644
--- a/layouts/team/single.html
+++ b/layouts/team/single.html
@@ -26,18 +26,20 @@
             {{ with .Site.GetPage "/posts" }}
                 {{- range .RegularPages -}}
                     {{if eq .Params.author $name}}
-                        <a href="{{.Permalink}}">
-                            <div class="card">
-                                {{ if .Params.image }}
-                                    <img class="cardImage" src="{{ .Params.image }}" />
-                                {{ else }}
-                                    <img class="cardImage" src="{{ $defaultimage }}"  />
-                                {{ end }}
-                                <div class="cardTitle">{{.Title}}</div>
-                                <div class="cardDescription">{{ .Content | safeHTML | truncate 250 }}</div>
-                                <div class="cardDetail">{{.Date.Format "02.01.2006"}} | {{.ReadingTime}} Minuten</div>
-                            </div>
-                        </a>
+                        <div class="card">
+                            <a href="{{.Permalink}}">
+                                <div class="cardContent">
+                                    {{ if .Params.image }}
+                                        <img class="cardImage {{ if eq .Params.image.cover false }} noCover {{ end }}" alt="{{ .Params.image.alt }}" src="{{ .Params.image.url }}" />
+                                    {{ else }}
+                                        <img class="cardImage" src="{{ .Site.Params.defaultimage }}" alt="Default Image" />
+                                    {{ end }}
+                                    <div class="cardTitle">{{.Title}}</div>
+                                    <div class="cardDescription">{{ .Content | safeHTML | truncate 250 }}</div>
+                                    <div class="cardDetail">{{.Date.Format "02.01.2006"}} | {{.ReadingTime}} Minuten</div>
+                                </div>
+                            </a>
+                        </div>
                     {{end}}
                 {{ end }}
             {{ end }}