Updated wedding invitation content

layouts/_default/wedding.html

@@ -56,14 +56,14 @@
   .countdown {
     text-align: center;
     margin-bottom: 2rem;
-    font-size: 1.2rem;
+    font-size: 5rem;
   }
 
   .footer {
     text-align: center;
     margin-top: 3rem;
     color: #888;
-    font-size: 1rem;
+    font-size: 2rem;
     padding-top: 1rem;
   }
 
@@ -87,10 +87,10 @@
 
   <!-- Hero -->
   <div class="hero">
-    <img src="/images/header-image.jpg" alt="Wedding Header Image">
+    <img src="/images/hochzeit-header.jpg" alt="Wedding Header Image">
     <h1>{{ .Title }}</h1>
     <div class="date">
-      {{ .Params.event.date | time.Format .Site.Language.Lang | default "January 2, 2006" }}
+	    {{ .Params.event.date | time | time.Format ":date_long" }}
     </div>
   </div>
 
@@ -104,10 +104,14 @@
   <!-- Event Details -->
   <div class="section">
     <h2>📅 {{ i18n "event_title" }}</h2>
-    {{ with .Params.event.ceremony_time }}
-      <p><strong>{{ i18n "ceremony" }}:</strong> {{ . }}</p>
+{{ with .Params.event.date }}
+  <p>
+    <strong>{{ i18n "ceremony" }}:</strong>
+    {{ . | time | time.Format ":date_long" }}{{ with $.Params.event.ceremony_time }}, {{ i18n "ceremony_time" }} {{ . }}
     {{ end }}
-    {{ with .Params.event.reception_time }}
+  </p>
+{{ end }}
+{{ with .Params.event.reception_time }}
       <p><strong>{{ i18n "reception" }}:</strong> {{ . }}</p>
     {{ end }}
     {{ with .Params.event.venue }}
@@ -153,6 +157,13 @@
 </div>
 
 <script>
+  var labels = {
+    day: "{{ i18n "day" }}",
+    hour: "{{ i18n "hour" }}",
+    minute: "{{ i18n "minute" }}",
+    second: "{{ i18n "second" }}"
+  };
+
   var countDownDate = new Date("{{ .Params.event.date }} {{ .Params.event.ceremony_time }}").getTime();
 
   var x = setInterval(function() {
@@ -164,8 +175,11 @@
     var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
     var seconds = Math.floor((distance % (1000 * 60)) / 1000);
 
-    document.getElementById("timer").innerHTML = days + "d " + hours + "h "
-      + minutes + "m " + seconds + "s ";
+    document.getElementById("timer").innerHTML =
+      days + " " + labels.day + " " +
+      hours + " " + labels.hour + " " +
+      minutes + " " + labels.minute + " " +
+      seconds + " " + labels.second;
 
     if (distance < 0) {
       clearInterval(x);
@@ -173,5 +187,4 @@
     }
   }, 1000);
 </script>
-
 {{ end }}