From d2e285091e1b9d05aad07180c359d5f79cd5195e Mon Sep 17 00:00:00 2001 From: Simranjit Kaur Date: Tue, 30 Sep 2025 17:49:37 +0530 Subject: [PATCH] added favicon and added 2-3 features more --- password-generator/index.html | 16 +++++++++++++--- password-generator/script.js | 15 +++++++++++++-- password-generator/style.css | 11 +++++++++-- 3 files changed, 35 insertions(+), 7 deletions(-) diff --git a/password-generator/index.html b/password-generator/index.html index d28270e..f9a4a33 100644 --- a/password-generator/index.html +++ b/password-generator/index.html @@ -4,8 +4,13 @@ - + Password Generator + +
@@ -42,7 +47,12 @@ + +
- + + - + \ No newline at end of file diff --git a/password-generator/script.js b/password-generator/script.js index 4f2f9d2..8110ff9 100644 --- a/password-generator/script.js +++ b/password-generator/script.js @@ -1,4 +1,4 @@ -const resultEl = document.getElementById('result') + const resultEl = document.getElementById('result') const lengthEl = document.getElementById('length') const uppercaseEl = document.getElementById('uppercase') const lowercaseEl = document.getElementById('lowercase') @@ -6,6 +6,7 @@ const numbersEl = document.getElementById('numbers') const symbolsEl = document.getElementById('symbols') const generateEl = document.getElementById('generate') const clipboardEl = document.getElementById('clipboard') +const clear = document.getElementById('clear'); const randomFunc = { lower: getRandomLower, @@ -20,7 +21,14 @@ clipboardEl.addEventListener('click', () => { return; } navigator.clipboard.writeText(password); - alert('Password copied to clipboard!') + + const icon = clipboardEl.querySelector("i"); + icon.className = "fas fa-check"; + + setTimeout(() => { + icon.classList.remove("fa-check"); + icon.classList.add("fa-clipboard"); + }, 2000); }) generateEl.addEventListener('click', () => { @@ -54,6 +62,9 @@ function generatePassword(lower, upper, number, symbol, length) { return finalPassword } +clear.addEventListener('click' , ()=>{ + resultEl.innerText = ""; +}); function getRandomLower() { return String.fromCharCode(Math.floor(Math.random() * 26) + 97) } diff --git a/password-generator/style.css b/password-generator/style.css index 1e017e0..4f45238 100644 --- a/password-generator/style.css +++ b/password-generator/style.css @@ -1,4 +1,3 @@ -@import url('https://fonts.googleapis.com/css?family=Muli&display=swap'); * { box-sizing: border-box; @@ -27,7 +26,8 @@ h2 { background-color: #23235b; box-shadow: 0px 2px 10px rgba(255, 255, 255, 0.2); padding: 20px; - width: 350px; + width: 380px; + height: 460px; max-width: 100%; } @@ -77,6 +77,9 @@ h2 { display: block; width: 100%; } +.btn:hover{ + background-color: #48489a; +} .setting { display: flex; @@ -84,3 +87,7 @@ h2 { align-items: center; margin: 15px 0; } +#clear{ + margin-top: 1rem; +} +