diff --git a/Capcha Generator/index.html b/Capcha Generator/index.html
index 0fa730b9..ee1f3e18 100644
--- a/Capcha Generator/index.html
+++ b/Capcha Generator/index.html
@@ -1,91 +1,43 @@
-
-
-
-
-
-
-
-
+
+
diff --git a/Capcha Generator/scripts/script.js b/Capcha Generator/scripts/script.js
index dd84cffb..7af13883 100644
--- a/Capcha Generator/scripts/script.js
+++ b/Capcha Generator/scripts/script.js
@@ -3,74 +3,76 @@ const captchaTextBox = document.querySelector(".captch_box input");
const refreshButton = document.querySelector(".refresh_button");
const captchaInputBox = document.querySelector(".captch_input input");
const message = document.querySelector(".message");
-const submitButton = document.querySelector(".button");
+const submitButton = document.querySelector(".button button");
+const difficultySelect = document.querySelector("#difficulty");
-// Variable to store generated captcha and captcha history
+// Variable to store generated captcha
let captchaText = null;
-const captchaHistory = [];
// Function to generate captcha
const generateCaptcha = () => {
- const randomString = Math.random().toString(36).substring(2, 7);
+ let captchaLength;
+
+ switch (difficultySelect.value) {
+ case "medium":
+ captchaLength = 7;
+ break;
+ case "hard":
+ captchaLength = 10;
+ break;
+ case "easy":
+ default:
+ captchaLength = 5;
+ break;
+ }
+
+ const randomString = Math.random().toString(36).substring(2, 2 + captchaLength);
const randomStringArray = randomString.split("");
const changeString = randomStringArray.map((char) => (Math.random() > 0.5 ? char.toUpperCase() : char));
captchaText = changeString.join(" ");
captchaTextBox.value = captchaText;
- captchaHistory.unshift(captchaText); // Add generated captcha to history
+ console.log(captchaText);
};
-// Function to refresh captcha on button click
const refreshBtnClick = () => {
generateCaptcha();
captchaInputBox.value = "";
captchaKeyUpValidate();
};
-// Function to validate captcha input on keyup event
const captchaKeyUpValidate = () => {
- submitButton.classList.toggle("disabled", !captchaInputBox.value);
- if (!captchaInputBox.value) message.classList.remove("active");
+ const isInputEmpty = !captchaInputBox.value.trim();
+ submitButton.parentElement.classList.toggle("disabled", isInputEmpty);
+
+ if (isInputEmpty) {
+ message.classList.remove("active");
+ }
};
-// Function to handle submission of captcha
+// Validation
const submitBtnClick = () => {
- captchaText = captchaText.split("").filter((char) => char !== " ").join("");
+ captchaText = captchaText
+ .split("")
+ .filter((char) => char !== " ")
+ .join("");
message.classList.add("active");
// Check if the entered captcha text is correct or not
if (captchaInputBox.value === captchaText) {
- swal("Verification Success..","Hooray!","success");
+ swal("Verification Success..", "Hooray!", "success");
message.innerText = "Entered captcha is correct";
message.style.color = "#1940a5";
} else {
- swal("Incorrect!","Please enter the correct captcha.","warning")
+ swal("Incorrect!", "Please enter the correct captcha.", "warning");
message.innerText = "Entered captcha is not correct";
message.style.color = "#FF2525";
}
- updateCaptchaHistory(); // Update captcha history after submission
-};
-
-// Function to update captcha history
-const updateCaptchaHistory = () => {
- const historyList = document.getElementById("captchaHistoryList");
- historyList.innerHTML = "";
- captchaHistory.forEach((captcha) => {
- const listItem = document.createElement("li");
- listItem.textContent = captcha;
- historyList.appendChild(listItem);
- });
-};
-
-// Function to play audio captcha
-const playAudioCaptcha = () => {
- const audio = new Audio('audio/captcha.mp3');
- audio.play();
};
-// Add event listeners for the refresh button, captchaInputBox, submit button, and audio captcha button
+// Add event listeners for the refresh button, captchaInputBox, submit button
refreshButton.addEventListener("click", refreshBtnClick);
captchaInputBox.addEventListener("keyup", captchaKeyUpValidate);
submitButton.addEventListener("click", submitBtnClick);
-document.querySelector(".audio-captcha button").addEventListener("click", playAudioCaptcha);
+difficultySelect.addEventListener("change", generateCaptcha);
// Generate a captcha when the page loads
generateCaptcha();
diff --git a/Capcha Generator/src/style.css b/Capcha Generator/src/style.css
index 4cd2b0ab..30854bd5 100644
--- a/Capcha Generator/src/style.css
+++ b/Capcha Generator/src/style.css
@@ -1,32 +1,30 @@
-@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap");
+@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600&display=swap");
+
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: "Poppins", sans-serif;
}
+
body {
height: 100vh;
display: flex;
align-items: center;
justify-content: center;
background-image: url(bg.jpg);
- background-size: cover;
- background-position: -1px;
-
}
+
.container {
position: relative;
max-width: 300px;
- width: 300px;
- border-top-left-radius: 15px;
- border-top-right-radius: 15px;
- border-bottom-right-radius: 15px;
- border: 1px solid #1e1b18;
- padding: 15px 25px 25px;
- background: rgba(255, 255,255, 0.4);
+ width: 100%;
+ border-radius: 12px;
+ padding: 20px 30px 30px; /* Increased padding */
+ background: #fff;
box-shadow: 0 5px 10px rgba(0, 0, 0, 0.1);
}
+
header {
color: #333;
margin-bottom: 20px;
@@ -34,50 +32,32 @@ header {
font-weight: 600;
text-align: center;
}
+
.input_field {
position: relative;
- height: 45px;
- margin-top: 15px;
+ height: 50px; /* Increased height */
+ margin-top: 20px; /* Increased top margin */
width: 100%;
}
-#inputfield{
- background-color: #0d5dd5;
- color: #fff;
- transition: 0.4s;
- font-size: 13px;
- border: 1px solid #333;
-}
-#inputfield:hover{
- background-color: #06f;
- color: #fff;
- border: 1px solid #333;
- offset: 20px;
-}
+
.refresh_button {
position: absolute;
top: 50%;
right: 10px;
transform: translateY(-50%);
- background: #fcc4f4;
- height: 30px;
- width: 30px;
+ background: #1940a5;
+ height: 40px; /* Increased height */
+ width: 40px; /* Increased width */
border: none;
- border-radius: 50%;
- color: #2c2926;
+ border-radius: 4px;
+ color: #fff;
cursor: pointer;
- border: 1px solid #fcc4f4;
- box-shadow: 1px 2px 3px rgba(0,0,0,0.3);
}
+
.refresh_button:active {
transform: translateY(-50%) scale(0.98);
}
-#refbut{
- transition: 0.4s;
-}
-#refbut:hover{
- box-shadow: 1px 2px 3px rgba(0,0,0,0.6);
-
-}
+
.input_field input,
.button button {
height: 100%;
@@ -85,70 +65,60 @@ header {
outline: none;
border: none;
border-radius: 8px;
+ font-size: 18px; /* Increased font size */
}
+
.input_field input {
padding: 0 15px;
border: 1px solid rgba(0, 0, 0, 0.1);
}
+
.captch_box input {
color: #6b6b6b;
- font-size: 22px;
+ font-size: 28px; /* Increased font size for captcha display */
pointer-events: none;
}
+
.captch_input input:focus {
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.08);
}
-#captchaOutput{
- background: rgba(255, 175, 250, 0.457);
- color: #555;
-}
-#captchaInput{
- transition: 0.4s;
- background: rgba(255, 255, 255, 0.457);
- border: 1px solid #444;
-}
-#captchaInput:hover{
- border: 1px solid #444;
- background-color: white;
-}
-.captcha-history{
- margin-top: 15px;
- margin-bottom: 15px;
- font-size: 14px;
- color: #333;
-}
+
.message {
- font-size: 14px;
- margin: 14px 0;
+ font-size: 16px; /* Increased font size */
+ margin: 20px 0; /* Increased margin */
color: #1940a5;
display: none;
}
+
.message.active {
display: block;
}
+
.button button {
background: #1940a5;
color: #fff;
cursor: pointer;
user-select: none;
}
+
.button button:active {
transform: scale(0.99);
}
+
.button.disabled {
opacity: 0.6;
pointer-events: none;
}
-#audcaptch{
- padding: 7px;
- border: 1px solid #333;
- border-radius: 6px;
- font-size: 10px;
- color: #333;
- background: rgba(252, 196, 244, 0.7);
- transition: 0.4s;
+
+.difficulty select {
+ height: 50px; /* Increased height */
+ font-size: 18px; /* Increased font size */
+ border-radius: 8px;
+ border: 1px solid rgba(0, 0, 0, 0.1);
}
-#audcaptch:hover{
- background: rgba(252, 196, 244, 0.8);
- box-shadow: 1px 2px 3px #1940a5;
+
+.error_message {
+ font-size: 14px;
+ color: red;
+ margin-top: 10px;
}
diff --git a/Movie Finder/index.html b/Movie Finder/index.html
index 8cb310d4..29fa0206 100644
--- a/Movie Finder/index.html
+++ b/Movie Finder/index.html
@@ -8,35 +8,31 @@
-
+
-
-
+
-
-
+
+
Search Movie:
-
-
-
-
+
+
-