louis/food-inventory
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

same responsive design for the register page

Browse Source
This commit is contained in:
Louis Vallat 2019-11-21 23:27:02 +01:00
parent 2de5e2072a
commit d40b4d6754
4 changed files with 47 additions and 44 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
assets/css/common.css
View File

@ -46,6 +46,14 @@ body {
align-items: stretch; align-items: stretch;
} }
.flex-content-stretch {
align-content: stretch;
}
.flex-space-between {
justify-content: space-between;
}
.halo-hover { .halo-hover {
transition: all 500ms; transition: all 500ms;
} }

6
assets/css/login.css
View File

@ -188,4 +188,8 @@ a {
left: 0; left: 0;
top: 0; top: 0;
border-radius: 3px; border-radius: 3px;
} }
#register-email {
width: 100%;
}

2
login.php
View File

@ -73,7 +73,7 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
<h2 class="montserrat" id="title">Welcome back</h2> <h2 class="montserrat" id="title">Welcome back</h2>
<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post"> <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post">
<div class="flex-container flex-evenly"> <div class="flex-container flex-evenly">
<input type="text" name="username" class="form-control halo-hover <?php echo (!empty($username_err)) ? 'has-error' : ''; ?>" value="<?php echo $username; ?>" placeholder="Username"> <input type="email" name="username" class="form-control halo-hover <?php echo (!empty($username_err)) ? 'has-error' : ''; ?>" value="<?php echo $username; ?>" placeholder="Username">
<input type="password" name="password" class="form-control halo-hover <?php echo (!empty($password_err)) ? 'has-error' : ''; ?>" placeholder="Password"> <input type="password" name="password" class="form-control halo-hover <?php echo (!empty($password_err)) ? 'has-error' : ''; ?>" placeholder="Password">
</div> </div>
<div class="flex-container flex-evenly"> <div class="flex-container flex-evenly">

75
register.php
View File

@ -47,7 +47,7 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
if (empty(trim($_POST["first_name"]))) { if (empty(trim($_POST["first_name"]))) {
$first_name_err = "Please input your first name."; $first_name_err = "Please input your first name.";
} else if (strlen(trim($_POST["first_name"])) > 255){ } else if (strlen(trim($_POST["first_name"])) > 255) {
$first_name_err = "Too long."; $first_name_err = "Too long.";
} else { } else {
$first_name = trim($_POST["first_name"]); $first_name = trim($_POST["first_name"]);
@ -55,7 +55,7 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
if (empty(trim($_POST["last_name"]))) { if (empty(trim($_POST["last_name"]))) {
$last_name_err = "Please input your last name."; $last_name_err = "Please input your last name.";
} else if (strlen(trim($_POST["last_name"])) > 255){ } else if (strlen(trim($_POST["last_name"])) > 255) {
$last_name_err = "Too long."; $last_name_err = "Too long.";
} else { } else {
$last_name = trim($_POST["last_name"]); $last_name = trim($_POST["last_name"]);
@ -82,55 +82,46 @@ if ($_SERVER["REQUEST_METHOD"] == "POST") {
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<title>Sign Up</title> <!-- TODO : ADD SEO STUFF -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.css"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<style type="text/css"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
body { <link href="/assets/css/reset.css" rel="stylesheet">
font: 14px sans-serif; <link href="/assets/css/common.css" rel="stylesheet">
} <link href="/assets/css/login.css" rel="stylesheet">
<title>Food invetory - Register</title>
.wrapper {
width: 350px;
padding: 20px;
}
</style>
</head> </head>
<body> <body>
<div class="wrapper"> <div class="center30left white">
<h2>Sign Up</h2> <h2 class="montserrat" id="title">Nice to meet you</h2>
<p>Please fill this form to create an account.</p>
<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post"> <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post">
<div class="form-group <?php echo (!empty($username_err)) ? 'has-error' : ''; ?>"> <div class="flex-container flex-content-stretch">
<label>Username</label> <input type="email" name="username" class="form-control halo-hover <?php echo (!empty($username_err)) ? 'has-error' : ''; ?>" value="<?php echo $username; ?>" placeholder="E-mail" id="register-email">
<input type="text" name="username" class="form-control" value="<?php echo $username; ?>">
<span class="help-block"><?php echo $username_err; ?></span>
</div> </div>
<div class="form-group <?php echo (!empty($first_name_err)) ? 'has-error' : ''; ?>"> <div class="flex-container flex-content-stretch flex-space-between">
<label>First name</label> <input type="text" placeholder="First name" name="first_name" class="form-control halo-hover <?php echo (!empty($first_name_err)) ? 'has-error' : ''; ?>" value="<?php echo $first_name; ?>">
<input type="text" name="first_name" class="form-control" value="<?php echo $first_name; ?>"> <input type="text" placeholder="Last name" name="last_name" class="form-control halo-hover <?php echo (!empty($last_name_err)) ? 'has-error' : ''; ?>" value="<?php echo $last_name; ?>">
<span class="help-block"><?php echo $first_name_err; ?></span>
</div> </div>
<div class="form-group <?php echo (!empty($last_name_err)) ? 'has-error' : ''; ?>"> <div class="flex-container flex-content-stretch flex-space-between">
<label>Last name</label> <input type="password" placeholder="Password" name="password" class="form-control halo-hover <?php echo (!empty($password_err)) ? 'has-error' : ''; ?>" value="<?php echo $password; ?>">
<input type="text" name="last_name" class="form-control" value="<?php echo $last_name; ?>"> <input type="password" placeholder="Confirm password" name="confirm_password" class="form-control halo-hover <?php echo (!empty($confirm_password_err)) ? 'has-error' : ''; ?>" value="<?php echo $confirm_password; ?>">
<span class="help-block"><?php echo $last_name_err; ?></span>
</div> </div>
<div class="form-group <?php echo (!empty($password_err)) ? 'has-error' : ''; ?>"> <div class="flex-container flex-evenly">
<label>Password</label> <div class="error">
<input type="password" name="password" class="form-control" value="<?php echo $password; ?>"> <?php
<span class="help-block"><?php echo $password_err; ?></span> if (!empty($username_err)) echo $username_err;
else if (!empty($first_name_err)) echo $first_name_err;
else if (!empty($last_name_err)) echo $last_name_err;
else if (!empty($password_err)) echo $password_err;
else echo $confirm_password_err;
?>
</div>
</div> </div>
<div class="form-group <?php echo (!empty($confirm_password_err)) ? 'has-error' : ''; ?>"> <div class="form-group flex-container flex-vertical-center flex-space-between">
<label>Confirm Password</label> <input type="submit" class="halo-hover login-button" value="Submit">
<input type="password" name="confirm_password" class="form-control" value="<?php echo $confirm_password; ?>"> <a href="login.php" class="login-button halo-hover other-buttons">Already registered? Login!</a>
<span class="help-block"><?php echo $confirm_password_err; ?></span> <a href="/" class="login-button halo-hover other-buttons">Main page</a>
</div> </div>
<div class="form-group">
<input type="submit" class="btn btn-primary" value="Submit">
<input type="reset" class="btn btn-default" value="Reset">
</div>
<p>Already have an account? <a href="login.php">Login here</a>.</p>
</form> </form>
</div> </div>
</body> </body>