diff --git a/Games/Guess_The_Weapon/Asset/AA-12.png b/Games/Guess_The_Weapon/Asset/AA-12.png new file mode 100644 index 0000000000..955c91c596 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/AA-12.png differ diff --git a/Games/Guess_The_Weapon/Asset/AK-47.jpg b/Games/Guess_The_Weapon/Asset/AK-47.jpg new file mode 100644 index 0000000000..eaa0f1b1c6 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/AK-47.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/AKM.jpg b/Games/Guess_The_Weapon/Asset/AKM.jpg new file mode 100644 index 0000000000..9dfb0b8bb8 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/AKM.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/AS50.jpg b/Games/Guess_The_Weapon/Asset/AS50.jpg new file mode 100644 index 0000000000..aafb223c87 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/AS50.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/AUG.png b/Games/Guess_The_Weapon/Asset/AUG.png new file mode 100644 index 0000000000..5df1fa5fb1 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/AUG.png differ diff --git a/Games/Guess_The_Weapon/Asset/AWM.png b/Games/Guess_The_Weapon/Asset/AWM.png new file mode 100644 index 0000000000..6e8ec14009 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/AWM.png differ diff --git a/Games/Guess_The_Weapon/Asset/Banelli.jpg b/Games/Guess_The_Weapon/Asset/Banelli.jpg new file mode 100644 index 0000000000..5c8f062840 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/Banelli.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/BarretM82.jpg b/Games/Guess_The_Weapon/Asset/BarretM82.jpg new file mode 100644 index 0000000000..4db10bc1aa Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/BarretM82.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/China_Lake.jpeg b/Games/Guess_The_Weapon/Asset/China_Lake.jpeg new file mode 100644 index 0000000000..f8db6ada71 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/China_Lake.jpeg differ diff --git a/Games/Guess_The_Weapon/Asset/Daewoo_K3.png b/Games/Guess_The_Weapon/Asset/Daewoo_K3.png new file mode 100644 index 0000000000..eeabd0a595 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/Daewoo_K3.png differ diff --git a/Games/Guess_The_Weapon/Asset/DesertEagle.jpg b/Games/Guess_The_Weapon/Asset/DesertEagle.jpg new file mode 100644 index 0000000000..722a6616fa Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/DesertEagle.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/F2000.jpeg b/Games/Guess_The_Weapon/Asset/F2000.jpeg new file mode 100644 index 0000000000..a7e6d60314 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/F2000.jpeg differ diff --git a/Games/Guess_The_Weapon/Asset/FAMAS.jpg b/Games/Guess_The_Weapon/Asset/FAMAS.jpg new file mode 100644 index 0000000000..54c30afd2a Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/FAMAS.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/FIM92-Stinger.jpg b/Games/Guess_The_Weapon/Asset/FIM92-Stinger.jpg new file mode 100644 index 0000000000..b47d25c721 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/FIM92-Stinger.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/KAR98K.png b/Games/Guess_The_Weapon/Asset/KAR98K.png new file mode 100644 index 0000000000..c07c1d0457 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/KAR98K.png differ diff --git a/Games/Guess_The_Weapon/Asset/LAW80.jpg b/Games/Guess_The_Weapon/Asset/LAW80.jpg new file mode 100644 index 0000000000..b845556c19 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/LAW80.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/M16A4.png b/Games/Guess_The_Weapon/Asset/M16A4.png new file mode 100644 index 0000000000..9dbe33db8b Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/M16A4.png differ diff --git a/Games/Guess_The_Weapon/Asset/M249.jpg b/Games/Guess_The_Weapon/Asset/M249.jpg new file mode 100644 index 0000000000..dbb42d27e7 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/M249.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/M4Carbin.jpg b/Games/Guess_The_Weapon/Asset/M4Carbin.jpg new file mode 100644 index 0000000000..995f6c806d Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/M4Carbin.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/M79.png b/Games/Guess_The_Weapon/Asset/M79.png new file mode 100644 index 0000000000..b76888c51d Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/M79.png differ diff --git a/Games/Guess_The_Weapon/Asset/MG42.jpg b/Games/Guess_The_Weapon/Asset/MG42.jpg new file mode 100644 index 0000000000..6e7713842e Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/MG42.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/Mossberg930.jpg b/Games/Guess_The_Weapon/Asset/Mossberg930.jpg new file mode 100644 index 0000000000..0a3b0d1ecf Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/Mossberg930.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/P-90.jpg b/Games/Guess_The_Weapon/Asset/P-90.jpg new file mode 100644 index 0000000000..f6af4ad174 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/P-90.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/PKP.jpg b/Games/Guess_The_Weapon/Asset/PKP.jpg new file mode 100644 index 0000000000..cfb3325f16 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/PKP.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/Panzerschreck.png b/Games/Guess_The_Weapon/Asset/Panzerschreck.png new file mode 100644 index 0000000000..87cb18b509 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/Panzerschreck.png differ diff --git a/Games/Guess_The_Weapon/Asset/RPG-7.png b/Games/Guess_The_Weapon/Asset/RPG-7.png new file mode 100644 index 0000000000..1a6ba58be5 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/RPG-7.png differ diff --git a/Games/Guess_The_Weapon/Asset/SA80.jpg b/Games/Guess_The_Weapon/Asset/SA80.jpg new file mode 100644 index 0000000000..f585598bf5 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/SA80.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/SCARL.jpg b/Games/Guess_The_Weapon/Asset/SCARL.jpg new file mode 100644 index 0000000000..f117e240f5 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/SCARL.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/SPAS12.jpg b/Games/Guess_The_Weapon/Asset/SPAS12.jpg new file mode 100644 index 0000000000..04d6b10bab Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/SPAS12.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/SVD_Dragunov.jpg b/Games/Guess_The_Weapon/Asset/SVD_Dragunov.jpg new file mode 100644 index 0000000000..a7a7eea655 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/SVD_Dragunov.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/XM8.jpg b/Games/Guess_The_Weapon/Asset/XM8.jpg new file mode 100644 index 0000000000..6fa2b2380b Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/XM8.jpg differ diff --git a/Games/Guess_The_Weapon/Asset/rpd.jpg b/Games/Guess_The_Weapon/Asset/rpd.jpg new file mode 100644 index 0000000000..6a47a5f488 Binary files /dev/null and b/Games/Guess_The_Weapon/Asset/rpd.jpg differ diff --git a/Games/Guess_The_Weapon/Image/icon.png b/Games/Guess_The_Weapon/Image/icon.png new file mode 100644 index 0000000000..e277f8a71d Binary files /dev/null and b/Games/Guess_The_Weapon/Image/icon.png differ diff --git a/Games/Guess_The_Weapon/README.md b/Games/Guess_The_Weapon/README.md new file mode 100644 index 0000000000..f8375f1ad6 --- /dev/null +++ b/Games/Guess_The_Weapon/README.md @@ -0,0 +1,40 @@ +# **Guess The Weapon** + +--- + +
+ +## **Description 📃** + +It is a weapon Guessing Game. By this you can came to about lots of new weapon from WWII,PUBG,COD etc. + +- + +## **functionalities 🎮** + +You will get five weapons to guess. You have to guess the weapon by looking at the image of the weapon. You will get 3 chances to guess the weapon. If you guess the weapon correctly you will get 3 points. If you guess the weapon incorrectly you will lose 1 points. If you guess the weapon correctly in the first chance you will get 3 points. If you guess the weapon correctly in the second chance you will get 2 points. If you guess the weapon correctly in the third chance you will get 1 points. If you guess the weapon incorrectly in the first chance you will lose 1 points. If you guess the weapon incorrectly in the second chance you will lose 1 points. If you guess the weapon incorrectly in the third chance you will lose 1 point and get 0 point. +
+ +## **How to play? 🕹ī¸** + +First click the start button. Then you will get five weapons to guess. There will be also a mask over it. You have to identify them by looking at the small portion of the image. You can always show more portion by clicking into the hint button but you will lose one point each time. Again for each wrong ans you will lose one point. If you give wrong answer each time you will get point zero and move to the next question. After ending you can see your score. You can also play again by clicking the play again button. + +- + +
+ +## **Screenshots 📸** + +
+![image](../../assets/images/Guess_The_Weapon.png) + +
+ +## **Working video 📹** + + + +
+ +## **Creator** +[Saikat Samanta](https://github.com/psykat1116) diff --git a/Games/Guess_The_Weapon/index.html b/Games/Guess_The_Weapon/index.html new file mode 100644 index 0000000000..add9a72971 --- /dev/null +++ b/Games/Guess_The_Weapon/index.html @@ -0,0 +1,52 @@ + + + + + + + + + Guess The Weapon - A Game To Get Familiar With Weapons + + +
+

