Untitled

<!DOCTYPE html>
<html>
<head>
    <title>Read Me When You Need Me</title>
    <style>
        body {
            font-family: sans-serif;
            text-align: center;
            padding: 50px;
            background-color: #f0f8ff; /* Light blue background */
        }
        #generator {
            font-size: 20px;
            margin-bottom: 20px;
        }
        button {
            padding: 10px 20px;
            font-size: 16px;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <h1>Read Me When You Need Me</h1>
    <div id="generator"></div>
    <button onclick="generatePrompt()">Generate a Reason to Smile</button>

    <script>
        const prompts = [
            "Remember that time you [insert a specific accomplishment or positive memory]?",
            "Your laughter is contagious. Think of a moment that made you truly laugh.",
            "You have a unique talent for [insert a specific talent or skill]. Use it today.",
            "Think of three things you're grateful for right now.",
            "You've overcome challenges before, and you can do it again.",
            "Imagine your favorite place, and take a moment to breathe deeply.",
            "What small act of kindness can you do for yourself today?",
            "Remember that you are loved and valued.",
            "List three things you like about yourself.",
            "Think of a time someone told you how much you mattered."
        ];

        function generatePrompt() {
            const randomIndex = Math.floor(Math.random() * prompts.length);
            document.getElementById("generator").textContent = prompts[randomIndex];
        }

        // Generate a prompt on page load
        generatePrompt();
    </script>
</body>
</html>
Editor is loading...