-
Notifications
You must be signed in to change notification settings - Fork 131
/
Copy pathpasswordreset.html
148 lines (116 loc) · 4.46 KB
/
passwordreset.html
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
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0-11/css/all.min.css">
<link href="https://fonts.googleapis.com/css?family=Ubuntu:300,400&display=swap" rel="stylesheet">
<title>Log In</title>
<style>
body {
font-family: 'Ubuntu', sans-serif;
font-weight: 200;
}
h1 {
font-family: 'Ubuntu', sans-serif;
font-weight: 300;
font-size: 72px;
}
h4 {
font-family: 'Ubuntu', sans-serif;
font-weight: 300;
font-size: 32px;
}
.pass-changed {
border: thin #c4c4c4 solid;
border-radius: 6px 6px 6px 6px;
}
a {
color: #000;
}
a:hover {
text-decoration: none;
color: #000;
}
.btn-success {
background-color: #0ABAB5;
border: thin #0ABAB5 solid;
}
.btn-success:hover {
background-color: #0ABAB5;
border: thin #0ABAB5 solid;
}
.p-last {
line-height: 0.5px;
}
</style>
</head>
<body>
<div class="container">
<div class="clearfix mt-3">
<div class="float-left">
<a href="" class="navbar-brand"><img src="https://res.cloudinary.com/sgnolebagabriel/image/upload/v1570531368/Lancers_evgrmc.png" alt="logo"></a>
</div>
<div class="float-right">
</div>
</div>
<div class="col-md-6 offset-md-3 text-center pass-changed mt-5 pt-3 pb-3">
<h4><b>Password successfully reset!</b></h4>
<p>You will now be redirected to your dashboard</p>
<p>Click <a href="#">here</a> if you haven't been redirected in the next</p>
<p class="p-last">few seconds.</p>
</div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.15.0/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
</body>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.slim.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.15.0/umd/popper.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
<script>
const login = document.querySelector("#loginform");
const password = document.querySelector("#password").value;
const email = document.querySelector("#email").value;
// const passwordMessage = document.querySelector("#pmessage");
login.addEventListener("submit", function(e) {
e.preventDefault();
// passReg = /(?=.*\d)(?=.*[a-z])(?=.*[A-Z])\w{6,}/;
emailReg = /^(([^<>()\[\]\.,;:\s@\"]+(\.[^<>()\[\]\.,;:\s@\"]+)*)|(\".+\"))@(([^<>()[\]\.,;:\s@\"]+\.)+[^<>()[\]\.,;:\s@\"]{2,})$/i;
const passwordMessage = document.querySelector("#pmessage");
const emailMessage = document.querySelector("#emessage");
let validatePassword =function(){
passwordMessage.textContent = null;
passwordMessage.textContent = null;
let p = document.createElement(`p`);
p.classList.add("alert", "alert-warning");
p.textContent = "Please enter valid password. Letters and digits Only";
passwordMessage.appendChild(p);
console.log(p);
setTimeout(function () {
passwordMessage.remove();
}, 4000);
}
let validateEmail = function(){
emailMessage.textContent = null;
let p = document.createElement(`p`);
p.classList.add("alert", "alert-danger");
p.textContent = "Please enter a valid email";
emailMessage.appendChild(p);
console.log(p);
setTimeout(function () {
emailMessage.innerHTML = "";
}, 4000);
}
if (email === ""){
validateEmail()
}
if (password === "" ) {
validatePassword()
}
});
</script>
</html>
</html>