Remove form tags #44
@@ -143,25 +143,23 @@
|
||||
|
||||
<!-- QR code popup -->
|
||||
<dialog id="dlgQR" class="backdrop:bg-black/75 rounded-md">
|
||||
<form method="dialog">
|
||||
<div class="text-slate-500 text-center">
|
||||
<b>ID:</b> <code>did:peer:kl45kj41lk451kl3</code>
|
||||
</div>
|
||||
<img src="/img/sample-qr-code.png" class="w-full mb-3" />
|
||||
<div class="text-slate-500 text-center">
|
||||
<b>ID:</b> <code>did:peer:kl45kj41lk451kl3</code>
|
||||
</div>
|
||||
<img src="/img/sample-qr-code.png" class="w-full mb-3" />
|
||||
|
||||
<button
|
||||
value="cancel"
|
||||
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md mb-2"
|
||||
>
|
||||
Copy to Clipboard
|
||||
</button>
|
||||
<button
|
||||
value="cancel"
|
||||
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md"
|
||||
>
|
||||
Close
|
||||
</button>
|
||||
</form>
|
||||
<button
|
||||
value="cancel"
|
||||
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md mb-2"
|
||||
>
|
||||
Copy to Clipboard
|
||||
</button>
|
||||
<button
|
||||
value="cancel"
|
||||
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md"
|
||||
>
|
||||
Close
|
||||
</button>
|
||||
</dialog>
|
||||
|
||||
<h3
|
||||
|
||||
@@ -15,35 +15,33 @@
|
||||
</h1>
|
||||
</div>
|
||||
|
||||
<form>
|
||||
<p class="text-center text-xl mb-4 font-light">
|
||||
Would you like to add <i>Firstname</i> to your network?
|
||||
</p>
|
||||
<p class="text-center text-xl mb-4 font-light">
|
||||
Would you like to add <i>Firstname</i> to your network?
|
||||
</p>
|
||||
|
||||
<!-- Account Details -->
|
||||
<div class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4">
|
||||
<h2 class="text-xl font-semibold mb-2">Firstname Lastname</h2>
|
||||
<!-- Account Details -->
|
||||
<div class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4">
|
||||
<h2 class="text-xl font-semibold mb-2">Firstname Lastname</h2>
|
||||
|
||||
<div class="text-slate-500 text-sm font-bold">ID</div>
|
||||
<div class="text-sm text-slate-500 mb-1">
|
||||
<span><code>did:peer:kl45kj41lk451kl3</code></span>
|
||||
</div>
|
||||
<div class="text-slate-500 text-sm font-bold">ID</div>
|
||||
<div class="text-sm text-slate-500 mb-1">
|
||||
<span><code>did:peer:kl45kj41lk451kl3</code></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<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="Add 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>
|
||||
<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="Add 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>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -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>
|
||||
<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="Name (optional)"
|
||||
class="block w-full rounded border border-slate-400 mb-2 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"
|
||||
/>
|
||||
<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="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>
|
||||
|
||||
|
||||
@@ -13,38 +13,37 @@
|
||||
[New/Edit] Identity
|
||||
</h1>
|
||||
</div>
|
||||
<form>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="First Name"
|
||||
class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
|
||||
v-model="firstName"
|
||||
/>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Last Name"
|
||||
class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
|
||||
v-model="lastName"
|
||||
/>
|
||||
|
||||
<div class="mt-8">
|
||||
<button
|
||||
type="button"
|
||||
class="block w-full text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-2"
|
||||
@click="onClickSaveChanges()"
|
||||
>
|
||||
Save Changes
|
||||
</button>
|
||||
<!-- SHOW ME instead while processing saving changes -->
|
||||
<button
|
||||
type="button"
|
||||
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md"
|
||||
@click="onClickCancel()"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="First Name"
|
||||
class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
|
||||
v-model="firstName"
|
||||
/>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Last Name"
|
||||
class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
|
||||
v-model="lastName"
|
||||
/>
|
||||
|
||||
<div class="mt-8">
|
||||
<button
|
||||
type="button"
|
||||
class="block w-full text-center text-lg font-bold uppercase bg-blue-600 text-white px-2 py-3 rounded-md mb-2"
|
||||
@click="onClickSaveChanges()"
|
||||
>
|
||||
Save Changes
|
||||
</button>
|
||||
<!-- SHOW ME instead while processing saving changes -->
|
||||
<button
|
||||
type="button"
|
||||
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md"
|
||||
@click="onClickCancel()"
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -16,47 +16,44 @@
|
||||
</div>
|
||||
|
||||
<!-- Project Details -->
|
||||
<form>
|
||||
<select
|
||||
class="block w-full rounded border border-slate-400 mb-4 px-3 py-2"
|
||||
|
||||
<select class="block w-full rounded border border-slate-400 mb-4 px-3 py-2">
|
||||
<option disabled>Choose a commitment type…</option>
|
||||
<option selected>Time</option>
|
||||
<option>Cryptocurrency</option>
|
||||
<option>Money</option>
|
||||
</select>
|
||||
|
||||
<!-- Time amount -->
|
||||
<div class="mb-4 flex items-stretch">
|
||||
<input
|
||||
type="number"
|
||||
placeholder="0.0"
|
||||
class="block w-full rounded-l border border-slate-400 px-3 py-2"
|
||||
/>
|
||||
<span
|
||||
class="px-4 py-2 rounded-r bg-slate-200 border border-l-0 border-slate-400"
|
||||
>hours</span
|
||||
>
|
||||
<option disabled>Choose a commitment type…</option>
|
||||
<option selected>Time</option>
|
||||
<option>Cryptocurrency</option>
|
||||
<option>Money</option>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Time amount -->
|
||||
<div class="mb-4 flex items-stretch">
|
||||
<input
|
||||
type="number"
|
||||
placeholder="0.0"
|
||||
class="block w-full rounded-l border border-slate-400 px-3 py-2"
|
||||
/>
|
||||
<span
|
||||
class="px-4 py-2 rounded-r bg-slate-200 border border-l-0 border-slate-400"
|
||||
>hours</span
|
||||
>
|
||||
</div>
|
||||
<!-- Crypto amount -->
|
||||
|
||||
<!-- Crypto amount -->
|
||||
<!-- Money amount -->
|
||||
|
||||
<!-- Money amount -->
|
||||
|
||||
<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="Commit"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md"
|
||||
>
|
||||
Maybe Later
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
<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="Commit"
|
||||
/>
|
||||
<button
|
||||
type="button"
|
||||
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md"
|
||||
>
|
||||
Maybe Later
|
||||
</button>
|
||||
</div>
|
||||
</section>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -7,18 +7,17 @@
|
||||
</h1>
|
||||
|
||||
<!-- Quick Search -->
|
||||
<form id="QuickSearch" class="mb-4 flex">
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Search…"
|
||||
class="block w-full rounded-l border border-r-0 border-slate-400 px-3 py-2"
|
||||
/>
|
||||
<button
|
||||
class="px-4 rounded-r bg-slate-200 border border-l-0 border-slate-400"
|
||||
>
|
||||
<fa icon="magnifying-glass" class="fa-fw"></fa>
|
||||
</button>
|
||||
</form>
|
||||
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Search…"
|
||||
class="block w-full rounded-l border border-r-0 border-slate-400 px-3 py-2"
|
||||
/>
|
||||
<button
|
||||
class="px-4 rounded-r bg-slate-200 border border-l-0 border-slate-400"
|
||||
>
|
||||
<fa icon="magnifying-glass" class="fa-fw"></fa>
|
||||
</button>
|
||||
|
||||
<!-- New Project -->
|
||||
<button
|
||||
|
||||
Reference in New Issue
Block a user