pull/4/head
Suvodip 2024-09-02 19:10:58 +05:30
parent c7d1ac2749
commit 2ec148bccb
4 changed files with 81 additions and 1 deletions

BIN
public/img/bg-image.jpg Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 743 KiB

View File

@ -0,0 +1,46 @@
<main>
<div class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2">
<section class="container mx-auto max-w-lg bg-[url(/img/hps_logo.png)] rounded-2xl">
<div class="flex flex-col w-full justify-center place-items-center border-[1px] border-[#0e0f0420] rounded-[20px] shadow-2xl py-10">
<img class="max-w-[150px] shadow-lg p-2 py-6 border-[1px] rounded-full" src="/img/hps_logo.png" alt="">
<form action="" class="p-6">
<input id="email" name="email" type="text" placeholder="User ID" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2" required/>
<input id="password" name="password" type="password" placeholder="Passsord" class="border-2 focus:border-[#47ae6a] border-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-6" required/>
<button onclick="myFunction(event)" class="border-2 border-[#3084b5] text-white bg-[#3084b5] focus:outline-none rounded-lg w-full p-2 mt-4">Login</button>
</form>
<p class="">Not Registerd? <a href="/sign-up" class="text-[#FFFFFF] font-bold">Register Now</a></p>
</div>
</section>
</div>
</main>
<script is:inline>
function myFunction(event){
event.preventDefault();
let emailId = document.getElementById('email').value;
let password = document.getElementById('password').value;
let userData = {
email : emailId,
password : password
}
fetch(`https://game-du.teachertrainingkolkata.in/auth/login`, {
method: 'POST',
headers: {
'Content-Type' : 'application/json'
},
body: JSON.stringify(userData)
})
.then(res => res.json())
.then(data => {
console.log(data)
})
}
</script>
<style>
.content {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
</style>

View File

@ -1,6 +1,6 @@
<main>
<div class="content">
<div class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2">
<section class="container mx-auto max-w-lg bg-[url(/img/hps_logo.png)] rounded-2xl">
<div class="flex flex-col w-full justify-center place-items-center border-[1px] border-[#0e0f0420] rounded-[20px] shadow-2xl py-10">
<img class="max-w-[150px] shadow-lg p-2 py-6 border-[1px] rounded-full" src="/img/hps_logo.png" alt="">

34
src/pages/login1.astro Normal file
View File

@ -0,0 +1,34 @@
<main>
<div class="bg-[url(/img/bg-image.jpg)] bg-cover bg-center h-screen">
<div class="absolute top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2">
<div class="container mx-auto px-4 max-w-lg py-6 bg-[#00000080] rounded-lg">
<div class="flex flex-col space-y-3 ">
<p class="text-2xl font-bold text-[#FFF] ">Welcome Back</p>
<p class="text-lg text-[#fff]">Enter your email and password to access your account</p>
<div class="mt-10 flex flex-col">
<label class="text-[#FFF]" for="email">Email:</label>
<input
class="border-2 border-[#fff] text-[#FFF] rounded-md bg-transparent p-2"
placeholder="Email Id"
type="text">
</div>
<div class="flex flex-col">
<label class="text-[#FFF]" for="password">Password:</label>
<input
placeholder="Password"
class="border-2 border-[#fff] text-[#FFF] rounded-md bg-transparent p-2"
type="password">
</div>
<div class="flex flex-row justify-between">
<label class="text-[#FFF]" for="remember">
<input type="checkbox" name="remember" id="remember">
Remember Password
</label>
<a class="text-[#FFF]" href="">Forgot Password</a>
</div>
<button class="bg-[#FFFFFF80] p-1.5 rounded-md">Login</button>
</div>
</div>
</div>
</div>
</main>