knowyt/client/src/pages/index.vue
2022-08-29 15:35:24 +02:00

80 lines
1.5 KiB
Vue

<template>
<div>
<TitleBox />
<div class="page-index__action-box">
<div class="page-index__space" />
<div class="page-index__login">
<LoginBox />
</div>
<div class="page-index__separator" />
<div class="page-index__create-team">
<Button disabled>{{ $t('create-team') }}</Button>
</div>
<div class="page-index__space" />
</div>
<div class="page-index__copyright-notice">
v{{ config.version }}, © 2021-2022, Settel
</div>
</div>
</template>
<script setup lang="ts">
import { useRuntimeConfig, navigateTo } from '#app'
import useAuth from '@/composables/useAuth'
import useI18n from '@/composables/useI18n'
const { $t } = useI18n({
'create-team': { en: 'Create Team', de: 'Team erstellen' },
})
const config = useRuntimeConfig()
try {
await useAuth().authenticateAndLoadUserInfo()
navigateTo('/play', { replace: true })
} catch (e) {
// nop
}
</script>
<style lang="scss">
@import '~/assets/css/components';
body {
background-color: $background-primary-color;
color: $text-primary-color;
margin: 0;
}
.page-index {
&__action-box {
display: flex;
width: 100%;
height: 120px;
}
&__login,
&__create-team {
width: 320px;
align-self: center;
}
&__separator {
width: 1px;
margin: 0 48px;
border-left: $box-primary-border;
}
&__space {
flex-grow: 1;
}
&__copyright-notice {
position: absolute;
right: 1em;
bottom: 0;
color: #000000;
}
}
</style>