Skip to content

Commit 19629ff

Browse files
Merge pull request #4 from akashnai/akkicode
password generator using bootstrap and javascript
2 parents eb92610 + 3846884 commit 19629ff

3 files changed

Lines changed: 85 additions & 0 deletions

File tree

Password Generator/index.html

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
6+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
7+
<title>Password Generator</title>
8+
<link rel="stylesheet" href="style.css">
9+
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-iYQeCzEYFbKjA/T2uDLTpkwGzCiq6soy8tYaI1GyVh/UjpbCx/TYkiZhlZB6+fzT" crossorigin="anonymous">
10+
</head>
11+
<body>
12+
<div class="container my-5 mx-auto">
13+
<h1>Password Generator</h1>
14+
<!-- <input type="text" id="password"> -->
15+
<div class="input-group mb-3">
16+
<input type="text" id="password" class="form-control" placeholder="Generated Password">
17+
<button class="btn btn-outline-primary" onclick="generatePassword()" type="button" id="button-addon2">Generate</button>
18+
<button class="btn btn-outline-danger" onclick="copyPassword()" type="button">Copy</button>
19+
</div>
20+
21+
<label for="customRange2" class="form-label">Password Length</label>
22+
<input type="range" class="form-range" min="6" max="15" id="passLength">
23+
24+
<!-- <p class="range"></p> -->
25+
26+
27+
28+
29+
<!-- <button type="button" class="btn btn-primary" onclick="generatePassword()">Generate Password</button>
30+
<button type="button" class="btn btn-warning" onclick="copyPassword()">Copy Password</button> -->
31+
</div>
32+
33+
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.1/dist/js/bootstrap.bundle.min.js" integrity="sha384-u1OknCvxWvY5kfmNBILK2hRnQC3Pr17a+RTT6rIHI7NnikvbZlHgTPOOmMi466C8" crossorigin="anonymous"></script>
34+
<script src="index.js"></script>
35+
</body>
36+
</html>

Password Generator/index.js

Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
var password = document.getElementById('password')
2+
// var passLength = document.getElementById('passLength')
3+
4+
// console.log(passLength.value)
5+
6+
function generatePassword(){
7+
var chars = "0123456789abcdefghijklmnopqrstuvwxyz!@#$%^&*()ABCDEFGHIJKLMNOPQRSTUVWXYZ";
8+
// var passwordLength = 12;
9+
10+
11+
passwordLength = passLength.value
12+
13+
var password = ""
14+
15+
for(var i=0; i<=passwordLength; i++){
16+
var randomNumber = Math.floor(Math.random() * chars.length)
17+
// password += chars.substring(randomNumber, randomNumber + 1)
18+
password += chars.charAt(randomNumber)
19+
}
20+
document.getElementById("password").value = password;
21+
}
22+
23+
function copyPassword() {
24+
var copyText = document.getElementById('password')
25+
copyText.select()
26+
document.execCommand('copy')
27+
}

Password Generator/style.css

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
/* *{
2+
margin: 0;
3+
padding: 0;
4+
background-color: azure;
5+
}
6+
7+
.box{
8+
background-color: rgb(215, 79, 215);
9+
width: 500px;
10+
height: 500px;
11+
margin: 100px auto;
12+
box-shadow: 100px;
13+
}
14+
15+
input{
16+
padding: 20px;
17+
height: 20px;
18+
width: 50%;
19+
border-radius: 10px;
20+
}
21+
22+
*/

0 commit comments

Comments
 (0)