ayushluvsrio/gist:75606692f1c53a0c7c93560dc54bbe88

## gistfile1.txt
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Be My Valentine?</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background: pink;
            font-family: Arial, sans-serif;
            text-align: center;
        }
        .container {
            background: white;
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
        }
        h1 {
            color: red;
        }
        .buttons {
            margin-top: 20px;
        }
        button {
            padding: 10px 20px;
            font-size: 18px;
            border: none;
            cursor: pointer;
            border-radius: 5px;
        }
        .yes {
            background: red;
            color: white;
            transition: transform 0.3s ease;
        }
        .no {
            background: grey;
            color: white;
            position: absolute;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>Will you be my Valentine rio? ❤️</h1>
        <div class="buttons">
            <button class="yes" id="yesButton" onclick="yesClick()">Yes</button>
            <button class="no" onclick="increaseYesSize()" onmouseover="moveNo(this)">No</button>
        </div>
    </div>

    <script>
        function yesClick() {
            document.querySelector('.container').innerHTML = "<h1>Yay! thats like my gugiiiii! 🎉</h1>";
        }
        function moveNo(button) {
            let x = Math.random() * window.innerWidth * 0.7;
            let y = Math.random() * window.innerHeight * 0.7;
            button.style.left = `${x}px`;
            button.style.top = `${y}px`;
        }
        function increaseYesSize() {
            let yesButton = document.getElementById('yesButton');
            let currentSize = parseFloat(window.getComputedStyle(yesButton).fontSize);
            yesButton.style.fontSize = `${currentSize + 5}px`;
        }
    </script>
</body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Be My Valentine?</title>
	<style>
	body {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100vh;
	background: pink;
	font-family: Arial, sans-serif;
	text-align: center;
	}
	.container {
	background: white;
	padding: 20px;
	border-radius: 10px;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
	}
	h1 {
	color: red;
	}
	.buttons {
	margin-top: 20px;
	}
	button {
	padding: 10px 20px;
	font-size: 18px;
	border: none;
	cursor: pointer;
	border-radius: 5px;
	}
	.yes {
	background: red;
	color: white;
	transition: transform 0.3s ease;
	}
	.no {
	background: grey;
	color: white;
	position: absolute;
	}
	</style>
	</head>
	<body>
	<div class="container">
	<h1>Will you be my Valentine rio? ❤️</h1>
	<div class="buttons">
	<button class="yes" id="yesButton" onclick="yesClick()">Yes</button>
	<button class="no" onclick="increaseYesSize()" onmouseover="moveNo(this)">No</button>
	</div>
	</div>

	<script>
	function yesClick() {
	document.querySelector('.container').innerHTML = "<h1>Yay! thats like my gugiiiii! 🎉</h1>";
	}
	function moveNo(button) {
	let x = Math.random() * window.innerWidth * 0.7;
	let y = Math.random() * window.innerHeight * 0.7;
	button.style.left = `${x}px`;
	button.style.top = `${y}px`;
	}
	function increaseYesSize() {
	let yesButton = document.getElementById('yesButton');
	let currentSize = parseFloat(window.getComputedStyle(yesButton).fontSize);
	yesButton.style.fontSize = `${currentSize + 5}px`;
	}
	</script>
	</body>
	</html>