commit 11c777c2caaaa650b3e666c2836015df9093f419
Author: root <root@hub.scroll.pub> Date: 2024-12-28 14:12:47 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..f4fc0f9 --- /dev/null +++ b/body.html @@ -0,0 +1,28 @@ +<header> + <h1>Teacher Attendance Tracker</h1> + <p>Simple, elegant attendance management for educators</p> +</header> + +<main> + <section class="attendance-form"> + <h2>Take Attendance</h2> + <div class="date-picker"> + <label for="date">Date:</label> + <input type="date" id="date" required> + </div> + <div class="student-list"> + <h3>Students</h3> + <ul id="student-list"></ul> + </div> + <button id="save-attendance">Save Attendance</button> + </section> + + <section class="attendance-records"> + <h2>Attendance Records</h2> + <div id="records-container"></div> + </section> +</main> + +<footer> + <p>Made with ❤️ for educators</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..c476ddf --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://attend.scroll.pub +metaTags +editButton /edit.html +title Teacher Attendance Tracker +style.css +body.html +script.js \ No newline at end of file diff --git a/prompt.json b/prompt.json new file mode 100644 index 0000000..1251326 --- /dev/null +++ b/prompt.json @@ -0,0 +1,25 @@ +{ + "id": "a68b89c9-32d2-468c-b1cd-16ad1013c208", + "object": "chat.completion", + "created": 1735395149, + "model": "deepseek-chat", + "choices": [ + { + "index": 0, + "message": { + "role": "assistant", + "content": "---domain---\nattend.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://attend.scroll.pub\nmetaTags\neditButton /edit.html\ntitle Teacher Attendance Tracker\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header>\n <h1>Teacher Attendance Tracker</h1>\n <p>Simple, elegant attendance management for educators</p>\n</header>\n\n<main>\n <section class=\"attendance-form\">\n <h2>Take Attendance</h2>\n <div class=\"date-picker\">\n <label for=\"date\">Date:</label>\n <input type=\"date\" id=\"date\" required>\n </div>\n <div class=\"student-list\">\n <h3>Students</h3>\n <ul id=\"student-list\"></ul>\n </div>\n <button id=\"save-attendance\">Save Attendance</button>\n </section>\n\n <section class=\"attendance-records\">\n <h2>Attendance Records</h2>\n <div id=\"records-container\"></div>\n </section>\n</main>\n\n<footer>\n <p>Made with ❤️ for educators</p>\n</footer>\n---style.css---\n:root {\n --primary-color: #4a90e2;\n --secondary-color: #f5f5f5;\n --accent-color: #ff6b6b;\n --text-color: #333;\n --border-radius: 8px;\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: 'Segoe UI', system-ui, sans-serif;\n line-height: 1.6;\n color: var(--text-color);\n background-color: var(--secondary-color);\n padding: 2rem;\n max-width: 800px;\n margin: 0 auto;\n}\n\nheader {\n text-align: center;\n margin-bottom: 2rem;\n}\n\nh1 {\n color: var(--primary-color);\n font-size: 2.5rem;\n margin-bottom: 0.5rem;\n}\n\n.attendance-form {\n background: white;\n padding: 2rem;\n border-radius: var(--border-radius);\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n margin-bottom: 2rem;\n}\n\n.date-picker {\n margin-bottom: 1.5rem;\n}\n\n.date-picker input {\n padding: 0.5rem;\n border: 1px solid #ddd;\n border-radius: var(--border-radius);\n font-size: 1rem;\n}\n\n.student-list {\n margin-bottom: 1.5rem;\n}\n\n#student-list {\n list-style: none;\n}\n\n#student-list li {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 0.75rem;\n border-bottom: 1px solid #eee;\n}\n\n#student-list li:last-child {\n border-bottom: none;\n}\n\n#save-attendance {\n background: var(--primary-color);\n color: white;\n border: none;\n padding: 0.75rem 1.5rem;\n border-radius: var(--border-radius);\n cursor: pointer;\n width: 100%;\n font-size: 1rem;\n transition: background 0.3s ease;\n}\n\n#save-attendance:hover {\n background: #357abd;\n}\n\n.attendance-records {\n background: white;\n padding: 2rem;\n border-radius: var(--border-radius);\n box-shadow: 0 2px 10px rgba(0,0,0,0.1);\n}\n\nfooter {\n text-align: center;\n margin-top: 2rem;\n color: #666;\n}\n\n@media (max-width: 600px) {\n body {\n padding: 1rem;\n }\n \n h1 {\n font-size: 2rem;\n }\n \n .attendance-form,\n .attendance-records {\n padding: 1rem;\n }\n}\n---script.js---\n// Sample student data\nconst students = [\n \"Alice Johnson\",\n \"Bob Smith\",\n \"Charlie Brown\",\n \"Diana Prince\",\n \"Edward Cullen\"\n];\n\n// Initialize the student list\nfunction initStudentList() {\n const studentList = document.getElementById('student-list');\n studentList.innerHTML = students.map(student => `\n <li>\n <span>${student}</span>\n <select class=\"attendance-status\">\n <option value=\"present\">Present</option>\n <option value=\"absent\">Absent</option>\n <option value=\"late\">Late</option>\n </select>\n </li>\n `).join('');\n}\n\n// Save attendance function\nfunction saveAttendance() {\n const date = document.getElementById('date').value;\n const attendanceRecords = [];\n \n document.querySelectorAll('#student-list li').forEach((li, index) => {\n const status = li.querySelector('.attendance-status').value;\n attendanceRecords.push({\n student: students[index],\n status: status\n });\n });\n \n const record = {\n date: date,\n attendance: attendanceRecords\n };\n \n displayRecord(record);\n}\n\n// Display attendance record\nfunction displayRecord(record) {\n const recordsContainer = document.getElementById('records-container');\n const recordElement = document.createElement('div');\n recordElement.className = 'record';\n recordElement.innerHTML = `\n <h3>${record.date}</h3>\n <ul>\n ${record.attendance.map(entry => `\n <li>${entry.student}: ${entry.status}</li>\n `).join('')}\n </ul>\n `;\n recordsContainer.prepend(recordElement);\n}\n\n// Event listeners\ndocument.addEventListener('DOMContentLoaded', initStudentList);\ndocument.getElementById('save-attendance').addEventListener('click', saveAttendance);\n---end---" + }, + "logprobs": null, + "finish_reason": "stop" + } + ], + "usage": { + "prompt_tokens": 244, + "completion_tokens": 1280, + "total_tokens": 1524, + "prompt_cache_hit_tokens": 0, + "prompt_cache_miss_tokens": 244 + }, + "system_fingerprint": "fp_f1afce2943" +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..41fc794 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# attend.scroll.pub +Website generated by DeepSeek from prompt: make a website with which a teacher can take attendance \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..16f8435 --- /dev/null +++ b/script.js @@ -0,0 +1,64 @@ +// Sample student data +const students = [ + "Alice Johnson", + "Bob Smith", + "Charlie Brown", + "Diana Prince", + "Edward Cullen" +]; + +// Initialize the student list +function initStudentList() { + const studentList = document.getElementById('student-list'); + studentList.innerHTML = students.map(student => ` + <li> + <span>${student}</span> + <select class="attendance-status"> + <option value="present">Present</option> + <option value="absent">Absent</option> + <option value="late">Late</option> + </select> + </li> + `).join(''); +} + +// Save attendance function +function saveAttendance() { + const date = document.getElementById('date').value; + const attendanceRecords = []; + + document.querySelectorAll('#student-list li').forEach((li, index) => { + const status = li.querySelector('.attendance-status').value; + attendanceRecords.push({ + student: students[index], + status: status + }); + }); + + const record = { + date: date, + attendance: attendanceRecords + }; + + displayRecord(record); +} + +// Display attendance record +function displayRecord(record) { + const recordsContainer = document.getElementById('records-container'); + const recordElement = document.createElement('div'); + recordElement.className = 'record'; + recordElement.innerHTML = ` + <h3>${record.date}</h3> + <ul> + ${record.attendance.map(entry => ` + <li>${entry.student}: ${entry.status}</li> + `).join('')} + </ul> + `; + recordsContainer.prepend(recordElement); +} + +// Event listeners +document.addEventListener('DOMContentLoaded', initStudentList); +document.getElementById('save-attendance').addEventListener('click', saveAttendance); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..1d73e51 --- /dev/null +++ b/style.css @@ -0,0 +1,117 @@ +:root { + --primary-color: #4a90e2; + --secondary-color: #f5f5f5; + --accent-color: #ff6b6b; + --text-color: #333; + --border-radius: 8px; +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: 'Segoe UI', system-ui, sans-serif; + line-height: 1.6; + color: var(--text-color); + background-color: var(--secondary-color); + padding: 2rem; + max-width: 800px; + margin: 0 auto; +} + +header { + text-align: center; + margin-bottom: 2rem; +} + +h1 { + color: var(--primary-color); + font-size: 2.5rem; + margin-bottom: 0.5rem; +} + +.attendance-form { + background: white; + padding: 2rem; + border-radius: var(--border-radius); + box-shadow: 0 2px 10px rgba(0,0,0,0.1); + margin-bottom: 2rem; +} + +.date-picker { + margin-bottom: 1.5rem; +} + +.date-picker input { + padding: 0.5rem; + border: 1px solid #ddd; + border-radius: var(--border-radius); + font-size: 1rem; +} + +.student-list { + margin-bottom: 1.5rem; +} + +#student-list { + list-style: none; +} + +#student-list li { + display: flex; + align-items: center; + justify-content: space-between; + padding: 0.75rem; + border-bottom: 1px solid #eee; +} + +#student-list li:last-child { + border-bottom: none; +} + +#save-attendance { + background: var(--primary-color); + color: white; + border: none; + padding: 0.75rem 1.5rem; + border-radius: var(--border-radius); + cursor: pointer; + width: 100%; + font-size: 1rem; + transition: background 0.3s ease; +} + +#save-attendance:hover { + background: #357abd; +} + +.attendance-records { + background: white; + padding: 2rem; + border-radius: var(--border-radius); + box-shadow: 0 2px 10px rgba(0,0,0,0.1); +} + +footer { + text-align: center; + margin-top: 2rem; + color: #666; +} + +@media (max-width: 600px) { + body { + padding: 1rem; + } + + h1 { + font-size: 2rem; + } + + .attendance-form, + .attendance-records { + padding: 1rem; + } +} \ No newline at end of file