marco/contexted-v3
1
0
Fork 0
Code Issues 7 Pull Requests Packages Projects 1 Releases Wiki Activity

refactor to ui components

Browse Source
This commit is contained in:
Marco Crapts
2023-05-26 16:43:12 +02:00
parent a642fcd1fb
commit c3bd807bff
13 changed files with 122 additions and 125 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
src/components/TopBar.vue
View File

@@ -19,10 +19,7 @@ const authUI: any = inject('firebaseAuthUI')
const authModalInitialStateOpen = ref<boolean>(authUI.isPendingRedirect())
</script>
<template>
<div
class="z-[500] flex h-[50px] bg-primary"
:class="searchActive && 'search-active'"
>
<div class="z-[500] flex h-[50px] bg-primary" :class="searchActive && 'search-active'">
<div class="mx-auto flex w-full max-w-app items-center py-2.5 text-white">
<div
class="search-active-hide flex items-center pl-3"
@@ -41,29 +38,33 @@ const authModalInitialStateOpen = ref<boolean>(authUI.isPendingRedirect())
<div class="flex h-full flex-grow flex-row items-center gap-2 pl-5 pr-3">
<template v-if="!loading">
<SearchBar @active="(active) => (searchActive = active)" />
<button
class="search-active-hide btn-outline btn-sm btn py-1 text-white"
<UIButton
size="sm"
variant="outline"
class="search-active-hide py-1 text-white"
@click="addNote('Untitled new note', '', true)"
>
<i class="fas fa-plus-circle text-[1.1rem]" />
</button>
<Modal v-if="initialized && !user" :open="authModalInitialStateOpen">
</UIButton>
<UIModal v-if="initialized && !user" :open="authModalInitialStateOpen">
<template #activator="{ open }">
<button
class="search-active-hide btn-outline btn-sm btn py-1 text-white"
<UIButton
size="sm"
variant="outline"
class="search-active-hide py-1 text-white"
@click="open"
>
Sign in
</button>
</UIButton>
</template>
<template #title>Sign in</template>
<template #default="{ close }">
<Auth @signedIn="close" />
</template>
<template #actions="{ close }">
<button class="btn-sm btn" @click="close">Close</button>
<UIButton size="sm" @click="close">Close</UIButton>
</template>
</Modal>
</UIModal>
<Settings v-else-if="user" />
</template>
<SkeletonTopBar v-else />