Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ADDED MARRIAGE PREDICTOR GAME #3246

Closed
wants to merge 1 commit into from
Closed
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
33 changes: 33 additions & 0 deletions Games/MarriagePredictorGame/Marriage predictor/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,33 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Marriage Predictor Game</title>
<link href='https://unpkg.com/[email protected]/css/boxicons.min.css' rel='stylesheet'>
<link rel="stylesheet" href="styles.css">
</head>
<body>
<div class="header">
<a href="https://kunjgit.github.io/GameZone/">HOME<i class='bx bx-home-heart'></i></a>
</div>
<div class="container">
<h1>Marriage Predictor Game</h1>
<label for="name">Enter your name:</label>
<input type="text" id="name" placeholder="Your Name">
<label for="age">Enter your age:</label>
<input type="number" id="age" placeholder="Your Age">
<label for="gender">Select your gender:</label>
<select id="gender">
<option value="male">Male</option>
<option value="female">Female</option>
<option value="other">Other</option>
</select>
<button onclick="predictMarriage()">Predict!</button>
<div id="prediction"></div>
<img src="" alt="" id="prediction-image">
</div>

<script src="script.js"></script>
</body>
</html>
42 changes: 42 additions & 0 deletions Games/MarriagePredictorGame/Marriage predictor/script.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
function predictMarriage() {
var name = document.getElementById("name").value;
var age = parseInt(document.getElementById("age").value);
var gender = document.getElementById("gender").value;

// Basic validation
if (!name || !age) {
alert("Please fill out all fields.");
return;
}

// Marriage prediction based on age and gender
var prediction;
var imageUrl;

if (age < 25) {
prediction = "You are too young to think about marriage.";
imageUrl = "images/too_young.jpg";
} else if (age >= 25 && age <= 30) {
prediction = "Marriage might be in your near future!";
imageUrl = "images/might_marry.jpg";
} else if (age > 30 && age <= 40) {
prediction = "You have a good chance of getting married soon!";
imageUrl = "images/good_chance.jpg";
} else {
prediction = "You will find your soulmate when the time is right.";
imageUrl = "images/soulmate.jpg";
}

document.getElementById("prediction").innerText = `${name}, ${prediction}`;
document.getElementById("prediction-image").src = imageUrl;
}
document.addEventListener('DOMContentLoaded', function () {
var cursor = document.createElement('div');
cursor.className = 'cursor';
document.body.appendChild(cursor);

document.addEventListener('mousemove', function (e) {
cursor.style.left = e.pageX + 'px';
cursor.style.top = e.pageY + 'px';
});
});
103 changes: 103 additions & 0 deletions Games/MarriagePredictorGame/Marriage predictor/styles.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,103 @@
@import url('https://fonts.googleapis.com/css2?family=Anton&family=Bungee+Spice&family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap');
body {
font-family: "Bungee Spice", sans-serif;
font-weight: 200;
font-style: normal;
background-color: #f0f0f0;
background-image: url("https://wallpapercave.com/wp/wp3284859.gif");
/* background-repeat: no-repeat; */
/* background-size: cover; */
background-position: right;
cursor: none;
}
.header i{
position: relative;
color:white;
left:713px;
font-size: 43px;

}
.cursor {
width: 20px;
height: 20px;
border-radius: 50%;
position: absolute;
z-index: 9999;
pointer-events: none;
background: radial-gradient(circle, rgb(255, 242, 0), rgb(0, 255, 225), rgb(244, 10, 201));
mix-blend-mode: difference;
}

.container {
max-width: 600px;
margin: 120px auto;
padding: 20px;
background-color: #0c0b0b;
border-radius: 8px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
text-align: center;
animation: borderAnimation 4s infinite ;
border: 5px solid #000000; /* Initial border color */
box-shadow: 0 0 23px cyan;
position: relative; /* Ensure footer doesn't overlap */
z-index: 1;

}
@keyframes borderAnimation {
0% {
border-color: #fb5c5c;
}
20% {
border-color: #ffcc00;
}
40% {
border-color: #007bff;
}
60%{
border-color: green;
}
80%{
border-color: crimson;

}
100%{
border-color: cyan;
}
}

h1 {
color: #0d0606;
}
h1:hover{
box-shadow: 0 0 12px rgb(244, 129, 149);
cursor:pointer;
}

input[type="text"] {
width: 94%;
padding: 10px;
margin: 12px 0;
border: 7px solid #61cdee;
border-radius: 3px;
box-shadow: 0 0 12px rgb(233, 252, 125);
}

button {
padding: 10px 20px;
background-color: #f7ff01;
color: #0b0505;
border: none;
border-radius: 4px;
cursor: pointer;
margin-top: 22px;
}

button:hover {
background-color: #83fc75;
font-weight: bold;
box-shadow: 0 0 22px rgb(248, 11, 208);
}




Loading