exam

LOGIN
<!DOCTYPE html>
<html>
<Title>Login Page</Title>
<head>
<meta name = "viewport" content = "width=device-with, initial-scale=1.0">
<link rel = "stylesheet" type = "text/css" href = "CSS/Style.css">

</head>

<body>

	<form action="log-in.php" id = "Login_Form" method="POST">


	  <div class="container">
	    <label><b>Username</b></label>
	    <input type="text" placeholder="Enter Username" name="Username" autocomplete="off" required>

	    <label><b>Password</b></label>
	    <input type="password" placeholder="Enter Password" name="Password" autocomplete="off" required>

	    <button type="submit" form = "Login_Form" >Login</button>

	  </div>


	</form>


</body>
</html>


log-in
<?php
	include 'Database/Database.php';
	session_start();

	$Username = $_POST['Username'];
	$Password = $_POST['Password'];
	echo $Username . " - " .$Password;
	$sql = "SELECT Account_ID, Acc_Username, Acc_Password
				FROM Account
					WHERE Acc_Username = '$Username' AND Acc_Password = '$Password' ";
	$result = mysqli_query($conn, $sql);
	if(!$result){
		  echo 'Could not run query: ' . mysqli_error();
          $message = "Login error. Please try again. ";
	      echo "<script type='text/javascript'>
								alert('$message');
								window.location.href= 'login.php';
				  </script>";
		  exit(0);
	}
	if($result){
		$row =  mysqli_fetch_assoc($result);
		if($row > 0){
			echo "Login Success";
		} else {
		  $message = "Invalid username or password. ";
	      echo "<script type='text/javascript'>
								alert('$message');
								window.location.href= 'login.php';
				  </script>";
		  exit(0);
		}
	}
?>

<?php
session_start();
header("location:index.php");
?>


index
<!DOCTYPE html>

<html>
<Title> index </Title>

<head>
<link rel = "stylesheet" type = "text/css"  href= "css/indexstyle.css">
</head>

<body class = "page2body">
<header>
<h1>aa<h1>
</header>

<section><h1>  </h1><section>

<nav><p></p></nav>

<article><p></p></article>

<aside><p></p></aside>

<article></article>


<footer><h1>1111</h1>

</footer>


</body>


</html>


database

<?php
	$servername = "localhost";
	$username = "root";
	$password = "";
	$dbname = "exam";//Database name

	// Create connection
	$conn = new mysqli($servername, $username, $password,$dbname);

// Check connection
	try{
		if ($conn->connect_error) {
  		  die("Connection failed: " . $conn->connect_error);
		}
//		echo "Connected successfully </br>";
	} catch (Exception $e){
		echo "Error connection";

	}
?>


sql
CREATE TABLE Account (
    Account_ID INT  PRIMARY KEY NOT NULL AUTO_INCREMENT,
    Acc_Fname VARCHAR (50) NOT NULL,
    Acc_Lname VARCHAR (50) NOT NULL,
    Acc_MI VARCHAR (50) NOT NULL,
    Acc_Username VARCHAR (50) NOT NULL,
    Acc_Password VARCHAR (50) NOT NULL
    );


index
.page2body{
padding-top: 0px;

}
*{
box-sizing: border-box;
}

header {
	height:125px;
	padding: 1em 0em 1em 0em;
	background-color:#660000;
	text-align:center;
	font-size: 35px;
	color: white;

}

nav {
	float:left;
	width:20%;
	height: 400px;
	background-color: #6bc8ff;
	border : 5px solid #9e8fa3;


}
article{
	float: left;
	width: 60%;
	height: 200px;
	background-color:#9933ff;
	border: 5px solid #ff6633;


}
aside {
	float: right;
	width: 20%;
	height: 400px;
	background-color: #ccff33;
	border: 5px solid #ff0000;

}

section: after{
	content:"";
	display:table;
	clear:both
	background-color: #ff0000;


}

footer{
	padding: 2em 2em 2em 2em;
	background-color: #6bc8ff;
	text-align: center;
	height: 125px;


}

@media(max-width: 600px){
	nav, article, aside {
		width: 100%;


	}

}


login style

body{
	background-color: #6bc8ff;
	padding-top: 50px;
	text-align: center;
	color: #56636b;
}

form{
	display: inline-block;
	padding-top:20px;
	width: 300px;
	height: 400px;
	background-color: #e8f2f2;

}

input[type=text],
input[type=password]
{
	width: 100%;
	padding: 12px 20px;
	margin: 8px 0;
	display: line-block;
	border: 1px solid #ccc;
	box-sizing: border-box;


}

button{
	background-color: #1ea8ff;
	padding: 14px 20px;
	margin: 8px0;
	border: none;
	cursor: pointer;
	width: 100%;


}

button:hover{
	opacity: 0:8;


}
.container{
	padding: 16px;

}