INTERNET18_19/reset.html at master · TeutaUkshini/INTERNET18_19 · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<html>
<head>
  <meta http-equiv="content-type" content="text/html"; charset="utf-8"/>
    <title>Login Form</title>
    <link href="reset.css"  rel="stylesheet" type="text/css"/>
    <link href="https://fonts.googleapis.com/css?family=Play" rel="stylesheet">
<style>
    #msg{
        visibility: hidden;
        min-width: 250px;
        background-color:yellow;
        color: #000;
        text-align: center;
        border-radius: 2px;
        padding: 16px;
        position: fixed;
        z-index: 1;
        right: 30%;
        top: 30px;
        font-size: 17px;
        margin-right: 30px;

    }


    #msg.show{
        visibility: visible;
        -webkit-animation;fadein 0.5s fadeout 0.5s 2.5s;
        animation: fadein 0.5,fadeout 0.5 2.5s;
    }
    @-webkkit-keyframes fadein
    {
        from{top: 0;opacity: 0;}
        to{top: 30px;opacity: 1;}
    }

    @keyframes fadein
    {
         from{top: 0;opacity: 0;}
        to{top: 30px;opacity: 1;}
    }

     @-webkkit-keyframes fadeout
     {
        from:  {top: 0;opacity: 1;}
        to{top: 30px;opacity: 0;}
    }

    @keyframes fadeout
    {
       from{top: 0;opacity: 1;}
        to{top: 30px;opacity: 0;}
    }


    </style>
    </head>
    <body>
    <div class="reset">
        <form>
        <h2 align="center" style="color: #fff;">Reset Password</h2>
            <input type="password" name="pass" placeholder="Old Password"><br><br>
            <input type="password" name="pass"
                   placeholder="New Password"><br><br>
         <input type="password" name="pass"
                   placeholder="Confirm Password"><br><br>
            <input type="button" value="Save" onclick="myFunction()"/><br><br>
            <a href="login.html" style="text-decoration: none;">Go Back to Home page</a><br><br>
            <div id="msg">Paswoord changed successfully!!!</div>
            <script>
            function myFunction(){
                var x = document.getElementById("msg");
                x.className="show";
                setTimeout(function(){x.className=
                x.className.replace("show","");},3000);}


            </script>
        </form>
        </div>


    </body>
</html>