mail@pastecode.io avatar
23 days ago
3.3 kB
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Login Page</title>
        <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
            html {
                background-image: url('https://img4.thuthuatphanmem.vn/uploads/2020/07/03/background-tre-em-dep_034413094.jpg');
                background-color: #e6ffff;
                background-size: cover;
                background-repeat: no-repeat;
                background-position: center;
                background-attachment: fixed;
                height: 100%;
                margin: 0;

            body {
                display: flex;
                justify-content: center;
                align-items: center;
                min-height: 100vh;
                margin: 0;

            .content-left {
                width: 60%;
                height: 100%;
                padding: 20px;
                text-align: center;

            .login-form {
                width: 260px;
                height: 400px;
                border: 2px solid #cfcfcf;
                padding-left: 20px;
                padding-right: 20px;
                border-radius: 5px;
                background-color: rgba(244,249,255,30);

            .login-form form {
                padding: 20px;
                text-align: center;

            input {
                margin-bottom: 20px;
                text-align: center;

            h4 {
                color: #BBBBBB;
                padding-bottom: 20px;

            ::-webkit-input-placeholder {
                text-align: center;

            :-moz-placeholder {
                text-align: center;

            a {
                padding-bottom: 20px;
                margin-left: 45px;

            button {
                background-color: red;

        <div class="content-left">
            <h1><a href="home">Children Care Service</a></h1>
            <p>Ensuring the Well-Being of Your Children</p>
            <p>Login to see more details</p>
        <div class="login-form">
            <form action="login" method="post">
                <c:if test="${msg!=null}">
                    <p class="msg" style="color:red">${msg}</p>
                <input type="email" name="email" value="${account.email}" placeholder="Email" required><br><!-- comment -->
                <input type="password" name="password" value="" placeholder="Password" required><br>
                <button type="submit" value="Login" name="login">Log in</button><br>
            <a href="resetreq">Forgot password?</a><br>
            <a href="signup">Don't have an account?</a>