ft_transcendence/frontend/src/pages/login/login.html
Maieul BOYER 6d630fee92 feat(frontend/auth): Added way to automatically fetch providers
This allows the frontend to list all available providers without
hardcoding them in.
2025-11-14 16:57:14 +01:00

41 lines
1.6 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<div class="grid h-full place-items-center">
<div class="bg-white shadow-lg rounded-2xl p-8 w-full max-w-md">
<h1 class="text-2xl font-semibold text-center mb-6 text-gray-800">Welcome to <span>ft boules</span></h1>
<button id="bGuestLogin"
class="w-full bg-gray-600 text-white font-medium py-2 rounded-xl hover:bg-gray-700 transition">
Login as Guest
</button>
<form class="space-y-5 pt-3" id="login-form">
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Username</label>
<input type="text" placeholder="Enter your username" name="login"
class="w-full px-4 py-2 border border-gray-300 text-gray-700 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500" />
</div>
<div>
<label class="block text-sm font-medium text-gray-700 mb-1">Password</label>
<input type="password" placeholder="Enter your password" name="password"
class="w-full px-4 py-2 border border-gray-300 text-gray-700 rounded-xl focus:outline-none focus:ring-2 focus:ring-blue-500" />
</div>
<button type="submit"
class="w-full bg-blue-600 text-white font-medium py-2 rounded-xl hover:bg-blue-700 transition">
Sign In
</button>
</form>
<p class="text-center text-sm text-gray-500 mt-4">
Dont have an account?
<a href="/signin" class="text-blue-600 hover:underline">Sign up</a>
</p>
<p class="text-center text-sm text-gray-500 mt-4">
You can also login with
</p>
<div id="otherLogin" class="pt-5 grid grid-cols-2 gap-4">
</div>
</div>
</div>