You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
115 lines
4.1 KiB
115 lines
4.1 KiB
<template>
|
|
<!-- Don't include nav buttons since this is shown in a different window. -->
|
|
|
|
<!-- CONTENT -->
|
|
<section id="Content" class="p-6 pb-24 max-w-3xl mx-auto">
|
|
<!-- Breadcrumb -->
|
|
<div class="mb-8">
|
|
<!-- Don't include 'back' button since this is shown in a different window. -->
|
|
<!-- Heading -->
|
|
<h1 id="ViewHeading" class="text-4xl text-center font-light pt-4 mb-8">
|
|
Time Safari Onboarding Instructions
|
|
</h1>
|
|
</div>
|
|
|
|
<p>
|
|
To invite someone the easiest way, send them a link that you generate from
|
|
this page:
|
|
<router-link
|
|
:to="{ name: 'invite-one' }"
|
|
class="bg-gradient-to-b from-green-400 to-green-700 shadow-[inset_0_-1px_0_0_rgba(0,0,0,0.5)] text-white px-1.5 py-2 rounded-md"
|
|
>
|
|
<fa icon="envelope-open-text" class="fa-fw text-xl"
|
|
/></router-link>
|
|
</p>
|
|
<p>Then watch that page to see when they accept their invite.</p>
|
|
<p>
|
|
(That page is also reachable from the Contacts <fa icon="users" /> page
|
|
though the invitation <fa icon="envelope-open-text" /> icon.)
|
|
</p>
|
|
|
|
<h1 class="mt-4 font-bold text-xl">Next Steps</h1>
|
|
Although not totally necessary, backups are important to understand.
|
|
|
|
<div class="ml-4">
|
|
<h1 class="font-bold text-xl">Without a backup, you can lose data.</h1>
|
|
<div>
|
|
<p>
|
|
Exporting backups (from the Account <fa icon="circle-user" /> screen)
|
|
is important for the case where they lose their device. This is
|
|
especially true for the Identifier Seed: that is theirs and and theirs
|
|
alone, and currently nobody else can recover it if they lose it. The
|
|
good thing is that anyone can create a new account and simply inform
|
|
their network of their new ID.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
|
|
<h1 class="mt-4 font-bold text-xl">Advanced</h1>
|
|
The following are optional steps for even more functionality.
|
|
|
|
<!-- eslint-disable prettier/prettier -->
|
|
<div class="ml-4">
|
|
|
|
<h1 class="font-bold text-xl">Add Contact & Register</h1>
|
|
<p>
|
|
You share even more information such as your picture and name when
|
|
you share with your QR code at these links: <fa icon="qrcode" />
|
|
</p>
|
|
<p>
|
|
Scanning
|
|
those with your cameras will automatically register people and add them
|
|
to each other's contact lists.
|
|
</p>
|
|
<p>
|
|
The following are more detailed manual steps:
|
|
</p>
|
|
<div>
|
|
<p>
|
|
1) Have them follow their yellow prompts.
|
|
</p>
|
|
<p>
|
|
2) Scan their QR, or have them tap on it to copy their info and send it to you.
|
|
Then you can add them to your Contacts <fa icon="users" />
|
|
</p>
|
|
<p>
|
|
3) You can register them at their info page <fa icon="circle-info" />
|
|
and click on the register button <fa icon="person-circle-question" />
|
|
</p>
|
|
<p>
|
|
4) Add yourself to their Contacts <fa icon="users" />
|
|
</p>
|
|
</div>
|
|
|
|
<h1 class="font-bold text-xl">Install</h1>
|
|
<div>
|
|
<p>
|
|
Have them visit TimeSafari.app in a browser, preferably Chrome or Safari,
|
|
and then look for the "Install" selection which adds this app to their desktop.
|
|
This enables other things, like the ability to "share" a photo from their
|
|
device directly to Time Safari, and it makes notifications more reliable.
|
|
</p>
|
|
</div>
|
|
|
|
<h1 class="font-bold text-xl">Enable Notifications</h1>
|
|
<div>
|
|
<p>
|
|
Enable notifications from the Account page <fa icon="circle-user" />.
|
|
Those notifications might show up on the device depending on your settings.
|
|
For the most reliable habits, set an alarm or do some other ritual to record gratitude every day.
|
|
</p>
|
|
</div>
|
|
|
|
</div>
|
|
<!-- eslint enable -->
|
|
</section>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import { Component, Vue } from "vue-facing-decorator";
|
|
|
|
import QuickNav from "../components/QuickNav.vue";
|
|
|
|
@Component({ components: { QuickNav } })
|
|
export default class Help extends Vue {}
|
|
</script>
|
|
|