Compacted Quick Action section

This commit is contained in:
Jose Olarte III
2023-07-12 22:52:58 +08:00
parent 78b98bab5e
commit 098c6c0fa0

View File

@@ -7,23 +7,33 @@
</h1> </h1>
<div class="mb-8"> <div class="mb-8">
<h1 class="text-2xl">Quick Action</h1> <h2 class="text-xl font-bold">Quick Action</h2>
<p>Choose a contact to whom to show appreciation:</p> <p class="mb-4">Show appreciation to a contact:</p>
<!-- similar contact selection code is in multiple places -->
<div class="px-4"> <ul class="grid grid-cols-4 gap-x-3 gap-y-5 text-center mb-5">
<button <li @click="openDialog()">
<div class="mb-1">
<fa
icon="question-circle"
class="fa-fw fa-xl text-slate-400"
></fa>
</div>
<h3 class="text-xs font-medium italic text-ellipsis whitespace-nowrap overflow-hidden">Anonymous</h3>
</li>
<li
v-for="contact in allContacts" v-for="contact in allContacts"
:key="contact.did" :key="contact.did"
@click="openDialog(contact)" @click="openDialog(contact)"
class="block w-full text-center text-md uppercase bg-slate-500 text-white px-1.5 py-2 rounded-md mb-2"
> >
{{ contact.name || "(no name)" }} <div class="mb-1">
</button> <fa
<span v-if="allContacts.length > 0">&nbsp;or&nbsp;</span> icon="user"
<button @click="openDialog()" class="text-blue-500"> class="fa-fw fa-xl text-slate-400"
someone not specified ></fa>
</button>
</div> </div>
<h3 class="text-xs font-medium text-ellipsis whitespace-nowrap overflow-hidden">{{ contact.name || "(no name)" }}</h3>
</li>
</ul>
</div> </div>
<GiftedDialog <GiftedDialog