webapp/src/pages/Support.vue

59 lines
1.1 KiB
Vue

<script setup lang="ts">
import { useNostrStore } from '@/stores/nostr'
import SupportChat from '@/components/SupportChat.vue'
import { useRouter } from 'vue-router'
const router = useRouter()
const nostrStore = useNostrStore()
// Redirect to home if not logged in
if (!nostrStore.isLoggedIn) {
router.push('/')
}
</script>
<template>
<div class="container max-w-4xl mx-auto h-[calc(100vh-4rem)] py-4 px-4 sm:px-6 lg:px-8">
<div class="h-full">
<div class="h-full animate-in fade-in-50 slide-in-from-bottom-3">
<SupportChat v-if="nostrStore.isLoggedIn" />
</div>
</div>
</div>
</template>
<style scoped>
.animate-in {
animation-duration: 0.3s;
animation-timing-function: cubic-bezier(0.16, 1, 0.3, 1);
animation-fill-mode: forwards;
}
.fade-in-50 {
animation-name: fade-in-50;
}
.slide-in-from-bottom-3 {
animation-name: slide-in-from-bottom-3;
}
@keyframes fade-in-50 {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@keyframes slide-in-from-bottom-3 {
from {
transform: translateY(3px);
}
to {
transform: translateY(0);
}
}
</style>