46 lines
2.2 KiB
HTML
46 lines
2.2 KiB
HTML
{{define "content"}}
|
|
<div class="mx-auto max-w-2xl">
|
|
<div class="overflow-hidden rounded-xl border border-stone-200 bg-white shadow-sm">
|
|
<div class="bg-stone-900 px-6 py-5 text-white">
|
|
<h1 class="text-2xl font-bold">🎉 Your {{if .Data.ItemType}}{{.Data.ItemType}}{{else}}item{{end}} was found!</h1>
|
|
<p class="mt-1 text-sm text-stone-300">It was reported at {{.Data.ScannedAt}}. Here's where it was seen:</p>
|
|
</div>
|
|
<div class="p-6">
|
|
<div class="overflow-hidden rounded-lg border border-stone-200">
|
|
<iframe
|
|
title="Reported location"
|
|
src="https://www.google.com/maps?q={{.Data.Lat}},{{.Data.Lng}}&output=embed"
|
|
class="h-72 w-full"
|
|
loading="lazy"
|
|
referrerpolicy="no-referrer-when-downgrade"></iframe>
|
|
</div>
|
|
|
|
{{if .Data.FinderPhone}}
|
|
<div class="mt-4 flex items-center justify-between rounded border border-green-200 bg-green-50 px-4 py-3">
|
|
<span class="text-sm font-medium">The finder left their number</span>
|
|
<a href="tel:{{.Data.FinderPhone}}" class="font-semibold text-green-700 hover:underline">{{.Data.FinderPhone}}</a>
|
|
</div>
|
|
{{end}}
|
|
|
|
{{if or .Data.PhotoURL .Data.Name .Data.Address .Data.Phone}}
|
|
<div class="mt-4 rounded-xl border border-stone-200 p-4">
|
|
<h2 class="font-bold">About your {{if .Data.ItemType}}{{.Data.ItemType}}{{else}}item{{end}}</h2>
|
|
<div class="mt-2 flex gap-4">
|
|
{{if .Data.PhotoURL}}<img src="{{.Data.PhotoURL}}" alt="Your item" class="h-28 w-28 rounded-lg object-cover">{{end}}
|
|
<div class="text-sm">
|
|
{{if .Data.Name}}<p class="font-medium">{{.Data.Name}}</p>{{end}}
|
|
{{if .Data.Address}}<p class="text-stone-600">{{.Data.Address}}</p>{{end}}
|
|
{{if .Data.Phone}}<p class="text-stone-600">Contact: <a href="tel:{{.Data.Phone}}" class="text-amber-600 hover:underline">{{.Data.Phone}}</a></p>{{end}}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{end}}
|
|
|
|
<p class="mt-4 text-center text-sm">
|
|
<a href="/t/{{.Data.TagCode}}" class="text-amber-600 hover:underline">View this tag's return details</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{{end}}
|