0% found this document useful (0 votes)
19 views2 pages

Website

Uploaded by

voidgirl08
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
19 views2 pages

Website

Uploaded by

voidgirl08
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

<!

DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My Cute Gallery</title>
<style>
body {
background-color: #ffccdd;
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
color: #333;
}
header {
background-color: #ff99cc;
padding: 20px;
text-align: center;
}
h1 {
color: white;
}
.gallery {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 20px 0;
}
.gallery img {
width: 200px;
height: 150px;
margin: 10px;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.reminder {
margin: 20px;
text-align: center;
background-color: white;
padding: 20px;
border-radius: 10px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
button {
background-color: #ff6699;
border: none;
color: white;
padding: 10px 20px;
text-align: center;
text-decoration: none;
display: inline-block;
font-size: 16px;
border-radius: 5px;
cursor: pointer;
}
button:hover {
background-color: #ff3366;
}
</style>
</head>
<body>

<header>
<h1>My Cute Photo Gallery</h1>
</header>

<div class="gallery">
<img src="ADDIMAGE" alt="Photo 1">
<img src="ADDIMAGE" alt="Photo 2">
<img src="ADDIMAGE" alt="Photo 3">
<img src="ADDIMAGE" alt="Photo 4">
<img src="ADDIMAGE" alt="Photo 5">
</div>

<div class="reminder">
<h2>Daily Reminders</h2>
<p id="reminder-message">Remember to workout and maintain a calorie
deficit!</p>
<button onclick="setReminder()">Set Daily Reminder</button>
</div>

<script>
function setReminder() {
const reminderMessage = document.getElementById('reminder-message');
const hours = prompt("At what hour would you like to be reminded (0-23)?");
const minutes = prompt("At what minute would you like to be reminded (0-
59)?");

if (hours >= 0 && hours < 24 && minutes >= 0 && minutes < 60) {
const now = new Date();
let reminderTime = new Date();
reminderTime.setHours(hours);
reminderTime.setMinutes(minutes);
reminderTime.setSeconds(0);

if (reminderTime < now) {


reminderTime.setDate(now.getDate() + 1); // Set for the next day if
time has passed
}

const timeUntilReminder = reminderTime.getTime() - now.getTime();

setTimeout(() => {
alert("It's time to workout and maintain your calorie deficit!");
}, timeUntilReminder);

reminderMessage.textContent = `Reminder set for $


{reminderTime.toLocaleTimeString()}.`;
} else {
alert("Please enter valid hour and minute.");
}
}
</script>

</body>
</html>

You might also like