Last 10 Commits for notescroll.scroll.pub

commit d5d02ea58fd170751c5ce80bc3f5d3fb3c74af76 Author: root <root@hub.scroll.pub> Date: 2024-12-31 06:31:02 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..9e628ab --- /dev/null +++ b/body.html @@ -0,0 +1,30 @@ +<header> + <h1>NoteScroll</h1> + <nav> + <button id="newNote">+ New Note</button> + <button id="toggleView">Grid View</button> + </nav> +</header> + +<main> + <section id="notesGrid" class="grid-view"> +  + </section> +</main> + +<footer> + <p>Your notes are stored locally in your browser.</p> +</footer> + +<template id="noteTemplate"> + <article class="note-card"> + <h2 class="note-title">New Note</h2> + <div class="note-content"> + <p>Start typing your note here...</p> + </div> + <div class="note-actions"> + <button class="edit-btn">Edit</button> + <button class="delete-btn">Delete</button> + </div> + </article> +</template> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..b255c95 --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://notescroll.scroll.pub +metaTags +editButton /edit.html +title NoteScroll - Your Local Notion Alternative +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..a1c7dc7 --- /dev/null +++ b/prompt.json @@ -0,0 +1,25 @@ +{ + "id": "3aa9c524-9865-44c5-af00-2525ccb821ff", + "object": "chat.completion", + "created": 1735626639, + "model": "deepseek-chat", + "choices": [ + { + "index": 0, + "message": { + "role": "assistant", + "content": "---domain---\nnotescroll.scroll.pub\n---index.scroll---\nbuildHtml\nbaseUrl https://notescroll.scroll.pub\nmetaTags\neditButton /edit.html\ntitle NoteScroll - Your Local Notion Alternative\nstyle.css\nbody.html\nscript.js\n---body.html---\n<header>\n <h1>NoteScroll</h1>\n <nav>\n <button id=\"newNote\">+ New Note</button>\n <button id=\"toggleView\">Grid View</button>\n </nav>\n</header>\n\n<main>\n <section id=\"notesGrid\" class=\"grid-view\">\n \n </section>\n</main>\n\n<footer>\n <p>Your notes are stored locally in your browser.</p>\n</footer>\n\n<template id=\"noteTemplate\">\n <article class=\"note-card\">\n <h2 class=\"note-title\">New Note</h2>\n <div class=\"note-content\">\n <p>Start typing your note here...</p>\n </div>\n <div class=\"note-actions\">\n <button class=\"edit-btn\">Edit</button>\n <button class=\"delete-btn\">Delete</button>\n </div>\n </article>\n</template>\n---style.css---\n:root {\n --primary-color: #2563eb;\n --background-color: #f8fafc;\n --card-color: #ffffff;\n --text-color: #1e293b;\n --shadow: 0 1px 3px rgba(0,0,0,0.12);\n}\n\n* {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n}\n\nbody {\n font-family: -apple-system, BlinkMacSystemFont, sans-serif;\n background-color: var(--background-color);\n color: var(--text-color);\n line-height: 1.6;\n padding: 1rem;\n}\n\nheader {\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 2rem;\n}\n\nh1 {\n font-size: 2rem;\n color: var(--primary-color);\n}\n\nbutton {\n background-color: var(--primary-color);\n color: white;\n border: none;\n padding: 0.5rem 1rem;\n border-radius: 0.5rem;\n cursor: pointer;\n transition: opacity 0.2s;\n}\n\nbutton:hover {\n opacity: 0.9;\n}\n\n#notesGrid {\n display: grid;\n gap: 1rem;\n grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));\n}\n\n.note-card {\n background-color: var(--card-color);\n border-radius: 0.5rem;\n padding: 1rem;\n box-shadow: var(--shadow);\n transition: transform 0.2s;\n}\n\n.note-card:hover {\n transform: translateY(-2px);\n}\n\n.note-title {\n font-size: 1.25rem;\n margin-bottom: 0.5rem;\n}\n\n.note-content {\n min-height: 100px;\n}\n\n.note-actions {\n display: flex;\n gap: 0.5rem;\n margin-top: 1rem;\n}\n\n@media (max-width: 768px) {\n #notesGrid {\n grid-template-columns: 1fr;\n }\n}\n---script.js---\ndocument.addEventListener('DOMContentLoaded', () => {\n const notesGrid = document.getElementById('notesGrid');\n const newNoteBtn = document.getElementById('newNote');\n const toggleViewBtn = document.getElementById('toggleView');\n const noteTemplate = document.getElementById('noteTemplate').content;\n\n // Load saved notes from localStorage\n loadNotes();\n\n newNoteBtn.addEventListener('click', createNewNote);\n toggleViewBtn.addEventListener('click', toggleView);\n\n function createNewNote() {\n const noteClone = document.importNode(noteTemplate, true);\n const noteElement = noteClone.querySelector('.note-card');\n \n // Add event listeners for edit and delete\n noteElement.querySelector('.edit-btn').addEventListener('click', () => editNote(noteElement));\n noteElement.querySelector('.delete-btn').addEventListener('click', () => deleteNote(noteElement));\n \n notesGrid.appendChild(noteElement);\n saveNotes();\n }\n\n function editNote(noteElement) {\n const title = noteElement.querySelector('.note-title');\n const content = noteElement.querySelector('.note-content');\n \n title.contentEditable = true;\n content.contentEditable = true;\n \n title.focus();\n \n // Save on blur\n title.addEventListener('blur', saveNotes);\n content.addEventListener('blur', saveNotes);\n }\n\n function deleteNote(noteElement) {\n noteElement.remove();\n saveNotes();\n }\n\n function toggleView() {\n notesGrid.classList.toggle('grid-view');\n notesGrid.classList.toggle('list-view');\n toggleViewBtn.textContent = notesGrid.classList.contains('grid-view') ? 'List View' : 'Grid View';\n }\n\n function saveNotes() {\n const notes = [];\n document.querySelectorAll('.note-card').forEach(note => {\n notes.push({\n title: note.querySelector('.note-title').textContent,\n content: note.querySelector('.note-content').innerHTML\n });\n });\n localStorage.setItem('notes', JSON.stringify(notes));\n }\n\n function loadNotes() {\n const savedNotes = JSON.parse(localStorage.getItem('notes')) || [];\n savedNotes.forEach(noteData => {\n const noteClone = document.importNode(noteTemplate, true);\n const noteElement = noteClone.querySelector('.note-card');\n \n noteElement.querySelector('.note-title').textContent = noteData.title;\n noteElement.querySelector('.note-content').innerHTML = noteData.content;\n \n // Add event listeners\n noteElement.querySelector('.edit-btn').addEventListener('click', () => editNote(noteElement));\n noteElement.querySelector('.delete-btn').addEventListener('click', () => deleteNote(noteElement));\n \n notesGrid.appendChild(noteElement);\n });\n }\n});\n---end---" + }, + "logprobs": null, + "finish_reason": "stop" + } + ], + "usage": { + "prompt_tokens": 278, + "completion_tokens": 1310, + "total_tokens": 1588, + "prompt_cache_hit_tokens": 0, + "prompt_cache_miss_tokens": 278 + }, + "system_fingerprint": "fp_f1afce2943" +} \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..f9e98be --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# notescroll.scroll.pub +Website generated by DeepSeek from prompt: I want a website that can take notes, it performs like notion, can create a page which contains different kinds of data, especially data stored in db and be shown in different format. The note data should be saved locally \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..ef409c3 --- /dev/null +++ b/script.js @@ -0,0 +1,77 @@ +document.addEventListener('DOMContentLoaded', () => { + const notesGrid = document.getElementById('notesGrid'); + const newNoteBtn = document.getElementById('newNote'); + const toggleViewBtn = document.getElementById('toggleView'); + const noteTemplate = document.getElementById('noteTemplate').content; + + // Load saved notes from localStorage + loadNotes(); + + newNoteBtn.addEventListener('click', createNewNote); + toggleViewBtn.addEventListener('click', toggleView); + + function createNewNote() { + const noteClone = document.importNode(noteTemplate, true); + const noteElement = noteClone.querySelector('.note-card'); + + // Add event listeners for edit and delete + noteElement.querySelector('.edit-btn').addEventListener('click', () => editNote(noteElement)); + noteElement.querySelector('.delete-btn').addEventListener('click', () => deleteNote(noteElement)); + + notesGrid.appendChild(noteElement); + saveNotes(); + } + + function editNote(noteElement) { + const title = noteElement.querySelector('.note-title'); + const content = noteElement.querySelector('.note-content'); + + title.contentEditable = true; + content.contentEditable = true; + + title.focus(); + + // Save on blur + title.addEventListener('blur', saveNotes); + content.addEventListener('blur', saveNotes); + } + + function deleteNote(noteElement) { + noteElement.remove(); + saveNotes(); + } + + function toggleView() { + notesGrid.classList.toggle('grid-view'); + notesGrid.classList.toggle('list-view'); + toggleViewBtn.textContent = notesGrid.classList.contains('grid-view') ? 'List View' : 'Grid View'; + } + + function saveNotes() { + const notes = []; + document.querySelectorAll('.note-card').forEach(note => { + notes.push({ + title: note.querySelector('.note-title').textContent, + content: note.querySelector('.note-content').innerHTML + }); + }); + localStorage.setItem('notes', JSON.stringify(notes)); + } + + function loadNotes() { + const savedNotes = JSON.parse(localStorage.getItem('notes')) || []; + savedNotes.forEach(noteData => { + const noteClone = document.importNode(noteTemplate, true); + const noteElement = noteClone.querySelector('.note-card'); + + noteElement.querySelector('.note-title').textContent = noteData.title; + noteElement.querySelector('.note-content').innerHTML = noteData.content; + + // Add event listeners + noteElement.querySelector('.edit-btn').addEventListener('click', () => editNote(noteElement)); + noteElement.querySelector('.delete-btn').addEventListener('click', () => deleteNote(noteElement)); + + notesGrid.appendChild(noteElement); + }); + } +}); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..3a136c2 --- /dev/null +++ b/style.css @@ -0,0 +1,86 @@ +:root { + --primary-color: #2563eb; + --background-color: #f8fafc; + --card-color: #ffffff; + --text-color: #1e293b; + --shadow: 0 1px 3px rgba(0,0,0,0.12); +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} + +body { + font-family: -apple-system, BlinkMacSystemFont, sans-serif; + background-color: var(--background-color); + color: var(--text-color); + line-height: 1.6; + padding: 1rem; +} + +header { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: 2rem; +} + +h1 { + font-size: 2rem; + color: var(--primary-color); +} + +button { + background-color: var(--primary-color); + color: white; + border: none; + padding: 0.5rem 1rem; + border-radius: 0.5rem; + cursor: pointer; + transition: opacity 0.2s; +} + +button:hover { + opacity: 0.9; +} + +#notesGrid { + display: grid; + gap: 1rem; + grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); +} + +.note-card { + background-color: var(--card-color); + border-radius: 0.5rem; + padding: 1rem; + box-shadow: var(--shadow); + transition: transform 0.2s; +} + +.note-card:hover { + transform: translateY(-2px); +} + +.note-title { + font-size: 1.25rem; + margin-bottom: 0.5rem; +} + +.note-content { + min-height: 100px; +} + +.note-actions { + display: flex; + gap: 0.5rem; + margin-top: 1rem; +} + +@media (max-width: 768px) { + #notesGrid { + grid-template-columns: 1fr; + } +} \ No newline at end of file