30 lines
834 B
Vue
30 lines
834 B
Vue
<template>
|
|
<section class="min-h-screen flex flex-col items-center justify-center bg-blue-50 text-center px-6">
|
|
<div class="max-w-2xl bg-white rounded-2xl shadow-lg p-8 space-y-4">
|
|
<h2 class="text-2xl font-bold text-blue-700 mb-4">📅 Acara Tasyakuran</h2>
|
|
|
|
<p><strong>Hari & Tanggal:</strong> {{ hari_tanggal_acara }}</p>
|
|
<p><strong>Waktu:</strong> {{ waktu }}</p>
|
|
<p><strong>Alamat:</strong> {{ alamat }}</p>
|
|
|
|
<a
|
|
v-if="link_gmaps"
|
|
:href="link_gmaps"
|
|
target="_blank"
|
|
class="inline-block mt-4 text-blue-600 font-semibold underline hover:text-blue-800"
|
|
>
|
|
Lihat di Google Maps
|
|
</a>
|
|
</div>
|
|
</section>
|
|
</template>
|
|
|
|
<script setup>
|
|
defineProps({
|
|
hari_tanggal_acara: String,
|
|
waktu: String,
|
|
alamat: String,
|
|
link_gmaps: String
|
|
})
|
|
</script>
|