tweaks to feed UI #117
@@ -407,7 +407,7 @@ export function contactForDid(
|
|||||||
* @param contact
|
* @param contact
|
||||||
* @param allMyDids
|
* @param allMyDids
|
||||||
* @return { known: boolean, displayName: string, profileImageUrl?: string }
|
* @return { known: boolean, displayName: string, profileImageUrl?: string }
|
||||||
* where 'known' is true if the display name is some easily-recogizable name, false if it's a generic name like "Someone Unnamed"
|
* where 'known' is true if they are in the contacts
|
||||||
*/
|
*/
|
||||||
export function didInfoForContact(
|
export function didInfoForContact(
|
||||||
did: string | undefined,
|
did: string | undefined,
|
||||||
@@ -422,7 +422,7 @@ export function didInfoForContact(
|
|||||||
} else if (contact) {
|
} else if (contact) {
|
||||||
return {
|
return {
|
||||||
displayName: contact.name || "Contact With No Name",
|
displayName: contact.name || "Contact With No Name",
|
||||||
known: !!contact.name,
|
known: !!contact,
|
||||||
profileImageUrl: contact.profileImageUrl,
|
profileImageUrl: contact.profileImageUrl,
|
||||||
};
|
};
|
||||||
} else {
|
} else {
|
||||||
|
|||||||
@@ -109,7 +109,7 @@
|
|||||||
}"
|
}"
|
||||||
title="See more about this DID"
|
title="See more about this DID"
|
||||||
>
|
>
|
||||||
<fa icon="circle-info" class="text-blue-500 ml-6" />
|
<fa icon="circle-info" class="text-blue-500 ml-4" />
|
||||||
</router-link>
|
</router-link>
|
||||||
</h2>
|
</h2>
|
||||||
<div class="text-sm truncate">
|
<div class="text-sm truncate">
|
||||||
|
|||||||
@@ -37,7 +37,7 @@
|
|||||||
isRemoteActive = false;
|
isRemoteActive = false;
|
||||||
searchLocal();
|
searchLocal();
|
||||||
"
|
"
|
||||||
v-bind:class="computedLocalTabClassNames()"
|
v-bind:class="computedLocalTabStyleClassNames()"
|
||||||
>
|
>
|
||||||
Nearby
|
Nearby
|
||||||
<span
|
<span
|
||||||
@@ -57,7 +57,7 @@
|
|||||||
isLocalActive = false;
|
isLocalActive = false;
|
||||||
searchAll();
|
searchAll();
|
||||||
"
|
"
|
||||||
v-bind:class="computedRemoteTabClassNames()"
|
v-bind:class="computedRemoteTabStyleClassNames()"
|
||||||
>
|
>
|
||||||
Anywhere
|
Anywhere
|
||||||
<span
|
<span
|
||||||
@@ -422,7 +422,7 @@ export default class DiscoverView extends Vue {
|
|||||||
this.$router.push(route);
|
this.$router.push(route);
|
||||||
}
|
}
|
||||||
|
|
||||||
public computedLocalTabClassNames() {
|
public computedLocalTabStyleClassNames() {
|
||||||
return {
|
return {
|
||||||
"inline-block": true,
|
"inline-block": true,
|
||||||
"py-3": true,
|
"py-3": true,
|
||||||
@@ -440,7 +440,7 @@ export default class DiscoverView extends Vue {
|
|||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
|
||||||
public computedRemoteTabClassNames() {
|
public computedRemoteTabStyleClassNames() {
|
||||||
return {
|
return {
|
||||||
"inline-block": true,
|
"inline-block": true,
|
||||||
"py-3": true,
|
"py-3": true,
|
||||||
|
|||||||
@@ -64,19 +64,21 @@
|
|||||||
:to="{ name: 'quick-action-bvc' }"
|
:to="{ name: 'quick-action-bvc' }"
|
||||||
class="block text-center text-md font-bold bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white mt-2 px-2 py-3 rounded-md"
|
class="block text-center text-md font-bold bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white mt-2 px-2 py-3 rounded-md"
|
||||||
>
|
>
|
||||||
Bountiful Voluntaryist Community Actions</router-link
|
Bountiful Voluntaryist Community Actions
|
||||||
>
|
</router-link>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- show the actions for recognizing a give -->
|
|
||||||
<div class="mb-8">
|
<div class="mb-8">
|
||||||
<div v-if="isCreatingIdentifier">
|
<div v-if="isCreatingIdentifier">
|
||||||
<p class="text-slate-500 text-center italic mt-4 mb-4">
|
<p class="text-slate-500 text-center italic mt-4 mb-4">
|
||||||
<fa icon="spinner" class="fa-spin-pulse" /> Loading…
|
<fa icon="spinner" class="fa-spin-pulse" /> Loading…
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div v-else>
|
||||||
|
<!-- !isCreatingIdentifier -->
|
||||||
<div
|
<div
|
||||||
v-if="!activeDid && !isCreatingIdentifier"
|
v-if="!activeDid"
|
||||||
class="bg-amber-200 rounded-md overflow-hidden text-center px-4 py-3 mb-4"
|
class="bg-amber-200 rounded-md overflow-hidden text-center px-4 py-3 mb-4"
|
||||||
>
|
>
|
||||||
<p class="text-lg mb-3">
|
<p class="text-lg mb-3">
|
||||||
@@ -87,15 +89,17 @@
|
|||||||
:to="{ name: 'start' }"
|
:to="{ name: 'start' }"
|
||||||
class="block text-center text-md font-bold bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white mt-2 px-2 py-3 rounded-md"
|
class="block text-center text-md font-bold bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white mt-2 px-2 py-3 rounded-md"
|
||||||
>
|
>
|
||||||
Create An Identifier</router-link
|
Create An Identifier
|
||||||
>
|
</router-link>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div
|
<div
|
||||||
v-else-if="!isRegistered"
|
v-else-if="!isRegistered"
|
||||||
class="bg-amber-200 rounded-md overflow-hidden text-center px-4 py-3 mb-4"
|
class="bg-amber-200 rounded-md overflow-hidden text-center px-4 py-3 mb-4"
|
||||||
>
|
>
|
||||||
Someone must register you before you can give or offer.
|
<!-- activeDid && !isRegistered -->
|
||||||
|
Someone must register you before you can give kudos or make offers or
|
||||||
|
create projects... basically before doing anything.
|
||||||
<router-link
|
<router-link
|
||||||
:to="{ name: 'contact-qr' }"
|
:to="{ name: 'contact-qr' }"
|
||||||
class="block text-center text-md font-bold bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white mt-2 px-2 py-3 rounded-md"
|
class="block text-center text-md font-bold bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white mt-2 px-2 py-3 rounded-md"
|
||||||
@@ -106,6 +110,8 @@
|
|||||||
|
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<!-- activeDid && isRegistered -->
|
<!-- activeDid && isRegistered -->
|
||||||
|
|
||||||
|
<!-- show the actions for recognizing a give -->
|
||||||
<div class="mb-4">
|
<div class="mb-4">
|
||||||
<h2 class="text-xl font-bold">Record Something Given By:</h2>
|
<h2 class="text-xl font-bold">Record Something Given By:</h2>
|
||||||
</div>
|
</div>
|
||||||
@@ -159,6 +165,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
<GiftedDialog ref="customDialog" />
|
<GiftedDialog ref="customDialog" />
|
||||||
<GiftedPrompts ref="giftedPrompts" />
|
<GiftedPrompts ref="giftedPrompts" />
|
||||||
@@ -200,14 +207,22 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="grid grid-cols-12">
|
<div class="grid grid-cols-12">
|
||||||
<span class="col-span-1 justify-self-start">
|
<span class="pt-1 col-span-1 justify-self-start">
|
||||||
<span>
|
<span>
|
||||||
<fa
|
<fa
|
||||||
v-if="record.giver.known || record.receiver.known"
|
|
||||||
icon="circle-user"
|
icon="circle-user"
|
||||||
class="pt-1 text-slate-500"
|
:class="
|
||||||
|
computeKnownPersonIconStyleClassNames(
|
||||||
|
record.giver.known || record.receiver.known,
|
||||||
|
)
|
||||||
|
"
|
||||||
|
@click="toastUser('This involves your contacts.')"
|
||||||
|
/>
|
||||||
|
<fa
|
||||||
|
icon="gift"
|
||||||
|
class="pl-3 text-slate-500"
|
||||||
|
@click="toastUser('This is a gift.')"
|
||||||
/>
|
/>
|
||||||
<fa v-else icon="gift" class="pt-1 pl-3 text-slate-500" />
|
|
||||||
</span>
|
</span>
|
||||||
</span>
|
</span>
|
||||||
<span class="col-span-10 justify-self-stretch">
|
<span class="col-span-10 justify-self-stretch">
|
||||||
@@ -758,5 +773,21 @@ export default class HomeView extends Vue {
|
|||||||
openFeedFilters() {
|
openFeedFilters() {
|
||||||
(this.$refs.feedFilters as FeedFilters).open(this.reloadFeedOnChange);
|
(this.$refs.feedFilters as FeedFilters).open(this.reloadFeedOnChange);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
toastUser(message) {
|
||||||
|
this.$notify(
|
||||||
|
{
|
||||||
|
group: "alert",
|
||||||
|
type: "toast",
|
||||||
|
title: "FYI",
|
||||||
|
text: message,
|
||||||
|
},
|
||||||
|
2000,
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
computeKnownPersonIconStyleClassNames(known: boolean) {
|
||||||
|
return known ? "text-slate-500" : "text-slate-100";
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
Reference in New Issue
Block a user