Forgot password AND CSS Stylesheets

Find the given code below for forgot password the part the student section. Here the student will be able to find the new password if he/she forgot the password.

Save the code in new file with name "forgot-password.php".


<?php
    include"../scripts/validaitons.php";
    $email="";
    $invalid="";
    $stats=true;
    if(isset($_POST['submit']))
    {
        if($_POST['emailid']=="")
        {
            $email="Please provide Email ID";
            $stats=validateEmail();
            if($stats==false)
            {
                $invalid="Please provide a valid Email ID";
            }
        }
    }
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en-US" lang="en-US">
<head>
      <title>Forgot Password</title>
      <link rel="STYLESHEET" type="text/css" href="../styles/student_forms.css" />
</head>
<body>

<!-- Form Code Start -->
<?php include("header.php"); ?>
<div id='student_forms' >
    <form name="forgot_password" method='post' accept-charset='UTF-8'>
    <fieldset>
    <legend>Forgot Password</legend>
    <div class='required'>* Required Fields :</div>
    <div class="container"><span class='required'>*<span>
        <label class='labels'>Your Email :</label></br>
        <input type="text" name="emailid" maxlength="50">
        <div class='required' align="right"><?php echo $email; echo $invalid; ?></div>
        <div class='short_msg'>A link to reset your password will be sent to the registered email address.</div>
    <input type="submit" name="submit" value="Submit"/></div>
    </fieldset>
    </form>
</div>
<?php include("footer.php"); ?>
</body>
</html>




=========================================================
Save the stylesheet with name "admission_form.css"


#admission_form select,
#admission_form option
{
    background-color : #ffff99;
}
#admission_form select
{
    font-family : Arial,  sans-serif;
    font-size: 0.7em;
    color : #000;
    padding : 2px;
    border : 1px solid #999;
    border-radius: 5px;
}
#admission_form legend
{
    font-family : Arial, sans-serif;
    font-size: 1.3em;
    font-weight:bold;
}
#admission_form .short_msg
{
    font-family : Arial, sans-serif;
    font-size: 0.7em;
    color:#333;
}
#admission_form fieldset
{
    border-style:ridge;
    border-width:10px;
    border-color:#98bf21;
    margin:auto;
    width: 230px;
    padding:20px;
    border:1px solid #ccc;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
}
#admission_form .labels
{
    font-family:Arial, sans-serif;
    font-size:0.8em;
    color:#333;
}
#admission_form input[type="text"],
#admission_form input[type="password"]
{
    font-family : Arial, Verdana, sans-serif;
    font-size: 0.8em;
    color : #000;
    padding : 3px;
    border : 1px solid #999;
    border-radius: 5px;
}
#admission_form .smallinput
{
    height:18px;
    width:100px;
}
#admission_form input[type="submit"]
{
    width:80px;
    height:30px;
    color : #009;
    background-color : #ffff99;
}
#admission_form input[type="text"],
#admission_form input[type="password"]
{
    background-color : #ffff99;
}

#admission_form .required
{
    font-family : Arial, sans-serif;
    font-size: 0.8em;
    color:#FF0000;
}
.mainDiv
{
    margin:auto;
    padding:20px;
    width: 800px;
    //height:200px;
    //border:red solid;
    border-radius: 10px;
}
.heading
{
    background:BROWN;
}
.divleft
{
    float:left; margin-right:20px;
}
.divright
{
    float:left; margin-right:20px;
}



===========================================================

Save the new file with name "student_forms.css" code is given below :

#student_forms legend
{
    font-family : Arial, sans-serif;
    font-size: 1.3em;
    font-weight:bold;
}
#student_forms .short_msg
{
    font-family : Arial, sans-serif;
    font-size: 0.7em;
    color:#333;
}
#student_forms fieldset
{
    border-style:ridge;
    border-width:10px;
    border-color:#98bf21;
    margin:auto;
    width: 440px;
    height:240px;
    padding:30px;
    border:1px solid #ccc;
    border-radius: 10px;
}
#student_forms .container
{
    margin-top:8px;
    margin-bottom:10px;
    float:right;
}
#admin_forms .containerleft
{
    margin-top:8px;
    margin-bottom:10px;
    float:right;
}
#student_forms .labels
{
    font-family:Arial, sans-serif;
    font-size:1em;
    color:#333;
}
#student_forms input[type="text"],
#student_forms input[type="password"]
{
    font-family : Arial, Verdana, sans-serif;
    font-size: 0.9em;
    color : #000;
    padding : 3px;
    border : 1px solid #999;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
}
#student_forms input[type="text"],
#student_forms input[type="password"]
{
    height:18px;
    width:220px;
}
#student_forms input[type="submit"]
{
    width:80px;
    height:30px;
    padding-left:0px;
}
#student_forms input[type="text"]:focus,
#student_forms input[type="password"]:focus
{
    color : #009;
    border : 1px solid #990000;
    background-color : #ffff99;
    font-weight:bold;
}

#student_forms .required
{
    font-family : Arial, sans-serif;
    font-size: 0.8em;
    color:#FF0000;
}
.mainDiv
{
    margin:auto;
    padding:20px;
    width: 800px;
    //height:200px;
    //border:red solid;
    border-radius: 10px;
}
.heading
{
    background:BROWN;
}



==========================================

Save the given code below with new file name "style.css"

/* Label */
samp
{
    width: 300px;
    padding-left: 20px;
    margin: 5px;
    float: left;
    text-align: left;
    font-family:Arial, sans-serif;
    font-size:1em;
    color:#333;
}
kbd
{
    width: 60px;
    padding-left: 20px;
    margin: 5px;
    float: left;
    text-align: left;
    font-family:Arial, sans-serif;
    font-size:1em;
    color:#333;
}
select
{
    margin: 5px;
    padding: 0px;
    float: left;
}
span
{
    width: 10px;
    padding-left: 20px;
    margin: 5px;
    float: left;
    text-align: left;
    font-family : Arial, sans-serif;
    font-size: 0.8em;
    color:#FF0000;
   
}
/* Input, Textarea */
input[type="text"]
{
    margin: 5px;
    padding: 0px;
    float: left;
}
pre
{
    margin: 5px;
    padding: 0px;
    float: left;
}
label
{
    font-family : Arial, sans-serif;
    font-size: 0.8em;
    color:#FF0000;
    float: left;
}
input[type="checkbox"]
{
    margin: 5px;
    padding: 0px;
    float: left;
}
/* BR */

br
{
    clear: left;
}
.required
{
    color:#FF0000;
}


===========================================

all stylesheet files must be save in given directory path "localhost/MyProject/styles/"

0 Comments:

Post a Comment