feat: add transitions between pages

This commit is contained in:
Sebin Nyshkim 2023-09-04 22:11:34 +02:00
parent f2b408fce5
commit 68a43b6b9c
9 changed files with 269 additions and 227 deletions

View file

@ -25,73 +25,79 @@ const attributions = [
</script>
<template>
<section>
<h1>{{ $t(`${$route.meta.title}`) }}</h1>
<h2>{{ $t('attributions.artwork.heading') }}</h2>
</section>
<AttributionTable :attributions="attributions" />
<section>
<h2>{{ $t('attributions.other.heading') }}</h2>
</section>
<table>
<thead>
<tr>
<th>{{ $t('attributions.other.headings[0]') }}</th>
<th>{{ $t('attributions.other.headings[1]') }}</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{ $t('attributions.other.icons[0]') }}</td>
<td>
<a href="https://fontawesome.com/license/free" target="_blank" rel="noopener noreferrer">
Font Awesome
</a>
</td>
</tr>
<tr>
<td>{{ $t('attributions.other.headingFont[0]') }}</td>
<td>
<a
href="https://github.com/MichalSahar/Secular"
target="_blank"
rel="noopener noreferrer"
>
Secular One
</a>
{{ $t('attributions.other.headingFont[1]') }}
<a href="https://github.com/MichalSahar" target="_blank" rel="noopener noreferrer">
Michal Sahar
</a>
</td>
</tr>
<tr>
<td>{{ $t('attributions.other.copyFont[0]') }}</td>
<td>
<a
href="https://antonkoovit.com/typefaces/arvo"
target="_blank"
rel="noopener noreferrer"
>
Arvo
</a>
{{ $t('attributions.other.copyFont[1]') }}
<a href="https://antonkoovit.com/" target="_blank" rel="noopener noreferrer">
Anton Koovit
</a>
</td>
</tr>
<tr>
<td>{{ $t('attributions.other.background[0]') }}</td>
<td>
{{ $t('attributions.other.background[1][0]') }}
<a href="https://haikei.app/" target="_blank" rel="noopener noreferrer">Haikei</a>
{{ $t('attributions.other.background[1][1]') }}
<a href="https://zcreativelabs.com/" target="_blank" rel="noopener noreferrer">
z creative labs
</a>
</td>
</tr>
</tbody>
</table>
<article>
<section>
<h1>{{ $t(`${$route.meta.title}`) }}</h1>
<h2>{{ $t('attributions.artwork.heading') }}</h2>
</section>
<AttributionTable :attributions="attributions" />
<section>
<h2>{{ $t('attributions.other.heading') }}</h2>
</section>
<table>
<thead>
<tr>
<th>{{ $t('attributions.other.headings[0]') }}</th>
<th>{{ $t('attributions.other.headings[1]') }}</th>
</tr>
</thead>
<tbody>
<tr>
<td>{{ $t('attributions.other.icons[0]') }}</td>
<td>
<a
href="https://fontawesome.com/license/free"
target="_blank"
rel="noopener noreferrer"
>
Font Awesome
</a>
</td>
</tr>
<tr>
<td>{{ $t('attributions.other.headingFont[0]') }}</td>
<td>
<a
href="https://github.com/MichalSahar/Secular"
target="_blank"
rel="noopener noreferrer"
>
Secular One
</a>
{{ $t('attributions.other.headingFont[1]') }}
<a href="https://github.com/MichalSahar" target="_blank" rel="noopener noreferrer">
Michal Sahar
</a>
</td>
</tr>
<tr>
<td>{{ $t('attributions.other.copyFont[0]') }}</td>
<td>
<a
href="https://antonkoovit.com/typefaces/arvo"
target="_blank"
rel="noopener noreferrer"
>
Arvo
</a>
{{ $t('attributions.other.copyFont[1]') }}
<a href="https://antonkoovit.com/" target="_blank" rel="noopener noreferrer">
Anton Koovit
</a>
</td>
</tr>
<tr>
<td>{{ $t('attributions.other.background[0]') }}</td>
<td>
{{ $t('attributions.other.background[1][0]') }}
<a href="https://haikei.app/" target="_blank" rel="noopener noreferrer">Haikei</a>
{{ $t('attributions.other.background[1][1]') }}
<a href="https://zcreativelabs.com/" target="_blank" rel="noopener noreferrer">
z creative labs
</a>
</td>
</tr>
</tbody>
</table>
</article>
</template>