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> </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"> <div class="max-w-md w-full py-12 px-6">
<img <img
style="height:10rem;" style="height:10rem;"
class="mx-auto" class="mx-auto"
src="https://lauf-fuer-kaya.de/Bilder/kaya-logo-quadrat.png" src="https://lauf-fuer-kaya.de/Bilder/kaya-logo-quadrat.png"
alt="" /> 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')} {$_('application_name')}
</p> </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')} {$_('log_in_to_your_account')}
</p> </p>
<div> <div>
@ -85,7 +85,7 @@
name="email" name="email"
type="email" type="email"
required="" 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')} placeholder={$_('email_address_or_username')}
bind:value={usersUsername} /> bind:value={usersUsername} />
</div> </div>
@ -96,7 +96,7 @@
type="password" type="password"
required="" required=""
bind:value={usersPassword} 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')} /> placeholder={$_('password')} />
</div> </div>
</div> </div>
@ -124,7 +124,7 @@
<div class="mt-2"> <div class="mt-2">
<a <a
href="/#/forgot_password" 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?')} {$_('forgot_password?')}
</a> </a>
</div> </div>