Browse Source

enhance (& fix for mobile) styling and verbiage

starred-projects
Trent Larson 11 months ago
parent
commit
2511f18fa7
  1. 11
      README.md
  2. 5
      project.task.yaml
  3. 6
      src/views/ClaimView.vue
  4. 5
      src/views/ContactQRScanShowView.vue
  5. 12
      src/views/ContactsView.vue

11
README.md

@ -90,6 +90,7 @@ To add an icon, add to main.ts and reference with `fa` element and `icon` attrib
- As the new user on the home page, check that they can now record a gift. - As the new user on the home page, check that they can now record a gift.
- On the contacts page, check that they cannot register someone else yet. - On the contacts page, check that they cannot register someone else yet.
- Walk through the functions on each page. - Walk through the functions on each page.
- Test the mobile view.
@ -116,6 +117,16 @@ To add an icon, add to main.ts and reference with `fa` element and `icon` attrib
## Troubleshooting
* A problem with `GET http://localhost:8080/web-push/vapid` means the py-push-server is not running
(and it won't work for a local app, anyway).
* Red errors everywhere with a console message like this:
`Error: An ID is chosen but there are no keys for it so it cannot be used to talk with the service`
... has happened on account switching when the current account was erased (or maybe replaced -- once I had a duplicate and I don't know how).
## Other ## Other

5
project.task.yaml

@ -1,10 +1,7 @@
tasks: tasks:
- record donations vs gives - allow agent to edit a project
- deploy & migrate (prod)
- update docs
- make set-name request yellow - make set-name request yellow
- make the "give" on contact screen work like other give (allowing donation vs current blank) - make the "give" on contact screen work like other give (allowing donation vs current blank)
- create an identifier automatically, with a message that they can import a different one - create an identifier automatically, with a message that they can import a different one

6
src/views/ClaimView.vue

@ -17,7 +17,7 @@
</div> </div>
<!-- Details --> <!-- Details -->
<div class="h-32 bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4"> <div class="bg-slate-100 rounded-md overflow-hidden px-4 py-3 mb-4">
<div class="block flex gap-4 overflow-hidden"> <div class="block flex gap-4 overflow-hidden">
<div class="overflow-hidden"> <div class="overflow-hidden">
<h2 class="text-md font-bold"> <h2 class="text-md font-bold">
@ -44,7 +44,7 @@
</div> </div>
</div> </div>
<div class="h-6 columns-3"> <div class="columns-3">
<button <button
class="col-span-1 bg-blue-600 text-white px-4 py-2 rounded-md" class="col-span-1 bg-blue-600 text-white px-4 py-2 rounded-md"
v-if="userCanConfirm()" v-if="userCanConfirm()"
@ -58,7 +58,7 @@
@click="openGiftDialog()" @click="openGiftDialog()"
class="col-span-1 block w-fit text-center text-md bg-blue-600 text-white px-1.5 py-2 rounded-md" class="col-span-1 block w-fit text-center text-md bg-blue-600 text-white px-1.5 py-2 rounded-md"
> >
Record Some Delivered Affirm Delivery
</button> </button>
</div> </div>
<GiftedDialog <GiftedDialog

5
src/views/ContactQRScanShowView.vue

@ -41,6 +41,9 @@
:dotsOptions="{ type: 'square' }" :dotsOptions="{ type: 'square' }"
class="flex justify-center" class="flex justify-center"
/> />
<span class="flex justify-center">
Click QR to copy your contact URL to your clipboard.
</span>
</div> </div>
<div class="text-center" v-else> <div class="text-center" v-else>
You have no identitifiers yet, so You have no identitifiers yet, so
@ -55,7 +58,7 @@
</div> </div>
<div class="text-center"> <div class="text-center">
<h1 class="text-4xl text-center font-light pt-4">Scan Contact Info</h1> <h1 class="text-4xl text-center font-light pt-6">Scan Contact Info</h1>
<qrcode-stream @detect="onScanDetect" @error="onScanError" /> <qrcode-stream @detect="onScanDetect" @error="onScanError" />
<span> <span>
If you do not see a scanning camera window here, check your camera If you do not see a scanning camera window here, check your camera

12
src/views/ContactsView.vue

@ -28,7 +28,7 @@
</router-link> </router-link>
<input <input
type="text" type="text"
placeholder="DID, Name, Public Key, Next Public Key Hash" placeholder="URL or DID, Name, Public Key, Next Public Key Hash"
class="block w-full rounded-l border border-r-0 border-slate-400 px-3 py-2" class="block w-full rounded-l border border-r-0 border-slate-400 px-3 py-2"
v-model="contactInput" v-model="contactInput"
/> />
@ -73,7 +73,13 @@
}} }}
</button> </button>
<br /> <br />
(Only most recent hours included) (Only most recent hours included. To see more, click
<span
class="text-sm uppercase bg-slate-500 text-white px-2 py-1.5 rounded-md"
>
<fa icon="file-lines" class="fa-fw" />
</span>
)
</div> </div>
</div> </div>
@ -209,7 +215,7 @@
query: { contactDid: contact.did }, query: { contactDid: contact.did },
}" }"
class="text-sm uppercase bg-slate-500 text-white px-2 py-1.5 rounded-md" class="text-sm uppercase bg-slate-500 text-white px-2 py-1.5 rounded-md"
title="See all given activity" title="See more given activity"
> >
<fa icon="file-lines" class="fa-fw" /> <fa icon="file-lines" class="fa-fw" />
</router-link> </router-link>

Loading…
Cancel
Save