Browse Source

various look-and-feel improvements

master
Trent Larson 3 weeks ago
parent
commit
63bd38766a
  1. 2
      package.json
  2. 6
      src/main.ts
  3. 5
      src/views/ClaimView.vue
  4. 7
      src/views/ConfirmGiftView.vue
  5. 2
      src/views/DIDView.vue
  6. 12
      src/views/DiscoverView.vue
  7. 61
      src/views/HomeView.vue
  8. 8
      src/views/SearchAreaView.vue

2
package.json

@ -1,6 +1,6 @@
{
"name": "TimeSafari",
"version": "0.3.31",
"version": "0.3.31-beta",
"scripts": {
"dev": "vite",
"serve": "vite preview",

6
src/main.ts

@ -40,9 +40,11 @@ import {
faEllipsis,
faEllipsisVertical,
faEnvelopeOpenText,
faEraser,
faEye,
faEyeSlash,
faFileLines,
faFilter,
faFloppyDisk,
faFolderOpen,
faForward,
@ -55,6 +57,7 @@ import {
faHouseChimney,
faImagePortrait,
faLeftRight,
faLightbulb,
faLocationDot,
faLongArrowAltLeft,
faLongArrowAltRight,
@ -111,9 +114,11 @@ library.add(
faEllipsis,
faEllipsisVertical,
faEnvelopeOpenText,
faEraser,
faEye,
faEyeSlash,
faFileLines,
faFilter,
faFloppyDisk,
faFolderOpen,
faForward,
@ -126,6 +131,7 @@ library.add(
faHouseChimney,
faImagePortrait,
faLeftRight,
faLightbulb,
faLocationDot,
faLongArrowAltLeft,
faLongArrowAltRight,

5
src/views/ClaimView.vue

@ -317,6 +317,7 @@
</div>
</div>
<!-- Note that a similar section is found in ConfirmGiftView.vue -->
<div>
<h2 class="font-bold uppercase text-xl mt-8 mb-2">
{{ serverUtil.containsHiddenDid(veriClaim) ? "Visible " : "" }}Details
@ -344,7 +345,7 @@
If you'd like to ask any of your contacts to take a look and see if
their contacts can see more details,
<a
@click="copyToClipboard('This page location', windowLocation)"
@click="copyToClipboard('A link to this page', windowLocation)"
class="text-blue-500"
>share this page with them</a
>
@ -365,7 +366,7 @@
<span v-else>
If you'd like an introduction,
<a
@click="copyToClipboard('Location', windowLocation)"
@click="copyToClipboard('A link to this page', windowLocation)"
class="text-blue-500"
>share this page with them and ask if they'll tell you more about
about the participants.</a

7
src/views/ConfirmGiftView.vue

@ -25,7 +25,7 @@
>
Do you agree?
</span>
<span v-else> Details </span>
<span v-else> Confirmation Details </span>
</h1>
</div>
@ -257,10 +257,11 @@
count as confirming it.
</div>
<div v-else-if="serverUtil.containsHiddenDid(veriClaim.claim)">
You cannot confirm this because it contains hidden identifiers.
You cannot confirm this because some people are hidden.
</div>
</div>
<!-- Note that a similar section is found in ClaimView.vue -->
<h2
class="font-bold uppercase text-xl text-blue-500 mt-8 mb-2 cursor-pointer"
@click="showDetails = !showDetails"
@ -842,7 +843,7 @@ export default class ClaimView extends Vue {
group: "alert",
type: "info",
title: "Cannot Confirm",
text: "You cannot confirm this because it contains hidden identifiers.",
text: "You cannot confirm this because some people are hidden.",
},
3000,
);

2
src/views/DIDView.vue

@ -200,7 +200,7 @@
</div>
<!-- Results List -->
<div v-if="claims.length > 0" class="mt-4">
<div class="text-l font-bold text-center">Claims That Involve Them</div>
<div class="text-l font-bold text-center">Claims That Involve {{ isMyDid ? "You" : "Them" }}</div>
</div>
<InfiniteScroll @reached-bottom="loadMoreData">
<ul>

12
src/views/DiscoverView.vue

@ -78,11 +78,12 @@
</div>
<div v-if="isLocalActive">
<div>
<div class="text-center">
<button
class="ml-2 mt-2 px-4 py-2 rounded-md bg-blue-200 text-blue-500"
@click="$router.push({ name: 'search-area' })"
>
<fa icon="location-dot" class="fa-fw" />
Select a {{ searchBox ? "Different" : "" }} Location for Nearby Search
</button>
</div>
@ -97,8 +98,13 @@
</div>
<div v-else-if="projects.length === 0" class="text-center mt-8">
<p class="text-lg text-slate-500">
No projects were found with that search.
<span v-if="isLocalActive">Try looking Anywhere.</span>
<span v-if="isLocalActive">
<span v-if="searchBox">
None found in the selected area.
</span>
<!-- Otherwise there's no search area selected so we'll just leave the search box for them to click. -->
</span>
<span v-else>No projects were found with that search.</span>
</p>
</div>

61
src/views/HomeView.vue

@ -112,16 +112,16 @@
<!-- !isCreatingIdentifier && isRegistered -->
<!-- show the actions for recognizing a give -->
<div class="flex justify-between">
<h2 class="text-xl font-bold">Record Something Given By:</h2>
<div class="flex justify-end">
<button
@click="openGiftedPrompts()"
class="block text-center text-md bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-4 py-2 rounded-md"
>
Ideas...
</button>
</div>
<div class="flex">
<h2 class="text-xl font-bold">
What have you seen someone do?
</h2>
<button
@click="openGiftedPrompts()"
class="ml-2 block text-xs text-center bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1 rounded-md"
>
<fa icon="lightbulb" class="fa-fw" />
</button>
</div>
<ul
@ -139,7 +139,7 @@
</h3>
</li>
<li v-if="allContacts.length === 0" class="text-sm">
(Add contacts to see more people worthy of recognition.)
(Add friends to see more people worthy of recognition.)
</li>
<li
v-for="contact in allContacts.slice(0, 6)"
@ -161,9 +161,9 @@
<router-link
v-if="allContacts.length >= 6"
:to="{ name: 'contact-gift' }"
class="block text-center text-md font-bold bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-2 py-3 rounded-md"
class="flex align-bottom text-xs text-blue-500 mt-12"
>
Choose From All Contacts
... or someone else...
</router-link>
</li>
</ul>
@ -177,25 +177,24 @@
<FeedFilters ref="feedFilters" />
<!-- Results List -->
<div class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mt-4 mb-4">
<div class="bg-slate-100 rounded-md px-4 py-3 mt-4 mb-4">
<div class="flex items-center mb-4">
<h2 class="text-xl font-bold">Latest Activity</h2>
<button @click="openFeedFilters()" class="block text-center ml-auto">
<span class="text-sm text-white">
<span
v-if="resultsAreFiltered()"
class="bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] px-3 py-1.5 rounded-md"
>
Filtered
</span>
<span
v-else
class="bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] px-3 py-1.5 rounded-md"
>
Unfiltered
<h2 class="text-xl font-bold">Latest Activity
<button @click="openFeedFilters()">
<span class="text-xs text-white">
<fa
v-if="resultsAreFiltered()"
icon="filter"
class="bg-gradient-to-b from-blue-400 to-blue-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] px-1 py-1.5 rounded-md"
/>
<fa
v-else
icon="filter"
class="bg-gradient-to-b from-slate-400 to-slate-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] px-1 py-1.5 rounded-md"
/>
</span>
</span>
</button>
</button>
</h2>
</div>
<InfiniteScroll @reached-bottom="loadMoreGives">
<ul id="listLatestActivity" class="border-t border-slate-300">
@ -270,7 +269,7 @@
<a @click="onClickLoadClaim(record.jwtId)">
<fa
icon="file-lines"
class="pl-2 text-blue-500 cursor-pointer"
class="pl-2 text-slate-500 cursor-pointer"
/>
</a>
</span>

8
src/views/SearchAreaView.vue

@ -26,7 +26,7 @@
your device to run searches but it is not stored on our servers.
</div>
<div>
<div class="text-center">
<button v-if="!searchBox && !isNewMarkerSet" class="m-4 px-4 py-2">
Click to Choose a Location for Nearby Search
</button>
@ -35,6 +35,7 @@
class="m-4 px-4 py-2 rounded-md bg-blue-200 text-blue-500"
@click="storeSearchBox"
>
<fa icon="save" class="fa-fw" />
Store This Location for Nearby Search
</button>
<button
@ -42,6 +43,7 @@
class="m-4 px-4 py-2 rounded-md bg-blue-200 text-blue-500"
@click="forgetSearchBox"
>
<fa icon="trash-can" class="fa-fw" />
Delete Stored Location
</button>
<button
@ -49,13 +51,15 @@
class="m-4 px-4 py-2 rounded-md bg-blue-200 text-blue-500"
@click="resetLatLong"
>
Reset Marker
<fa icon="rotate" class="fa-fw" />
Reset To Original
</button>
<button
v-if="isNewMarkerSet"
class="m-4 px-4 py-2 rounded-md bg-blue-200 text-blue-500"
@click="isNewMarkerSet = false"
>
<fa icon="eraser" class="fa-fw" />
Erase Marker
</button>
<div v-if="isNewMarkerSet">

Loading…
Cancel
Save