login page ui

sudonitin · Mar 30, 2019 · b98cf1c · b98cf1c
1 parent d640d32
commit b98cf1c
Show file tree

Hide file tree

Showing 3 changed files with 112 additions and 0 deletions.
diff --git a/login.php b/login.php
@@ -0,0 +1,30 @@
+<?php include('server.php'); ?>
+<html>
+<head>
+  <title>Login Page</title>
+  <link href="https://fonts.googleapis.com/css?family=Oswald" rel="stylesheet">
+  <!-- Latest compiled and minified CSS -->
+<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/css/bootstrap.min.css">
+
+<!-- jQuery library -->
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
+
+<!-- Latest compiled JavaScript -->
+<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.0/js/bootstrap.min.js"></script>
+<link rel="stylesheet" type="text/css" href="main.css">
+</head>
+<body style="background-image:linear-gradient(to bottom,rgb(222,57,246),rgb(91,200,221))">
+
+  <div class="loginbox">
+        <h1>Login</h1>
+        <form action="" method="post">
+            <input type="text" placeholder="Username" id="username" name="username" required="required">
+            <input type="password" placeholder="Password" id="password" name="password" required="required">
+            <input type="submit" name="login" value="Login" onclick="display_errors()">
+        </form>
+
+    </div>
+
+
+</body>
+</html>
diff --git a/main.css b/main.css
@@ -0,0 +1,58 @@
+
+
+body{
+    margin: 0;
+    padding: 0;
+    background-size: cover;
+    background-position: center;
+    font-family: 'Oswald', sans-serif;
+}
+
+.loginbox{
+    width: 320px;
+    height: 360px;
+    background: #fff;
+    border-radius:5px;
+    color: #000;
+    top: 50%;
+    left: 50%;
+    position: absolute;
+    transform: translate(-50%,-50%);
+    box-shadow: 10px 10px 5px grey;
+    box-sizing: border-box;
+    padding: 70px 30px;
+}
+h1{
+    margin: 0;
+    padding: 0 0 20px;
+    text-align: center;
+    font-size: 22px;
+}
+
+
+.loginbox input{
+    width: 100%;
+    margin-bottom: 20px;
+}
+
+.loginbox input[type="text"], input[type="password"]
+{
+    border:none;
+    border-bottom: 1px solid black;
+    background: transparent;
+    outline: none;
+    height: 40px;
+    color: #000;
+    font-size: 16px;
+}
+.loginbox input[type="submit"]
+{
+    border: none;
+    border-radius: 5px;
+    outline: none;
+    height: 40px;
+    background-image:linear-gradient(to right,rgb(222,57,246),rgb(91,200,221));
+    color: #fff;
+    font-size: 18px;
+    box-shadow: 5px 5px 5px grey;
+}
diff --git a/server.php b/server.php
@@ -0,0 +1,24 @@
+<?php
+session_start();
+$db=mysqli_connect('localhost','root','','bitcamp');
+echo '<script> var err=[];</script>';
+if(isset($_POST['login']))
+{
+    $username=mysqli_real_escape_string($db,$_POST['username']);
+    $password1=mysqli_real_escape_string($db,$_POST['password']);
+    $password=md5($password1);
+    $data="SELECT * FROM admin WHERE username='$username' AND password='$password1'";
+    $result=mysqli_query($db,$data);
+    echo mysqli_num_rows($result)==1;
+    if(mysqli_num_rows($result)==1)
+    {
+        $row=mysqli_fetch_array($result,MYSQLI_NUM);
+        //header('location:homepage.php');
+        echo '<script>alert("successfully logged in");</script>';
+    }
+    else
+    {
+        $invalid = "invalid username/password";
+        echo '<script>alert("Invalid username/password");</script>';
+    }
+}