settel/knowyt
1
0
Fork 0
Code Issues Pull Requests Packages Releases Activity

refactor: move /info to ModalDialog

Browse Source
This commit is contained in:
Settel 2022-09-30 20:37:00 +02:00
parent 500b291069
commit 941be1a7d7
2 changed files with 20 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

26
client/src/pages/info.vue → client/src/components/InfoModal.vue
View File

@ -1,16 +1,15 @@
<template>
<div class="info__container">
<div class="info__box">
<ModalDialog @close="$emit('close')">
<h1 class="info__title">Know Your Teammates</h1>
<h2 class="info__subtitle">{{ $t('credits') }}</h2>
<table class="info__table">
<tr>
<td class="info__table-key">Settel</td>
<td>idea, code, add. design</td>
<td>{{ $t('idea') }}</td>
</tr>
<tr>
<td class="info__table-key">Denis</td>
<td>design</td>
<td>{{ $t('design') }}</td>
</tr>
</table>
<h2 class="info__subtitle">{{ $t('technologies') }}</h2>
@ -28,20 +27,27 @@
<td>Podman/Docker, GNU Make, VS Code, Figma</td>
</tr>
</table>
<Button class="info__button" :border="true" @click="navigateTo('/')">{{ $t('back') }}</Button>
</div>
</div>
<template v-slot:footer>
<Button :border="true" @click="$emit('close')">{{ $t('back') }}</Button>
</template>
</ModalDialog>
</template>
<script setup lang="ts">
import { navigateTo } from '#app'
import useI18n from '@/composables/useI18n'
import ModalDialog from '../components/ModalDialog.vue';
const $emit = defineEmits(['close'])
const { $t } = useI18n({
back: { en: 'back', de: 'zurück' },
idea: { en: 'concept, code, add. design', de: 'Konzept, Code, zusätzl. Design' },
design: { en: 'design', de: 'Design' },
credits: { en: 'Credits', de: 'Mitwirkende' },
technologies: { en: 'Technologies used', de: 'verwendete Technologien' },
})
const close = () => { window.location.href = '/' }
</script>
<style lang="scss">
@ -84,9 +90,5 @@ const { $t } = useI18n({
width: 6em;
}
}
&__button {
margin: 64px 0 0 auto;
}
}
</style>

6
client/src/pages/index.vue
View File

@ -12,9 +12,10 @@
</div>
<div class="page-index__space" />
</div>
<div class="page-index__copyright-notice" @click="navigateTo('/info')">
<div class="page-index__copyright-notice" @click="openInfoModal">
v{{ config.version }}, © 2021-2022, Settel
</div>
<InfoModal v-if="showInfoModal" @close="closeInfoModal" />
<CreateTeamDialog v-if="showCreateTeamDialog" @close="closeCreateTeamDialog" />
</div>
</template>
@ -34,8 +35,11 @@ const config = useRuntimeConfig()
await useAuth().authenticateAndLoadUserInfo([''])
const showCreateTeamDialog = ref(false)
const showInfoModal = ref(false)
const createTeam = () => { showCreateTeamDialog.value = true }
const closeCreateTeamDialog = () => { showCreateTeamDialog.value = false }
const openInfoModal = () => { showInfoModal.value = true }
const closeInfoModal = () => { showInfoModal.value = false }
</script>
<style lang="scss">