95 lines
2.2 KiB
Vue
95 lines
2.2 KiB
Vue
<template>
|
|
<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>{{ $t('idea') }}</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="info__table-key">Denis</td>
|
|
<td>{{ $t('design') }}</td>
|
|
</tr>
|
|
</table>
|
|
<h2 class="info__subtitle">{{ $t('technologies') }}</h2>
|
|
<table class="info__table">
|
|
<tr>
|
|
<td class="info__table-key">Frontend</td>
|
|
<td>Vue3 + Nuxt3</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="info__table-key">Backend</td>
|
|
<td>Go</td>
|
|
</tr>
|
|
<tr>
|
|
<td class="info__table-key">Tools</td>
|
|
<td>Podman/Docker, GNU Make, VS Code, Figma</td>
|
|
</tr>
|
|
</table>
|
|
<template v-slot:footer>
|
|
<Button :border="true" @click="$emit('close')">{{ $t('back') }}</Button>
|
|
</template>
|
|
</ModalDialog>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
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">
|
|
@import '~/assets/css/components';
|
|
|
|
.info {
|
|
&__container {
|
|
display: flex;
|
|
width: 100%;
|
|
height: 100%;
|
|
color: $text-primary-color;
|
|
}
|
|
|
|
&__box {
|
|
display: flex;
|
|
flex-direction: column;
|
|
min-width: 600px;
|
|
margin: auto;
|
|
padding: 32px;
|
|
border: 1px solid white;
|
|
border-radius: 16px;
|
|
}
|
|
|
|
&__title {
|
|
font-family: $font-primary;
|
|
margin: 0 32px 32px 0;
|
|
font-size: 48px;
|
|
}
|
|
|
|
&__subtitle {
|
|
margin: 32px 0 8px 0;
|
|
font-size: 24px;
|
|
font-family: $font-secondary;
|
|
}
|
|
|
|
&__table {
|
|
font-family: $font-secondary;
|
|
|
|
&-key {
|
|
width: 6em;
|
|
}
|
|
}
|
|
}
|
|
</style>
|