Acum este Mar Sep 25, 2018 9:07 pm

Login panel și forget password system realizat de Rațiu Raul

Despre programarea aplicațiilor web și nu numai, cu PHP, baze de date și altele.
Discutiile despre utilizarea si modificarea scripturilor se desfasoara in aria Webmaster.
Discuțiile despre proiectarea și optimizarea bazelor de date se desfășoară în aria Databases.
 
Mesaje: 113
Membru din: Mar Apr 07, 2015 11:40 am
Like-uri oferite: 0 time
Like-uri primite: 0 time

Login panel și forget password system realizat de Rațiu Raul

de Metin2Aztec » Mar Mar 15, 2016 2:13 pm

În acest articol am să vă prezint un panou Login și forget system (Sample) realizat de Rațiu Raul.

Prezentare:

login
Imagine
forget

Imagine

Să revenim la codurile utilizate pentru realizarea acestui panou.

index.html

Code: Select All Code
<html>
<head>
<title>Login by Ratiu Raul</title>
<link rel="stylesheet" href="css/main.css" />
<link rel="stylesheet" href="css/font-awesome.css" />
<meta charset="utf-8" />
</head>

<body>
<div class="container">
<img src="images/login_icon.png" />
<form action="login.php" method="POST">
<div class="login-id">
<input type="text" name="username" placeholder="Username"/>
</div>

<div class="login-pw">
<input type="password" name="password" placeholder="Password"/>
</div>
<input type="submit" name="Login" value="Login" class="btn-login"/>
</form>
<a href="forget.html" class="forget">Forget password?</a><br>
</div>
</body>


Login.php

Code: Select All Code
<?php
$localhost = "";
$user = "";
$pass = "";
$db = "user";

$select = mysql_connect($localhost, $user, $pass, $db) or die ("Error mysql can't connect".mysql_error());
mysql_select_db($db);
if(isset($_POST["Login"]))
{
$username = $_POST['username'];
$password = $_POST['password'];
$sql = "SELECT * FROM user WHERE username='$username' && password='$password'";
$res = mysql_query($sql);
if(mysql_num_rows($res) == 1){
echo "Login succesfuly";
}else{
echo "No, try again.";
}

}

?>


Forget.html

Code: Select All Code
<html>
<head>
<title>Login by Ratiu Raul</title>
<link rel="stylesheet" href="css/main.css" />
<link rel="stylesheet" href="css/font-awesome.css" />
<meta charset="utf-8" />
</head>

<body>
<div class="container">
<img src="images/login_icon.png" />
<form action="forget.php" method="POST">
<div class="email-id">
<input type="text" name="email" placeholder="Email"/>
</div>
<input type="submit" name="Reset" value="Reset" class="btn-login"/>
</form>
</div>
</body>
</html>

Forget.php

Code: Select All Code
<?php
$localhost = "";
$user = "";
$pass = "";
$db = "user";

$select = mysql_connect($localhost, $user, $pass, $db) or die ("Error mysql can't connect".mysql_error());
mysql_select_db($db);
if(isset($_POST["Reset"]))
{
$email = $_POST['email'];
$sql = "SELECT * FROM user WHERE email='".$email."'";
$sql1 = mysql_query($sql);
$test = mysql_num_rows($sql1);
if($test != 0)
{
$chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789!@#$%&*_";
$password = substr( str_shuffle( $chars ), 0, 8 );
mysql_query("UPDATE user SET password='$password' WHERE email='$email'");
echo "cereale new password is:" .$password;
}else{
echo "Email doesn't exits";
}
}
?>


Partea css vine cu font, "FontAwesome" icon le găsiți la download.

main.css

Code: Select All Code
body{
margin: 0px auto;
background-image:url(../images/background.jpg);
background-repeat:no-repeat;
background-size:100%;
}
.container{
width: 40%;
height: 50%;
background-color: rgba(0, 81, 119, 0.4);
text-align:center;
margin: 0px auto;
margin-top:10%;
border-radius: 7px;
}
.container img{
width: 100px;
height:100px;
margin-top:-5%;
}
input{
border:none;
border-radius: 5px;
height:10%;
width:40%;
margin-bottom:20px;
padding-left:5%;
}
input:focus{
box-shadow: 0px 0px 1px 1px rgb(0, 255, 255);
}
.login-id::before{
content: "\f007";
position: absolute;
color: rgba(0, 81, 119, 0.5);
font-family: "FontAwesome";
font-size: 20px;
padding-top:5px;
padding-left:3px;

}
.login-pw::before{
content: "\f023";
position: absolute;
color: rgba(0, 81, 119, 0.5);
font-family: "FontAwesome";
font-size: 20px;
padding-top:5px;
padding-left:3px;

}
.btn-login{
margin-top:10px;
width: 15%;
padding: 5px;
color: #fff;
background-color: rgba(0, 81, 119, 0.5);
border-radius: 5px;
border: none;
border-bottom: 3px solid rgb(0, 81, 119);

}
.forget{
font-family:Georgia, "Times New Roman", Times, serif;
color:#fff;
font-size:14px;
}
.email-id::before{
content: "\f0e0";
position: absolute;
font-family: "FontAwesome";
font-size: 20px;
padding-left: 3px;
padding-top: 5px;
}




Testare panou: http://www.ratiuraul.ro/proiecte/login
http://www.metin2aztec.ro
Cel mai frumos server din Romania

Înapoi la Scripturi și tutoriale web

Cine este conectat

Utilizatorii ce navighează pe acest forum: Niciun utilizator înregistrat şi 1 vizitator