Guess The Weapon

+

+ This is a guess game for guessing the correct name of the weapon. You + will given five images and You will get three chance and to identify it. + In each chance you can see a larger picture than before. +

+ +
+
+
+
+ Weapon +
+ +
+ + +
+
+
+

Awesome you are a Pro Player
Your score is 5

+ +
+ + + + diff --git a/Games/Guess_The_Weapon/info.js b/Games/Guess_The_Weapon/info.js new file mode 100644 index 0000000000..57a127c9be --- /dev/null +++ b/Games/Guess_The_Weapon/info.js @@ -0,0 +1,34 @@ +const info = [ + { img_src: "./Asset/AA-12.png", option1: "Benelli Supernova", option2: "Banelli M1", option3: "AA-12", option4: "Double Barreled Shotgun", answer: "AA-12", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/AK-47.jpg", option1: "AK-9", option2: "ACR", option3: "AKM", option4: "AK-47", answer: "AK-47", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/AKM.jpg", option1: "AK-74", option2: "AK-12", option3: "AKM", option4: "AK-107", answer: "AKM", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/AS50.jpg", option1: "AM17", option2: "AMP-69", option3: "AS50", option4: "Beretta ARX160", answer: "AS50", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/AUG.png", option1: "AUG", option2: "AR-15", option3: "AA-12", option4: "Pindad SS2", answer: "AUG", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/AWM.png", option1: "Vektor CR-21", option2: "Valmet M76", option3: "AWM", option4: "Sturmgewehr 44", answer: "AWM", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/Banelli.jpg", option1: "Armsel Striker", option2: "Remington Model 10", option3: "Banelli", option4: "MAUL", answer: "Banelli", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/BarretM82.jpg", option1: "AW50", option2: "BarretM82", option3: "AX50", option4: "Remington MSR", answer: "BarretM82", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/China_Lake.jpeg", option1: "GL06", option2: "GLX 160", option3: "China Lake", option4: "GP-25", answer: "China Lake", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/Daewoo_K3.png", option1: "AA52", option2: "AEK-999", option3: "Breda 38", option4: "Daewoo_K3", answer: "Daewoo_K3", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/DesertEagle.jpg", option1: "DesertEagle", option2: "AMT AutoMag", option3: "Beretta M9", option4: "Astra Model 903", answer: "DesertEagle", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/F2000.jpeg", option1: "Valmet M76", option2: "T86", option3: "F2000", option4: "Stoner 63", answer: "F2000", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/FAMAS.jpg", option1: "SR-47", option2: "SAR-21", option3: "FAMAS", option4: "Rk-62", answer: "FAMAS", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/FIM92-Stinger.jpg", option1: "Bazooka", option2: "FIM92-Stinger", option3: "MK-153", option4: "M72 LAW", answer: "FIM92-Stinger", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/KAR98K.png", option1: "KAR98K", option2: "AK-9", option3: "MK-153", option4: "AK-63", answer: "KAR98K", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/LAW80.jpg", option1: "Kestrel", option2: "B-300", option3: "PF-98", option4: "LAW80", answer: "LAW80", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/M4Carbin.jpg", option1: "M4 Carbin", option2: "Colt ACR", option3: "K-16", option4: "M72 LAW", answer: "M4 Carbin", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/M16A4.png", option1: "Fateh", option2: "FAMAS", option3: "M16A4", option4: "Type 89", answer: "M16A4", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/M79.png", option1: "IFAR 22", option2: "M79", option3: "MK-153", option4: "SA80", answer: "M79", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/M249.jpg", option1: "C90-CR", option2: "Panzerschreck", option3: "PF-98", option4: "M249", answer: "M249", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/MG42.jpg", option1: "AA-52", option2: "Breda 30", option3: "MG42", option4: "Chauchat", answer: "MG42", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/Mossberg930.jpg", option1: "Mossberg930", option2: "FN Minimi", option3: "DS-39", option4: "DP-27", answer: "Mossberg930", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/P-90.jpg", option1: "CAL", option2: "P-90", option3: "HK416", option4: "G36", answer: "P-90", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/Panzerschreck.png", option1: "Panzerschreck", option2: "VHS", option3: "IA2", option4: "T4", answer: "Panzerschreck", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/PKP.jpg", option1: "PKP", option2: "W85", option3: "Type 99", option4: "RPK16", answer: "PKP", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/rpd.jpg", option1: "RPK", option2: "Rheinmetall MG-3", option3: "QBB-95", option4: "rpd", answer: "rpd", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/RPG-7.png", option1: "RPG-7", option2: "RAK-74", option3: "PF-89", option4: "M72 LAW", answer: "RPG-7", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/SA80.jpg", option1: "SA80", option2: "AG-043", option3: "AN-94", option4: "APS-95", answer: "SA80", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/SCARL.jpg", option1: "SCARL", option2: "Fateh", option3: "Colt ACR", option4: "BR-18", answer: "SCARL", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/SPAS12.jpg", option1: "SPAS12", option2: "M1216", option3: "RMB-93", option4: "Vepr-12", answer: "SPAS12", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/SVD_Dragunov.jpg", option1: "M1216", option2: "SVD_Dragunov", option3: "MAG-7", option4: "MAUL", answer: "SVD_Dragunov", maskh: "45%", maskw: "65%" }, + { img_src: "./Asset/XM8.jpg", option1: "XM8", option2: "FIM92-Stinger", option3: "MK-153", option4: "Benelli Supernova", answer: "XM8", maskh: "45%", maskw: "65%" }, +]; \ No newline at end of file diff --git a/Games/Guess_The_Weapon/script.js b/Games/Guess_The_Weapon/script.js new file mode 100644 index 0000000000..3b5619428e --- /dev/null +++ b/Games/Guess_The_Weapon/script.js @@ -0,0 +1,138 @@ +const startBtn = document.getElementById('start_btn'); +const image = document.getElementById("image"); +const replayBtn = document.getElementById("replay"); +const options = document.querySelectorAll("#game ul li"); +const nextBtn = document.getElementById("next_ques"); +const resultInfo = document.querySelector("#result h1"); +const gameBox = document.getElementById("game"); +const opt1 = document.getElementById("opt1"); +const opt2 = document.getElementById("opt2"); +const opt3 = document.getElementById("opt3"); +const opt4 = document.getElementById("opt4"); +const intro = document.getElementById('intro'); +const showHint = document.getElementById("hint_btn"); +const ansBody = document.getElementById("result"); +const maskImg = document.getElementById("mask"); +let question = [], i = 0, score = 0, wrongCount = 0, clickCount = 0; + +// Function to start the game by clicking the start button + +startBtn.addEventListener('click', () => { + intro.classList.add('fadeOut'); + initQuestions(); + gameBox.classList.remove("showResult"); +}); + +// Array Of Objects For Questions And Answers + +const initQuestions = () => { + question = []; + i = 0; score = 0; clickCount = 0;wrongCount = 0; + while (question.length < 5) { + const randomInd = Math.floor(Math.random() * info.length); + if (!question.includes(randomInd)) { + question.push(randomInd); + } + } + changeQuestion(i); +} + +// Function For Changing The Active Class + +options.forEach((option) => { + option.addEventListener("click", () => { + options.forEach((opt) => { + opt.classList.remove("active"); + }) + option.classList.add("active"); + }) +}); + +// Function For Changing The Question + +const changeQuestion = (i) => { + image.src = info[question[i]].img_src; + opt1.textContent = info[question[i]].option1; + opt2.textContent = info[question[i]].option2; + opt3.textContent = info[question[i]].option3; + opt4.textContent = info[question[i]].option4; +} + +// Function For Checking The Answer And Deside the correct Answer and Wrong Answer and give score to the user + +nextBtn.addEventListener("click", () => { + let selected = document.querySelector(".active"); + if (!selected) { + alert("Please select an option"); + return; + } + if (selected.textContent === info[question[i]].answer) { + i++; + score += (3 - wrongCount); + if (i === 5) { + resultInfo.textContent = `Your Score is ${score}`; + gameBox.classList.add("showResult"); + ansBody.classList.remove("showReplay"); + options.forEach((opt) => { + opt.classList.remove("active"); + }) + initQuestions(); + return; + } + clickCount = 0; + maskImg.style.height = "60%"; + maskImg.style.width = "80%"; + changeQuestion(i); + options.forEach((opt) => { + opt.classList.remove("active"); + }) + } + else { + alert("Wrong Answer"); + wrongCount++; + if (wrongCount === 3) { + i++; + if (i == 5) { + resultInfo.textContent = `Your Score is ${score}`; + gameBox.classList.add("showResult"); + ansBody.classList.remove("showReplay"); + options.forEach((opt) => { + opt.classList.remove("active"); + }) + initQuestions(); + return; + } + clickCount = 0; + wrongCount = 0; + maskImg.style.height = "60%"; + maskImg.style.width = "80%"; + changeQuestion(i); + options.forEach((opt) => { + opt.classList.remove("active"); + }) + } + } +}) + +// Function For Giving Hint To The User + +showHint.addEventListener("click", () => { + if (clickCount === 0) { + maskImg.style.height = info[question[i]].maskh; + maskImg.style.width = info[question[i]].maskw; + clickCount++; + score--; + } else { + maskImg.style.height = "0%"; + maskImg.style.width = "0%"; + score--; + } +}) + +// Function For Restart The Game By Showing The Main Screen + +replayBtn.addEventListener("click", () => { + initQuestions(); + ansBody.classList.add("showReplay"); + intro.classList.remove('fadeOut'); +}) \ No newline at end of file diff --git a/Games/Guess_The_Weapon/style.css b/Games/Guess_The_Weapon/style.css new file mode 100644 index 0000000000..991b94383d --- /dev/null +++ b/Games/Guess_The_Weapon/style.css @@ -0,0 +1,215 @@ +@import url("https://fonts.googleapis.com/css2?family=Lora&family=Oswald&family=Pacifico&family=Poppins&family=Satisfy&display=swap"); + +* { + margin: 0; + padding: 0; + box-sizing: border-box; + font-family: "Poppins", sans-serif; +} + +body { + min-height: 100vh; + width: 100%; + display: flex; + justify-content: center; + align-items: center; + background: linear-gradient(#040d12, #183d3d); +} + +#intro { + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + color: #fff; + display: flex; + flex-direction: column; + justify-items: flex-start; + align-items: center; + padding: 10px; + text-align: center; + transition: all 0.3s ease; +} + +#intro h1 { + font-family: "Satisfy", cursive; + font-size: 60px; + margin: 1.5rem 0; + background: -webkit-linear-gradient(left, #b70404, #efd595, #ffbb5c, #ae445a); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +#intro button { + padding: 8px 16px; + border: none; + margin-top: 1.5rem; + font-size: 16px; + background: transparent; + border: 2px solid #fff; + color: #fff; + cursor: pointer; + transition: all 0.3s ease; +} + +#intro button:hover { + background: #fff; + color: #000; + border-radius: 25px; +} + +#intro button i { + margin-left: 8px; +} + +#game { + width: 430px; + padding: 10px; + display: flex; + flex-direction: column; + align-items: center; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); +} + +.showResult, +.showReplay, +.fadeOut { + opacity: 0; + user-select: none; + pointer-events: none; +} + +#image_box{ + min-height: 100%; + position: relative; +} + +#image_box #image { + aspect-ratio: auto; + width: 100%; +} + +#image_box #mask{ + position: absolute; + height: 60%; + width: 80%; + background-color: rgba(0,0,0); + left: 50%; + top: 50%; + transform: translate(-50%,-50%); +} + +#game ul { + position: relative; + list-style: none; + display: flex; + flex-direction: column; + width: 100%; +} + +#game ul li { + padding: 0.6rem 14px; + margin: 0.8rem 0; + border: 2px solid #fff; + color: #fff; + transition: all 0.1s linear; + cursor: pointer; +} + +#game ul li:where(:hover, .active) { + background-color: #fff; + color: #000; + border-radius: 25px; +} + +#game .option { + width: 100%; + display: flex; + justify-content: space-between; + align-items: center; + margin-top: 1.5rem; +} + +#game .option button { + padding: 5px 1rem; + border: none; + cursor: pointer; + font-size: 16px; + background-color: transparent; + border: 1px solid #fff; + color: #fff; + transition: all 0.3s linear; +} + +#game .option button i { + margin-left: 8px; +} + +#game .option button:hover { + border-radius: 25px; + background-color: #fff; + color: #000; +} + +#result { + position: relative; + display: flex; + justify-content: space-between; + align-items: center; + flex-direction: column; + text-align: center; +} + +#result h1 { + font-family: "Satisfy", cursive; + font-size: 60px; + margin: 1.5rem 0; + background: -webkit-linear-gradient(left, #b70404, #efd595, #ffbb5c, #ae445a); + -webkit-background-clip: text; + -webkit-text-fill-color: transparent; +} + +#result button { + margin-top: 0.8rem; + padding: 0.5rem 0.8rem; + font-size: 16px; + background: transparent; + border: none; + border: 2px solid #fff; + color: #fff; + transition: all 0.3s ease; + cursor: pointer; +} + +#result button:hover { + background: #fff; + color: #000; + border-radius: 25px; +} + +#result button i { + margin-left: 8px; +} + +@media screen and (max-width: 500px) { + #intro{ + width: 95%; + } + #intro h1{ + font-size: 40px; + } + #game{ + width: 95%; + } + #result h1{ + font-size: 40px; + width: 90%; + } +} + +::-webkit-scrollbar{ + width: 0px; +} \ No newline at end of file diff --git a/README.md b/README.md index 3289c3c3d6..d81cb0fbeb 100644 --- a/README.md +++ b/README.md @@ -493,7 +493,8 @@ This repository also provides one such platforms where contributers come over an | 381 | [Crossy_Road](https://github.com/tanujbordikar/GameZone/tree/Crossy_Road)| | 382 | [HueHero](https://github.com/kunjgit/GameZone/tree/main/Games/HueHero)| | 383 | [Puzzel_Winner](https://github.com/kunjgit/GameZone/tree/main/Games/Puzzel_Winner)| -| 383 | [Emoji_Intruder](https://github.com/kunjgit/GameZone/tree/main/Games/Emoji_Intruder)| +| 384 | [Emoji_Intruder](https://github.com/kunjgit/GameZone/tree/main/Games/Emoji_Intruder)| +| 385 | [Guess The Weapon](https://github.com/kunjgit/GameZone/tree/main/Games/Guess_The_Weapon)| diff --git a/assets/images/Guess_The_Weapon.png b/assets/images/Guess_The_Weapon.png new file mode 100644 index 0000000000..05c5c726e6 Binary files /dev/null and b/assets/images/Guess_The_Weapon.png differ