🌎 basic i18n keys for Register component
This commit is contained in:
parent
63bb34ef99
commit
37b7ed75c5
|
|
@ -1,5 +1,6 @@
|
|||
{
|
||||
"i18n-ally.localesPaths": [
|
||||
"src/locales"
|
||||
]
|
||||
],
|
||||
"i18n-ally.keystyle": "nested"
|
||||
}
|
||||
|
|
@ -5,12 +5,10 @@
|
|||
<h1
|
||||
class="sm:text-3xl text-2xl font-medium title-font mb-4 text-center"
|
||||
>Lauf für Kaya! - Registrieren</h1>
|
||||
<p
|
||||
class="mx-auto leading-relaxed text-base text-center"
|
||||
>{{ $t('register.register_now') }}</p>
|
||||
<p class="mx-auto leading-relaxed text-base text-center">{{ $t('register.register_now') }}</p>
|
||||
<div class="mt-4">
|
||||
<label for="first_name" class="block font-medium">
|
||||
Vorname
|
||||
{{ $t('vorname') }}
|
||||
<span class="font-bold">*</span>
|
||||
</label>
|
||||
<input
|
||||
|
|
@ -18,22 +16,22 @@
|
|||
name="firstname"
|
||||
id="first_name"
|
||||
autocomplete="off"
|
||||
placeholder="Vorname"
|
||||
:placeholder="[[$t('vorname')]]"
|
||||
type="text"
|
||||
class="dark:bg-gray-800 mt-1 focus:ring-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
<label for="middle_name" class="block font-medium">Mittelname</label>
|
||||
<label for="middle_name" class="block font-medium">{{ $t('mittelname') }}</label>
|
||||
<input
|
||||
v-model="userdetails.middlename"
|
||||
name="middlename"
|
||||
id="middle_name"
|
||||
autocomplete="off"
|
||||
placeholder="Mittelname"
|
||||
:placeholder="[[$t('mittelname')]]"
|
||||
type="text"
|
||||
class="dark:bg-gray-800 mt-1 focus:ring-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
<label for="last_name" class="block font-medium">
|
||||
Nachname
|
||||
{{ $t('nachname') }}
|
||||
<span class="font-bold">*</span>
|
||||
</label>
|
||||
<input
|
||||
|
|
@ -41,7 +39,7 @@
|
|||
name="lastname"
|
||||
id="last_name"
|
||||
autocomplete="off"
|
||||
placeholder="Nachname"
|
||||
:placeholder="[[$t('nachname')]]"
|
||||
type="text"
|
||||
class="dark:bg-gray-800 mt-1 focus:ring-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
|
|
@ -59,7 +57,7 @@
|
|||
:class="{ 'border-red-500': (!isEmail(userdetails.mail)), 'border-gray-300': (isEmail(userdetails.mail)) }"
|
||||
class="dark:bg-gray-800 mt-1 block w-full shadow-sm rounded-l-md sm:text-sm border bg-gray-50 text-gray-100 rounded-md p-2"
|
||||
/>
|
||||
<p class="text-sm">Bitte geben Sie eine gültige E-Mail Adresse an</p>
|
||||
<p class="text-sm">{{ $t('please_provide_valid_mail') }}</p>
|
||||
<div class="grid grid-cols-6 mt-6">
|
||||
<div class="col-span-6"></div>
|
||||
<div class="flex items-start col-span-6">
|
||||
|
|
@ -73,37 +71,40 @@
|
|||
/>
|
||||
</div>
|
||||
<div class="ml-3 text-sm">
|
||||
<label for="address_activated" class="font-medium text-gray-400">Adresse angeben?</label>
|
||||
<label
|
||||
for="address_activated"
|
||||
class="font-medium text-gray-400"
|
||||
>{{ $t('provide_address') }}</label>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="provide_address === true" class="col-span-6">
|
||||
<div class="col-span-6">
|
||||
<label for="street" class="block font-medium">Straße</label>
|
||||
<label for="street" class="block font-medium">{{ $t('strasse') }}</label>
|
||||
<input
|
||||
type="text"
|
||||
name="street"
|
||||
placeholder="Straße"
|
||||
:placeholder="[[$t('strasse')]]"
|
||||
id="street"
|
||||
autocomplete="street-address"
|
||||
class="dark:bg-gray-800 mt-1 focus:ring-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-span-6 sm:col-span-6 lg:col-span-2">
|
||||
<label for="city" class="block font-medium">Ort</label>
|
||||
<label for="city" class="block font-medium">{{ $t('ort') }}</label>
|
||||
<input
|
||||
type="text"
|
||||
name="city"
|
||||
placeholder="Ort"
|
||||
:placeholder="[[$t('ort')]]"
|
||||
id="city"
|
||||
class="dark:bg-gray-800 mt-1 focus:ring-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-span-6 sm:col-span-3 lg:col-span-2">
|
||||
<label for="postal_code" class="block font-medium">PLZ</label>
|
||||
<label for="postal_code" class="block font-medium">{{ $t('plz') }}</label>
|
||||
<input
|
||||
type="text"
|
||||
name="postal_code"
|
||||
placeholder="PLZ"
|
||||
:placeholder="[[$t('plz')]]"
|
||||
id="postal_code"
|
||||
autocomplete="postal-code"
|
||||
class="dark:bg-gray-800 mt-1 focus:ring-indigo-500 block w-full shadow-sm rounded-l-md sm:text-sm border-gray-300 border bg-gray-50 text-gray-500 rounded-md p-2"
|
||||
|
|
@ -134,7 +135,7 @@
|
|||
:disabled="(agb_accepted === false)"
|
||||
:class="{ 'opacity-50': (agb_accepted === false), 'cursor-not-allowed': (agb_accepted === false) }"
|
||||
class="text-white block w-full text-center py-2 px-3 border border-gray-300 rounded-md p-1 bg-blue-800 font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm"
|
||||
>Registrieren</button>
|
||||
>{{ $t('registrieren') }}</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-6">
|
||||
|
|
@ -143,14 +144,14 @@
|
|||
<div class="w-full border-t border-gray-300"></div>
|
||||
</div>
|
||||
<div class="relative flex justify-center text-sm">
|
||||
<span class="px-2 bg-white dark:bg-gray-900">Sie haben bereits einen Account?</span>
|
||||
<span class="px-2 bg-white dark:bg-gray-900">{{ $t('already_have_an_account') }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="mt-6">
|
||||
<a
|
||||
href="./login"
|
||||
class="block w-full text-center py-2 px-3 border border-gray-300 rounded-md p-1 dark:bg-gray-800 font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm"
|
||||
>Zum Login</a>
|
||||
>{{ $t('go_to_login') }}</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,16 @@
|
|||
{
|
||||
"register": {
|
||||
"register_now": "Jetzt für den Lauf für Kaya! 2021 registrieren."
|
||||
}
|
||||
},
|
||||
"mittelname": "Mittelname",
|
||||
"nachname": "Nachname",
|
||||
"vorname": "Vorname",
|
||||
"strasse": "Straße",
|
||||
"please_provide_valid_mail": "Bitte geben Sie eine gültige E-Mail Adresse an",
|
||||
"provide_address": "Adresse angeben?",
|
||||
"ort": "Ort",
|
||||
"plz": "PLZ",
|
||||
"registrieren": "Registrieren",
|
||||
"already_have_an_account": "Sie haben bereits einen Account?",
|
||||
"go_to_login": "Zum Login"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import { createApp } from 'vue';
|
||||
import { createWebHistory, createWebHashHistory, createRouter } from 'vue-router';
|
||||
import { createWebHistory, createRouter } from 'vue-router';
|
||||
import App from './App.vue';
|
||||
import { createI18n } from 'vue-i18n';
|
||||
import 'windi.css';
|
||||
|
|
@ -11,8 +11,9 @@ const messages = {
|
|||
en: keys_en,
|
||||
de: keys_de
|
||||
};
|
||||
const browserlocale = ((navigator.languages && navigator.languages[0]) || '').substr(0, 2);
|
||||
const i18n = createI18n({
|
||||
locale: 'de',
|
||||
locale: browserlocale,
|
||||
fallbackLocale: 'en',
|
||||
messages
|
||||
});
|
||||
|
|
@ -23,7 +24,6 @@ const Register = import('./components/Register.vue');
|
|||
const Profile = import('./components/Profile.vue');
|
||||
//
|
||||
const router = createRouter({
|
||||
// history: createWebHashHistory(),
|
||||
history: createWebHistory(),
|
||||
routes: [
|
||||
{ path: '/', component: Home },
|
||||
|
|
|
|||
Loading…
Reference in New Issue