Last 10 Commits for justdoit.scroll.pub

commit 6b646fdf2821636e1548f9168567bf07a012ac20 Author: root <root@hub.scroll.pub> Date: 2024-12-30 18:33:49 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..4d699d5 --- /dev/null +++ b/body.html @@ -0,0 +1,34 @@ +<header> + <h1>Go Fucking Do It</h1> + <p class="tagline">Set a goal. Set a deadline. Get it done.</p> +</header> + +<main> + <form id="goalForm" class="goal-form"> + <div class="form-group"> + <label for="goalInput">What's your fucking goal?</label> + <input type="text" id="goalInput" required placeholder="Enter your goal here"> + </div> + + <div class="form-group"> + <label for="deadlineInput">When will you fucking do it?</label> + <input type="datetime-local" id="deadlineInput" required> + </div> + + <div class="form-group"> + <label for="emailInput">Your email (for accountability)</label> + <input type="email" id="emailInput" required placeholder="your@email.com"> + </div> + + <button type="submit" class="submit-btn">Commit To This Shit</button> + </form> + + <section class="goals-list"> + <h2>Your Active Goals</h2> + <div id="activeGoals"></div> + </section> +</main> + +<footer> + <p>Now stop procrastinating and go fucking do it!</p> +</footer> diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..ce9b444 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://justdoit.scroll.pub +metaTags +editButton /edit.html +title Go Fucking Do It - Goal Achievement Tracker +style.css +body.html +script.js diff --git a/prompt.json b/prompt.json new file mode 100644 index 0000000..f51ece2 --- /dev/null +++ b/prompt.json @@ -0,0 +1,20 @@ +{ + "id": "msg_01XMjc58VxdTgNKQTJW6qQh4", + "type": "message", + "role": "assistant", + "model": "claude-3-5-sonnet-20241022", + "content": [ + { + "type": "text", + "text": "Let me create this motivational goal-tracking website.\n\n---domain---\njustdoit.scroll.pub\n\n---index.scroll---\nbuildHtml\nbaseUrl https://justdoit.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Go Fucking Do It - Goal Achievement Tracker\nstyle.css\nbody.html\nscript.js\n\n---body.html---\n<header>\n <h1>Go Fucking Do It</h1>\n <p class=\"tagline\">Set a goal. Set a deadline. Get it done.</p>\n</header>\n\n<main>\n <form id=\"goalForm\" class=\"goal-form\">\n <div class=\"form-group\">\n <label for=\"goalInput\">What's your fucking goal?</label>\n <input type=\"text\" id=\"goalInput\" required placeholder=\"Enter your goal here\">\n </div>\n \n <div class=\"form-group\">\n <label for=\"deadlineInput\">When will you fucking do it?</label>\n <input type=\"datetime-local\" id=\"deadlineInput\" required>\n </div>\n \n <div class=\"form-group\">\n <label for=\"emailInput\">Your email (for accountability)</label>\n <input type=\"email\" id=\"emailInput\" required placeholder=\"your@email.com\">\n </div>\n \n <button type=\"submit\" class=\"submit-btn\">Commit To This Shit</button>\n </form>\n\n <section class=\"goals-list\">\n <h2>Your Active Goals</h2>\n <div id=\"activeGoals\"></div>\n </section>\n</main>\n\n<footer>\n <p>Now stop procrastinating and go fucking do it!</p>\n</footer>\n\n---style.css---\n:root {\n --primary-color: #ff4757;\n --secondary-color: #2f3542;\n --background-color: #f1f2f6;\n --text-color: #2f3542;\n --shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;\n line-height: 1.6;\n color: var(--text-color);\n background: var(--background-color);\n min-height: 100vh;\n}\n\nheader {\n background: var(--primary-color);\n color: white;\n padding: 2rem;\n text-align: center;\n box-shadow: var(--shadow);\n}\n\nh1 {\n font-size: 3rem;\n margin-bottom: 0.5rem;\n text-transform: uppercase;\n letter-spacing: 2px;\n}\n\n.tagline {\n font-size: 1.2rem;\n opacity: 0.9;\n}\n\nmain {\n max-width: 800px;\n margin: 2rem auto;\n padding: 0 1rem;\n}\n\n.goal-form {\n background: white;\n padding: 2rem;\n border-radius: 10px;\n box-shadow: var(--shadow);\n margin-bottom: 2rem;\n}\n\n.form-group {\n margin-bottom: 1.5rem;\n}\n\nlabel {\n display: block;\n margin-bottom: 0.5rem;\n font-weight: bold;\n color: var(--secondary-color);\n}\n\ninput {\n width: 100%;\n padding: 0.8rem;\n border: 2px solid #ddd;\n border-radius: 5px;\n font-size: 1rem;\n transition: border-color 0.3s ease;\n}\n\ninput:focus {\n border-color: var(--primary-color);\n outline: none;\n}\n\n.submit-btn {\n background: var(--primary-color);\n color: white;\n border: none;\n padding: 1rem 2rem;\n font-size: 1.1rem;\n border-radius: 5px;\n cursor: pointer;\n width: 100%;\n text-transform: uppercase;\n letter-spacing: 1px;\n transition: transform 0.2s ease, background-color 0.2s ease;\n}\n\n.submit-btn:hover {\n background: #ff2741;\n transform: translateY(-2px);\n}\n\n.goals-list {\n background: white;\n padding: 2rem;\n border-radius: 10px;\n box-shadow: var(--shadow);\n}\n\n.goals-list h2 {\n margin-bottom: 1rem;\n color: var(--secondary-color);\n}\n\nfooter {\n text-align: center;\n padding: 2rem;\n background: var(--secondary-color);\n color: white;\n margin-top: 2rem;\n}\n\n@media (max-width: 600px) {\n h1 {\n font-size: 2rem;\n }\n \n .goal-form {\n padding: 1rem;\n }\n \n .submit-btn {\n padding: 0.8rem 1.5rem;\n }\n}\n\n---script.js---\ndocument.addEventListener('DOMContentLoaded', () => {\n const goalForm = document.getElementById('goalForm');\n const activeGoals = document.getElementById('activeGoals');\n\n // Load existing goals from localStorage\n let goals = JSON.parse(localStorage.getItem('goals')) || [];\n \n function saveGoal(goal) {\n goals.push(goal);\n localStorage.setItem('goals', JSON.stringify(goals));\n displayGoals();\n }\n\n function displayGoals() {\n activeGoals.innerHTML = '';\n goals.forEach((goal, index) => {\n const goalElement = document.createElement('div');\n goalElement.classList.add('goal-item');\n \n const deadline = new Date(goal.deadline);\n const timeLeft = deadline - new Date();\n \n goalElement.innerHTML = `\n <h3>${goal.text}</h3>\n <p>Deadline: ${deadline.toLocaleDateString()} ${deadline.toLocaleTimeString()}</p>\n <p>Time left: ${Math.ceil(timeLeft / (1000 * 60 * 60 * 24))} days</p>\n `;\n \n activeGoals.appendChild(goalElement);\n });\n }\n\n function checkDeadlines() {\n const now = new Date();\n goals = goals.filter(goal => {\n const deadline = new Date(goal.deadline);\n if (deadline <= now) {\n // In a real implementation, this would send an email using a backend service\n console.log(`Sending email for goal: ${goal.text} to ${goal.email}`);\n return false;\n }\n return true;\n });\n localStorage.setItem('goals', JSON.stringify(goals));\n displayGoals();\n }\n\n goalForm.addEventListener('submit', (e) => {\n e.preventDefault();\n \n const goal = {\n text: document.getElementById('goalInput').value,\n deadline: document.getElementById('deadlineInput').value,\n email: document.getElementById('emailInput').value,\n created: new Date()\n };\n \n saveGoal(goal);\n goalForm.reset();\n });\n\n // Check deadlines every minute\n setInterval(checkDeadlines, 60000);\n \n // Initial display\n displayGoals();\n});\n\n---end---\n\nThis implementation includes:\n\n1. A clean, modern design with a bold color scheme\n2. Responsive layout that works on all devices\n3. Local storage to persist goals\n4. Form validation\n5. Deadline tracking\n6. Accessibility features\n7. Clean semantic HTML\n8. Modern CSS with variables and transitions\n9. JavaScript for handling goals and checking deadlines\n\nNote: The email sending functionality would require a backend service in a real implementation. This frontend-only version just logs to the console when a deadline is reached.\n\nThe design is bold and motivational, matching the \"Go Fucking Do It\" theme while remaining professional. The color scheme and typography create visual impact while maintaining readability and usability." + } + ], + "stop_reason": "end_turn", + "stop_sequence": null, + "usage": { + "input_tokens": 311, + "cache_creation_input_tokens": 0, + "cache_read_input_tokens": 0, + "output_tokens": 2079 + } +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..4a51068 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# justdoit.scroll.pub +Website generated by Claude from prompt: I want to build a website "go fucking do it", it will ask you goal with a dealine, if the deadline meets, automately send you a email to ask whether you finish your goal \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..359172c --- /dev/null +++ b/script.js @@ -0,0 +1,67 @@ +document.addEventListener('DOMContentLoaded', () => { + const goalForm = document.getElementById('goalForm'); + const activeGoals = document.getElementById('activeGoals'); + + // Load existing goals from localStorage + let goals = JSON.parse(localStorage.getItem('goals')) || []; + + function saveGoal(goal) { + goals.push(goal); + localStorage.setItem('goals', JSON.stringify(goals)); + displayGoals(); + } + + function displayGoals() { + activeGoals.innerHTML = ''; + goals.forEach((goal, index) => { + const goalElement = document.createElement('div'); + goalElement.classList.add('goal-item'); + + const deadline = new Date(goal.deadline); + const timeLeft = deadline - new Date(); + + goalElement.innerHTML = ` + <h3>${goal.text}</h3> + <p>Deadline: ${deadline.toLocaleDateString()} ${deadline.toLocaleTimeString()}</p> + <p>Time left: ${Math.ceil(timeLeft / (1000 * 60 * 60 * 24))} days</p> + `; + + activeGoals.appendChild(goalElement); + }); + } + + function checkDeadlines() { + const now = new Date(); + goals = goals.filter(goal => { + const deadline = new Date(goal.deadline); + if (deadline <= now) { + // In a real implementation, this would send an email using a backend service + console.log(`Sending email for goal: ${goal.text} to ${goal.email}`); + return false; + } + return true; + }); + localStorage.setItem('goals', JSON.stringify(goals)); + displayGoals(); + } + + goalForm.addEventListener('submit', (e) => { + e.preventDefault(); + + const goal = { + text: document.getElementById('goalInput').value, + deadline: document.getElementById('deadlineInput').value, + email: document.getElementById('emailInput').value, + created: new Date() + }; + + saveGoal(goal); + goalForm.reset(); + }); + + // Check deadlines every minute + setInterval(checkDeadlines, 60000); + + // Initial display + displayGoals(); +}); diff --git a/style.css b/style.css new file mode 100644 index 0000000..c2b160f --- /dev/null +++ b/style.css @@ -0,0 +1,133 @@ +:root { + --primary-color: #ff4757; + --secondary-color: #2f3542; + --background-color: #f1f2f6; + --text-color: #2f3542; + --shadow: 0 4px 6px rgba(0, 0, 0, 0.1); +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; + line-height: 1.6; + color: var(--text-color); + background: var(--background-color); + min-height: 100vh; +} + +header { + background: var(--primary-color); + color: white; + padding: 2rem; + text-align: center; + box-shadow: var(--shadow); +} + +h1 { + font-size: 3rem; + margin-bottom: 0.5rem; + text-transform: uppercase; + letter-spacing: 2px; +} + +.tagline { + font-size: 1.2rem; + opacity: 0.9; +} + +main { + max-width: 800px; + margin: 2rem auto; + padding: 0 1rem; +} + +.goal-form { + background: white; + padding: 2rem; + border-radius: 10px; + box-shadow: var(--shadow); + margin-bottom: 2rem; +} + +.form-group { + margin-bottom: 1.5rem; +} + +label { + display: block; + margin-bottom: 0.5rem; + font-weight: bold; + color: var(--secondary-color); +} + +input { + width: 100%; + padding: 0.8rem; + border: 2px solid #ddd; + border-radius: 5px; + font-size: 1rem; + transition: border-color 0.3s ease; +} + +input:focus { + border-color: var(--primary-color); + outline: none; +} + +.submit-btn { + background: var(--primary-color); + color: white; + border: none; + padding: 1rem 2rem; + font-size: 1.1rem; + border-radius: 5px; + cursor: pointer; + width: 100%; + text-transform: uppercase; + letter-spacing: 1px; + transition: transform 0.2s ease, background-color 0.2s ease; +} + +.submit-btn:hover { + background: #ff2741; + transform: translateY(-2px); +} + +.goals-list { + background: white; + padding: 2rem; + border-radius: 10px; + box-shadow: var(--shadow); +} + +.goals-list h2 { + margin-bottom: 1rem; + color: var(--secondary-color); +} + +footer { + text-align: center; + padding: 2rem; + background: var(--secondary-color); + color: white; + margin-top: 2rem; +} + +@media (max-width: 600px) { + h1 { + font-size: 2rem; + } + + .goal-form { + padding: 1rem; + } + + .submit-btn { + padding: 0.8rem 1.5rem; + } +}