|
|
@ -14,75 +14,69 @@ |
|
|
|
</h1> |
|
|
|
</div> |
|
|
|
|
|
|
|
<form> |
|
|
|
<h3 class="text-sm uppercase font-semibold mb-2">Scan a QR Code…</h3> |
|
|
|
<div class="bg-black rounded overflow-hidden relative mb-4"> |
|
|
|
<img src="https://picsum.photos/400/400?random=1" class="w-full" /> |
|
|
|
<h3 class="text-sm uppercase font-semibold mb-2">Scan a QR Code…</h3> |
|
|
|
<div class="bg-black rounded overflow-hidden relative mb-4"> |
|
|
|
<img src="https://picsum.photos/400/400?random=1" class="w-full" /> |
|
|
|
|
|
|
|
<!-- Darken overlay --> |
|
|
|
<!-- Top --> |
|
|
|
<div class="absolute top-0 left-0 right-0 bg-black/50 h-1/4"></div> |
|
|
|
<!-- Reft --> |
|
|
|
<div class="absolute top-1/4 bottom-1/4 left-0 bg-black/50 w-1/4"></div> |
|
|
|
<!-- Right --> |
|
|
|
<div |
|
|
|
class="absolute top-1/4 bottom-1/4 right-0 bg-black/50 w-1/4" |
|
|
|
></div> |
|
|
|
<!-- Bottom --> |
|
|
|
<div class="absolute bottom-0 left-0 right-0 bg-black/50 h-1/4"></div> |
|
|
|
<!-- Darken overlay --> |
|
|
|
<!-- Top --> |
|
|
|
<div class="absolute top-0 left-0 right-0 bg-black/50 h-1/4"></div> |
|
|
|
<!-- Reft --> |
|
|
|
<div class="absolute top-1/4 bottom-1/4 left-0 bg-black/50 w-1/4"></div> |
|
|
|
<!-- Right --> |
|
|
|
<div class="absolute top-1/4 bottom-1/4 right-0 bg-black/50 w-1/4"></div> |
|
|
|
<!-- Bottom --> |
|
|
|
<div class="absolute bottom-0 left-0 right-0 bg-black/50 h-1/4"></div> |
|
|
|
|
|
|
|
<!-- Reticle overlay --> |
|
|
|
<!-- Top-left --> |
|
|
|
<div |
|
|
|
class="absolute top-1/4 left-1/4 h-6 w-6 border-white border-t-4 border-l-4 drop-shadow" |
|
|
|
></div> |
|
|
|
<!-- Top-right --> |
|
|
|
<div |
|
|
|
class="absolute top-1/4 right-1/4 h-6 w-6 border-white border-t-4 border-r-4 drop-shadow" |
|
|
|
></div> |
|
|
|
<!-- Bottom-left --> |
|
|
|
<div |
|
|
|
class="absolute bottom-1/4 left-1/4 h-6 w-6 border-white border-b-4 border-l-4 drop-shadow" |
|
|
|
></div> |
|
|
|
<!-- Bottom-right --> |
|
|
|
<div |
|
|
|
class="absolute bottom-1/4 right-1/4 h-6 w-6 border-white border-b-4 border-r-4 drop-shadow" |
|
|
|
></div> |
|
|
|
</div> |
|
|
|
<!-- Reticle overlay --> |
|
|
|
<!-- Top-left --> |
|
|
|
<div |
|
|
|
class="absolute top-1/4 left-1/4 h-6 w-6 border-white border-t-4 border-l-4 drop-shadow" |
|
|
|
></div> |
|
|
|
<!-- Top-right --> |
|
|
|
<div |
|
|
|
class="absolute top-1/4 right-1/4 h-6 w-6 border-white border-t-4 border-r-4 drop-shadow" |
|
|
|
></div> |
|
|
|
<!-- Bottom-left --> |
|
|
|
<div |
|
|
|
class="absolute bottom-1/4 left-1/4 h-6 w-6 border-white border-b-4 border-l-4 drop-shadow" |
|
|
|
></div> |
|
|
|
<!-- Bottom-right --> |
|
|
|
<div |
|
|
|
class="absolute bottom-1/4 right-1/4 h-6 w-6 border-white border-b-4 border-r-4 drop-shadow" |
|
|
|
></div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<h3 class="text-sm uppercase font-semibold mb-2"> |
|
|
|
…or Enter Contact Data |
|
|
|
</h3> |
|
|
|
<input |
|
|
|
type="text" |
|
|
|
placeholder="Name (optional)" |
|
|
|
class="block w-full rounded border border-slate-400 mb-2 px-3 py-2" |
|
|
|
/> |
|
|
|
<input |
|
|
|
type="text" |
|
|
|
placeholder="ID" |
|
|
|
class="block w-full rounded border border-slate-400 mb-2 px-3 py-2" |
|
|
|
/> |
|
|
|
<h3 class="text-sm uppercase font-semibold mb-2">…or Enter Contact Data</h3> |
|
|
|
<input |
|
|
|
type="text" |
|
|
|
placeholder="Name (optional)" |
|
|
|
class="block w-full rounded border border-slate-400 mb-2 px-3 py-2" |
|
|
|
/> |
|
|
|
<input |
|
|
|
type="text" |
|
|
|
placeholder="ID" |
|
|
|
class="block w-full rounded border border-slate-400 mb-2 px-3 py-2" |
|
|
|
/> |
|
|
|
<input |
|
|
|
type="text" |
|
|
|
placeholder="Public Key (optional)" |
|
|
|
class="block w-full rounded border border-slate-400 mb-4 px-3 py-2" |
|
|
|
/> |
|
|
|
|
|
|
|
<div class="mt-8"> |
|
|
|
<input |
|
|
|
type="text" |
|
|
|
placeholder="Public Key (optional)" |
|
|
|
class="block w-full rounded border border-slate-400 mb-4 px-3 py-2" |
|
|
|
type="submit" |
|
|
|
class="block w-full text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-2" |
|
|
|
value="Look Up Contact" |
|
|
|
/> |
|
|
|
|
|
|
|
<div class="mt-8"> |
|
|
|
<input |
|
|
|
type="submit" |
|
|
|
class="block w-full text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-2" |
|
|
|
value="Look Up Contact" |
|
|
|
/> |
|
|
|
<button |
|
|
|
type="button" |
|
|
|
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md" |
|
|
|
> |
|
|
|
Cancel |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
</form> |
|
|
|
<button |
|
|
|
type="button" |
|
|
|
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md" |
|
|
|
> |
|
|
|
Cancel |
|
|
|
</button> |
|
|
|
</div> |
|
|
|
</section> |
|
|
|
</template> |
|
|
|
|
|
|
|