feat: add introduce
parent
521ad7a332
commit
4885b165df
|
@ -0,0 +1,65 @@
|
|||
<script setup lang="ts">
|
||||
interface Team {
|
||||
github: string
|
||||
display: string
|
||||
twitter: string
|
||||
mastodon: string
|
||||
}
|
||||
|
||||
const teams: Team[] = [
|
||||
{
|
||||
github: 'antfu',
|
||||
display: 'Anthony Fu',
|
||||
twitter: 'antfu7',
|
||||
mastodon: 'antfu@mas.to',
|
||||
},
|
||||
{
|
||||
github: 'patak-dev',
|
||||
display: 'Patak',
|
||||
twitter: 'patak_dev',
|
||||
mastodon: 'patak@mas.to',
|
||||
},
|
||||
{
|
||||
github: 'danielroe',
|
||||
display: 'Daniel Roe',
|
||||
twitter: 'danielcroe',
|
||||
mastodon: 'daniel@daniel.roe',
|
||||
},
|
||||
{
|
||||
github: 'sxzz',
|
||||
display: 'sxzz',
|
||||
twitter: 'sxzz',
|
||||
mastodon: 'sxzz@mas.to',
|
||||
},
|
||||
].sort(() => Math.random() - 0.5)
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div p8 flex="~ col gap-4">
|
||||
<img src="/logo.svg" w-20 h-20 mxa alt="logo">
|
||||
<h1 mxa text-4xl mb4>
|
||||
Elk is in Preview!
|
||||
</h1>
|
||||
<p>
|
||||
Thank you for interested in trying out Elk, our working in progress generic Mastodon client!
|
||||
</p>
|
||||
<p>
|
||||
<b text-primary>You shall expect to see some features missing or some bugs here and there.</b>
|
||||
We are working hard to make develop and improve it.
|
||||
And we will soon invite you to join the force once we make it open source soon!
|
||||
</p>
|
||||
<p>
|
||||
Before that, to help boosting out development, you can sponsor our team members with the links below.
|
||||
</p>
|
||||
<p flex="~ gap-2" mxa>
|
||||
<template v-for="team of teams" :key="team.github">
|
||||
<a :href="`https://github.com/sponsors/${team.github}`" target="_blank">
|
||||
<img :src="`https://github.com/${team.github}.png`" :alt="team.display" rounded-full w-15 h-15>
|
||||
</a>
|
||||
</template>
|
||||
</p>
|
||||
<p italic text-2xl>
|
||||
<span text-lg font-script>The Elk Team</span>
|
||||
</p>
|
||||
</div>
|
||||
</template>
|
|
@ -1,5 +1,5 @@
|
|||
<script setup lang="ts">
|
||||
import { isSigninDialogOpen, isUserSwitcherOpen } from '~/composables/dialog'
|
||||
import { isPreviewHelpOpen, isSigninDialogOpen, isUserSwitcherOpen } from '~/composables/dialog'
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
@ -9,4 +9,7 @@ import { isSigninDialogOpen, isUserSwitcherOpen } from '~/composables/dialog'
|
|||
<ModalDialog v-model="isSigninDialogOpen">
|
||||
<UserSignIn m6 />
|
||||
</ModalDialog>
|
||||
<ModalDialog v-model="isPreviewHelpOpen">
|
||||
<HelpPreview />
|
||||
</ModalDialog>
|
||||
</template>
|
||||
|
|
|
@ -8,6 +8,7 @@ const buildTimeAgo = useTimeAgo(buildTime)
|
|||
<template>
|
||||
<div p4 text-sm op25 flex="~ col">
|
||||
<button i-ri-sun-line dark:i-ri-moon-line text-lg mb4 @click="toggleDark()" />
|
||||
<a cursor-pointer hover:underline @click="openPreviewHelp">Show intro</a>
|
||||
<div>A Mastodon client made with 💛</div>
|
||||
<div>Built <span :title="buildTime">{{ buildTimeAgo }}</span> · <a href="https://github.com/antfu/elk" target="_blank">GitHub</a></div>
|
||||
</div>
|
||||
|
|
|
@ -1,5 +1,10 @@
|
|||
import { STORAGE_KEY_FIRST_VISIT } from '~/constants'
|
||||
|
||||
export const isFirstVisit = useLocalStorage(STORAGE_KEY_FIRST_VISIT, true)
|
||||
|
||||
export const isUserSwitcherOpen = ref(false)
|
||||
export const isSigninDialogOpen = ref(false)
|
||||
export const isPreviewHelpOpen = ref(isFirstVisit.value)
|
||||
|
||||
export function openUserSwitcher() {
|
||||
isUserSwitcherOpen.value = true
|
||||
|
@ -9,3 +14,13 @@ export function openSigninDialog() {
|
|||
isSigninDialogOpen.value = true
|
||||
isUserSwitcherOpen.value = false
|
||||
}
|
||||
|
||||
export function openPreviewHelp() {
|
||||
isPreviewHelpOpen.value = true
|
||||
}
|
||||
|
||||
if (isPreviewHelpOpen.value) {
|
||||
watch(isPreviewHelpOpen, () => {
|
||||
isFirstVisit.value = false
|
||||
})
|
||||
}
|
||||
|
|
|
@ -10,4 +10,5 @@ export const STORAGE_KEY_DRAFTS = 'elk-drafts'
|
|||
export const STORAGE_KEY_USERS = 'elk-users'
|
||||
export const STORAGE_KEY_CURRENT_USER = 'elk-current-user'
|
||||
export const STORAGE_KEY_NOTIFY_TAB = 'elk-notify-tab'
|
||||
export const STORAGE_KEY_FIRST_VISIT = 'elk-first-visit'
|
||||
|
||||
|
|
|
@ -37,6 +37,7 @@ export default defineConfig({
|
|||
sans: 'DM Sans',
|
||||
serif: 'DM Serif Display',
|
||||
mono: 'DM Mono',
|
||||
script: 'Homemade Apple',
|
||||
},
|
||||
}),
|
||||
],
|
||||
|
|
Loading…
Reference in New Issue