Updated wedding invitation content and added translations

layouts/_default/wedding.html

@@ -0,0 +1,177 @@
+{{ define "content" }}
+
+<style>
+  .wedding-container {
+    max-width: 800px;
+    margin: 0 auto;
+    padding: 2rem;
+    font-family: system-ui, sans-serif;
+    line-height: 1.6;
+  }
+
+  .hero {
+    text-align: center;
+    margin-bottom: 3rem;
+  }
+
+  .hero img {
+    width: 100%;
+    border-radius: 8px;
+  }
+
+  .hero h1 {
+    font-size: 2.5rem;
+    margin-bottom: 0.5rem;
+  }
+
+  .hero .date {
+    font-size: 1.2rem;
+    color: #666;
+  }
+
+  .section {
+    margin-bottom: 2.5rem;
+  }
+
+  .section h2 {
+    font-size: 1.5rem;
+    margin-bottom: 0.5rem;
+    border-bottom: 1px solid #eee;
+    padding-bottom: 0.3rem;
+  }
+
+  .map iframe {
+    width: 100%;
+    height: 400px;
+    border: 0;
+    border-radius: 8px;
+  }
+
+  .rsvp {
+    background: #f8f8f8;
+    padding: 1rem;
+    border-radius: 8px;
+  }
+
+  .countdown {
+    text-align: center;
+    margin-bottom: 2rem;
+    font-size: 1.2rem;
+  }
+
+  .footer {
+    text-align: center;
+    margin-top: 3rem;
+    color: #888;
+    font-size: 1rem;
+    padding-top: 1rem;
+  }
+
+  .footer a {
+    color: #0066cc;
+    text-decoration: none;
+  }
+
+  .footer a:hover {
+    text-decoration: underline;
+  }
+</style>
+
+<div class="wedding-container">
+
+  <!-- Countdown Timer -->
+  <div class="countdown">
+    <h3>{{ i18n "countdown_title" }}</h3>
+    <p id="timer"></p>
+  </div>
+
+  <!-- Hero -->
+  <div class="hero">
+    <img src="/images/header-image.jpg" alt="Wedding Header Image">
+    <h1>{{ .Title }}</h1>
+    <div class="date">
+      {{ .Params.event.date | time.Format .Site.Language.Lang | default "January 2, 2006" }}
+    </div>
+  </div>
+
+  <!-- Intro -->
+  {{ if .Content }}
+    <div class="section">
+      {{ .Content }}
+    </div>
+  {{ end }}
+
+  <!-- Event Details -->
+  <div class="section">
+    <h2>📅 {{ i18n "event_title" }}</h2>
+    {{ with .Params.event.ceremony_time }}
+      <p><strong>{{ i18n "ceremony" }}:</strong> {{ . }}</p>
+    {{ end }}
+    {{ with .Params.event.reception_time }}
+      <p><strong>{{ i18n "reception" }}:</strong> {{ . }}</p>
+    {{ end }}
+    {{ with .Params.event.venue }}
+      <p><strong>{{ i18n "location" }}:</strong> {{ . }}</p>
+    {{ end }}
+  </div>
+
+  <!-- Map -->
+  {{ with .Params.event.map_embed }}
+    <div class="section map">
+      <h2>📍 {{ i18n "location" }}</h2>
+      {{ . | safeHTML }}
+    </div>
+  {{ end }}
+
+  <!-- RSVP -->
+  <div class="section rsvp">
+    <h2>📝 {{ i18n "rsvp_title" }}</h2>
+    {{ with .Params.rsvp.deadline }}
+      <p>{{ i18n "rsvp_deadline" }} <strong>{{ . }}</strong>.</p>
+    {{ end }}
+    {{ with .Params.rsvp.email }}
+      <p>{{ i18n "rsvp_email" }}: <a href="mailto:{{ . }}">{{ . }}</a></p>
+    {{ end }}
+    {{ with .Params.rsvp.form }}
+      <p><a href="{{ . }}" target="_blank">{{ i18n "rsvp_form" }}</a></p>
+    {{ end }}
+  </div>
+
+  <!-- Extra Info -->
+  {{ with .Params.details }}
+    <div class="section">
+      <h2>ℹ️ {{ i18n "details_title" }}</h2>
+      <p>{{ . }}</p>
+    </div>
+  {{ end }}
+
+  <!-- Footer -->
+  <div class="footer">
+    <p>{{ i18n "footer_message" }}</p>
+  </div>
+
+</div>
+
+<script>
+  var countDownDate = new Date("{{ .Params.event.date }} {{ .Params.event.ceremony_time }}").getTime();
+
+  var x = setInterval(function() {
+    var now = new Date().getTime();
+    var distance = countDownDate - now;
+
+    var days = Math.floor(distance / (1000 * 60 * 60 * 24));
+    var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
+    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 ";
+
+    if (distance < 0) {
+      clearInterval(x);
+      document.getElementById("timer").innerHTML = "{{ i18n "big_day" }}";
+    }
+  }, 1000);
+</script>
+
+{{ end }}