refactor: signin page
parent
936488f51e
commit
24c573ccf0
|
@ -25,7 +25,7 @@ const createdAt = $computed(() => {
|
||||||
</NuxtLink>
|
</NuxtLink>
|
||||||
</div>
|
</div>
|
||||||
<NuxtLink flex flex-col :to="`/@${account.acct}`">
|
<NuxtLink flex flex-col :to="`/@${account.acct}`">
|
||||||
<CommonRichContent font-bold :content="getDisplayName(account)" :emojis="account.emojis" />
|
<CommonRichContent font-bold text-2xl :content="getDisplayName(account)" :emojis="account.emojis" />
|
||||||
<p op50>
|
<p op50>
|
||||||
@{{ account.acct }}
|
@{{ account.acct }}
|
||||||
</p>
|
</p>
|
||||||
|
|
|
@ -1,10 +1,29 @@
|
||||||
|
<script setup lang="ts">
|
||||||
|
import { DEFAULT_SERVER } from '~/constants'
|
||||||
|
|
||||||
|
const server = ref<string>()
|
||||||
|
|
||||||
|
async function oauth() {
|
||||||
|
const a = document.createElement('a')
|
||||||
|
a.href = `/api/${server.value || DEFAULT_SERVER}/login`
|
||||||
|
a.target = '_blank'
|
||||||
|
a.click()
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div p8 flex="~ col gap4">
|
<div h-full text-center justify-center flex="~ col items-center gap2">
|
||||||
<div text-sm op50>
|
<div text-4xl mb-10>
|
||||||
Sign in to follow profiles or hashtags, favourite, share and reply to posts, or interact from your account on a different server.
|
Nuxtodon
|
||||||
</div>
|
</div>
|
||||||
<NuxtLink to="/signin" class="btn-solid text-center">
|
|
||||||
|
<div>Mastodon Server</div>
|
||||||
|
<div flex bg-gray:10 px2 py1 mxa rounded border="~ border" w-80 text-xl items-center>
|
||||||
|
<span op35 mr1 text-sm>https://</span>
|
||||||
|
<input v-model="server" :placeholder="DEFAULT_SERVER" outline-none bg-transparent>
|
||||||
|
</div>
|
||||||
|
<button btn-solid mxa @click="oauth()">
|
||||||
Sign in
|
Sign in
|
||||||
</NuxtLink>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -0,0 +1,10 @@
|
||||||
|
<template>
|
||||||
|
<div p8 flex="~ col gap4">
|
||||||
|
<div text-sm op50>
|
||||||
|
Sign in to follow profiles or hashtags, favourite, share and reply to posts, or interact from your account on a different server.
|
||||||
|
</div>
|
||||||
|
<NuxtLink to="/signin" class="btn-solid text-center">
|
||||||
|
Sign in
|
||||||
|
</NuxtLink>
|
||||||
|
</div>
|
||||||
|
</template>
|
|
@ -38,6 +38,10 @@
|
||||||
<div i-ri:bookmark-line />
|
<div i-ri:bookmark-line />
|
||||||
<span>Bookmarks</span>
|
<span>Bookmarks</span>
|
||||||
</NuxtLink>
|
</NuxtLink>
|
||||||
|
<NuxtLink flex gap2 items-center :to="`/@${currentUser.account?.username}`" active-class="text-primary">
|
||||||
|
<AccountAvatar :account="currentUser.account" h="1.2em" />
|
||||||
|
<span>Profile</span>
|
||||||
|
</NuxtLink>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -55,8 +55,8 @@ onUnmounted(() => {
|
||||||
/>
|
/>
|
||||||
<div flex justify-end>
|
<div flex justify-end>
|
||||||
<button
|
<button
|
||||||
h-9 w-22 bg-primary border-rounded
|
btn-solid
|
||||||
:disabled="draft.status === ''"
|
:disabled="!draft.status"
|
||||||
@click="publish"
|
@click="publish"
|
||||||
>
|
>
|
||||||
Publish!
|
Publish!
|
||||||
|
|
|
@ -5,7 +5,7 @@
|
||||||
<div sticky top-0 h-screen flex="~ col">
|
<div sticky top-0 h-screen flex="~ col">
|
||||||
<slot name="left">
|
<slot name="left">
|
||||||
<AccountMe v-if="currentUser" />
|
<AccountMe v-if="currentUser" />
|
||||||
<AccountSignIn v-else />
|
<AccountSignInEntry v-else />
|
||||||
</slot>
|
</slot>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -2,30 +2,8 @@
|
||||||
definePageMeta({
|
definePageMeta({
|
||||||
layout: 'none',
|
layout: 'none',
|
||||||
})
|
})
|
||||||
|
|
||||||
const server = ref()
|
|
||||||
|
|
||||||
async function oauth() {
|
|
||||||
const a = document.createElement('a')
|
|
||||||
a.href = `/api/${server.value}/login`
|
|
||||||
a.target = '_blank'
|
|
||||||
a.click()
|
|
||||||
}
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div h-full text-center justify-center flex="~ col items-center gap2">
|
<AccountSignIn />
|
||||||
<div text-4xl mb-10>
|
|
||||||
Nuxtodon
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div>Mastodon Server</div>
|
|
||||||
<div bg-gray:10 px2 py1 rounded border="~ border" w-50 mxa flex>
|
|
||||||
<span op25 mr1>https://</span>
|
|
||||||
<input v-model="server" outline-none bg-transparent>
|
|
||||||
</div>
|
|
||||||
<button bg-teal6 px2 py1 rounded w-20 mxa mt-5 @click="oauth()">
|
|
||||||
Login
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</template>
|
</template>
|
||||||
|
|
|
@ -0,0 +1 @@
|
||||||
|
/// <references type="unplugin-vue-macros/macros-global" />
|
|
@ -1,10 +1,5 @@
|
||||||
{
|
{
|
||||||
"extends": "./.nuxt/tsconfig.json",
|
"extends": "./.nuxt/tsconfig.json",
|
||||||
"compilerOptions": {
|
|
||||||
"types": [
|
|
||||||
"unplugin-vue-macros/macros-global"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"vueCompilerOptions": {
|
"vueCompilerOptions": {
|
||||||
"plugins": [
|
"plugins": [
|
||||||
"@vue-macros/volar/define-model",
|
"@vue-macros/volar/define-model",
|
||||||
|
|
|
@ -15,8 +15,9 @@ export default defineConfig({
|
||||||
'border-base': 'border-$c-border',
|
'border-base': 'border-$c-border',
|
||||||
'bg-base': 'bg-$c-bg-base',
|
'bg-base': 'bg-$c-bg-base',
|
||||||
'text-base': 'text-$c-text-base',
|
'text-base': 'text-$c-text-base',
|
||||||
'btn-solid': 'px-4 py-2 rounded text-white bg-$c-primary hover:bg-$c-primary-active',
|
'interact-disabled': 'disabled:opacity-50 disabled:pointer-events-none disabled:saturate-0',
|
||||||
'btn-outline': 'px-4 py-2 rounded text-$c-primary border-$c-primary hover:bg-$c-primary hover:text-white',
|
'btn-solid': 'px-4 py-2 rounded text-white bg-$c-primary hover:bg-$c-primary-active interact-disabled',
|
||||||
|
'btn-outline': 'px-4 py-2 rounded text-$c-primary border-$c-primary hover:bg-$c-primary hover:text-white interact-disabled',
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
presets: [
|
presets: [
|
||||||
|
|
Loading…
Reference in New Issue