-
Notifications
You must be signed in to change notification settings - Fork 137
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
✨ awesome progress moving to nuxt ui
- Loading branch information
Showing
37 changed files
with
9,177 additions
and
8,220 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,4 @@ | ||
| { | ||
| "root": true, | ||
| "extends": ["@antfu"] | ||
| } |
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,26 @@ | ||
| export default defineAppConfig({ | ||
| ui: { | ||
| primary: 'emerald', | ||
| gray: 'slate', | ||
| notifications: { | ||
| // Show toasts at the top right of the screen for desktop | ||
| // position: 'lg:top-0 lg:right-0 lg:justify-start', | ||
|
|
||
| }, | ||
| button: { | ||
| default: { | ||
| loadingIcon: 'i-mdi-loading', | ||
| }, | ||
| }, | ||
| input: { | ||
| default: { | ||
| loadingIcon: 'i-mdi-loading', | ||
| }, | ||
| }, | ||
| selectMenu: { | ||
| default: { | ||
| selectedIcon: 'i-mdi-check-bold', | ||
| }, | ||
| }, | ||
| } | ||
| }) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,27 @@ | ||
| <script lang="ts" setup > | ||
| const color = 'repeating-linear-gradient(to right,#00c893 0%,#9c9ae3 50%,#6667ab 100%)' | ||
| useApi().setNuxtApp(useNuxtApp()) | ||
| </script> | ||
|
|
||
| <template> | ||
| <div class="min-h-screen bg-gray-100 dark:bg-gray-900"> | ||
| <nuxt-layout> | ||
| <header-bar /> | ||
| <layout-bread-crumbs> | ||
| <u-container> | ||
| <NuxtLoadingIndicator /> <!-- here --> | ||
| <nuxt-page /> | ||
| </u-container> | ||
| </layout-bread-crumbs> | ||
| <u-notifications> | ||
| <template #title="{ title }"> | ||
| <span v-html="title" /> | ||
| </template> | ||
| <template #description="{ description }"> | ||
| <span v-html="description" /> | ||
| </template> | ||
| </u-notifications> | ||
| <header-login-modal /> | ||
| </nuxt-layout> | ||
| </div> | ||
| </template> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,14 +1,7 @@ | ||
| <script lang="ts" setup> | ||
| import type { RouteLocationRaw } from 'vue-router' | ||
| import { useRouter } from 'vue-router' | ||
| import { ModalBase, PushButton } from 'tailvue' | ||
| import type { UserLogin } from '@/types/frontend' | ||
| export interface Props { | ||
| destroyed: () => void | ||
| } | ||
| defineProps<Props>() | ||
| const { loginModal, loginModalOff } = useModal() | ||
| const emit = defineEmits<{ (event: 'off'): void }>() | ||
|
|
@@ -29,21 +22,20 @@ async function attempt(): Promise<void> { | |
| loading.attempt = false | ||
| if (!result) | ||
| return | ||
| api.$toast.show({ | ||
| type: 'success', | ||
| title: 'Login E-mail Sent', | ||
| message: `Login link sent to <b>${email.value}</b>`, | ||
| useToast().add({ | ||
| color: 'green', | ||
| title: `Login link sent to <b>${email.value}</b>`, | ||
| timeout: 5, | ||
| }) | ||
| email.value = '' | ||
| emit('off') | ||
| loginModalOff() | ||
| } | ||
| const oauthComplete = async (result: UserLogin): Promise<void> => { | ||
| loading[result.provider] = false | ||
| const redirect = await api.login(result) | ||
| await router.push(redirect as RouteLocationRaw) | ||
| emit('off') | ||
| navigateTo(redirect) | ||
| loginModalOff() | ||
| } | ||
| function messageHandler(add: boolean): void { | ||
|
|
@@ -56,7 +48,7 @@ function handleMessage(event: { data: UserLogin }): void { | |
| if (event.data.user && event.data.token) | ||
| oauthComplete(event.data) | ||
| if (event.data.error) | ||
| api.$toast.show({ type: 'danger', message: event.data.error }) | ||
| useToast().add({ color: 'red', title: event.data.error }) | ||
| } | ||
| function login(provider: 'facebook' | 'google'): void { | ||
|
|
@@ -76,43 +68,41 @@ function login(provider: 'facebook' | 'google'): void { | |
| }, 200) | ||
| } | ||
| if (getCurrentInstance() && window) { | ||
| onMounted(() => messageHandler(true)) | ||
| onBeforeUnmount(() => messageHandler(false)) | ||
| } | ||
| onMounted(() => messageHandler(true)) | ||
| onBeforeUnmount(() => messageHandler(false)) | ||
| </script> | ||
|
|
||
| <template> | ||
| <ModalBase :destroyed="destroyed"> | ||
| <u-modal v-model="loginModal"> | ||
| <div class="bg-white dark:bg-gray-800 py-8 px-4 sm:px-10"> | ||
| <div class="grid grid-cols-2 gap-3"> | ||
| <div> | ||
| <PushButton class="w-full justify-center" @click="login('google')"> | ||
| <icon | ||
| <u-button class="w-full justify-center" @click="login('google')" color="white"> | ||
| <u-icon | ||
| v-if="loading.google" | ||
| icon="gg:spinner-two" | ||
| class="w-6 h-6 text-indigo-600 animate-spin" | ||
| name="i-mdi-loading" | ||
| class="w-6 h-6 animate-spin" | ||
| /> | ||
| <icon | ||
| <u-icon | ||
| v-else | ||
| icon="flat-color-icons:google" | ||
| name="i-mdi-google" | ||
| class="w-6 h-6" | ||
| /> | ||
| </PushButton> | ||
| </u-button> | ||
| </div> | ||
| <div> | ||
| <PushButton class="w-full justify-center" @click="login('facebook')"> | ||
| <icon | ||
| <u-button class="w-full justify-center" @click="login('facebook')" color="white"> | ||
| <u-icon | ||
| v-if="loading.facebook" | ||
| icon="gg:spinner-two" | ||
| class="w-6 h-6 text-indigo-600 animate-spin" | ||
| name="i-mdi-loading" | ||
| class="w-6 h-6 animate-spin" | ||
| /> | ||
| <icon | ||
| <u-icon | ||
| v-else | ||
| icon="logos:facebook" | ||
| name="i-mdi-facebook" | ||
| class="w-6 h-6" | ||
| /> | ||
| </PushButton> | ||
| </u-button> | ||
| </div> | ||
| </div> | ||
| <div class="mt-6 relative"> | ||
|
|
@@ -130,28 +120,27 @@ if (getCurrentInstance() && window) { | |
| <div class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none"> | ||
| <icon icon="mdi:envelope" class="w-5 h-5 text-gray-400" /> | ||
| </div> | ||
| <input | ||
| <u-input | ||
| id="login_email" | ||
| ref="input" | ||
| v-model="email" | ||
| class="form-input appearance-none block dark:bg-gray-600 w-full px-3 py-2 pl-10 border border-gray-300 dark:border-gray-500 rounded-md placeholder-gray-400 focus:outline-none focus:shadow-outline-blue focus:border-blue-300 transition duration-150 ease-in-out sm:text-sm sm:leading-5" | ||
| :readonly="loading.attempt" | ||
| placeholder="[email protected]" | ||
| type="email" | ||
| @keydown.esc="off" | ||
| @keydown.enter="attempt" | ||
| > | ||
| /> | ||
| </div> | ||
| <div class="mt-6"> | ||
| <span class="block w-full rounded-md shadow-sm"> | ||
| <PushButton theme="indigo" class="w-full justify-center" @click="attempt"> | ||
| <u-button theme="indigo" class="w-full justify-center" @click="attempt"> | ||
| Sign in / Register | ||
| <div v-if="loading.attempt" class="absolute inset-y-0 left-0 pl-3 flex items-center pointer-events-none"> | ||
| <icon icon="gg:spinner-two" class="w-5 h-5 text-indigo-200 animate-spin" /> | ||
| </div> | ||
| </PushButton> | ||
| </u-button> | ||
| </span> | ||
| </div> | ||
| </div> | ||
| </ModalBase> | ||
| </u-modal> | ||
| </template> | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.