cleaned up Login component for darkmode compatibility

This commit is contained in:
Philipp Dormann 2020-12-22 19:57:25 +01:00
parent 2a155a5cd4
commit 040359aa93

View File

@ -64,17 +64,17 @@
};
</script>
<div class="min-h-screen flex items-center justify-center bg-gray-100">
<div class="min-h-screen flex items-center justify-center bg-gray-100 text-gray-900">
<div class="max-w-md w-full py-12 px-6">
<img
style="height:10rem;"
class="mx-auto"
src="https://lauf-fuer-kaya.de/Bilder/kaya-logo-quadrat.png"
alt="" />
<p class="mt-6 text-lg text-center font-bold text-gray-900">
<p class="mt-6 text-lg text-center font-bold">
{$_('application_name')}
</p>
<p class="mt-6 text-sm text-center text-gray-900">
<p class="mt-6 text-sm text-center">
{$_('log_in_to_your_account')}
</p>
<div>
@ -85,7 +85,7 @@
name="email"
type="email"
required=""
class="border-gray-300 placeholder-gray-500 appearance-none rounded-none relative block w-full px-3 py-2 border text-gray-900 rounded-t-md focus:outline-none focus:shadow-outline-blue focus:border-blue-300 focus:z-10 sm:text-sm"
class="border-gray-300 placeholder-gray-500 appearance-none rounded-none relative block w-full px-3 py-2 border rounded-t-md focus:outline-none focus:shadow-outline-blue focus:border-blue-300 focus:z-10 sm:text-sm"
placeholder={$_('email_address_or_username')}
bind:value={usersUsername} />
</div>
@ -96,7 +96,7 @@
type="password"
required=""
bind:value={usersPassword}
class="border-gray-300 placeholder-gray-500 appearance-none rounded-none relative block w-full px-3 py-2 border text-gray-900 rounded-b-md focus:outline-none focus:shadow-outline-blue focus:border-blue-300 focus:z-10 sm:text-sm"
class="border-gray-300 placeholder-gray-500 appearance-none rounded-none relative block w-full px-3 py-2 border rounded-b-md focus:outline-none focus:shadow-outline-blue focus:border-blue-300 focus:z-10 sm:text-sm"
placeholder={$_('password')} />
</div>
</div>
@ -124,7 +124,7 @@
<div class="mt-2">
<a
href="/#/forgot_password"
class="block w-full text-center py-2 px-3 border border-gray-300 rounded-md text-gray-900 font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm">
class="block w-full text-center py-2 px-3 border border-gray-300 rounded-md font-medium hover:border-gray-400 focus:outline-none focus:border-gray-400 sm:text-sm">
{$_('forgot_password?')}
</a>
</div>