commit 2e17411e98502d5ceba1930ac0eda11984bb8f09
Author: root <root@hub.scroll.pub> Date: 2024-12-27 13:55:18 +0000 Subject: Initial commit diff --git a/body.html b/body.html new file mode 100644 index 0000000..e45a0eb --- /dev/null +++ b/body.html @@ -0,0 +1,23 @@ +<header> + <h1>Noted</h1> + <p>Your simple, beautiful note-taking solution</p> +</header> + +<main> + <section class="note-input"> + <textarea id="note-text" placeholder="Start typing your note here..." aria-label="Note input"></textarea> + <div class="controls"> + <button id="save-btn" aria-label="Save note">💾 Save</button> + <button id="clear-btn" aria-label="Clear notes">🗑️ Clear All</button> + </div> + </section> + + <section class="notes-list"> + <h2>Your Notes</h2> + <ul id="notes-container" aria-label="List of saved notes"></ul> + </section> +</main> + +<footer> + <p>Keep your thoughts organized with Noted</p> +</footer> \ No newline at end of file diff --git a/index.scroll b/index.scroll new file mode 100644 index 0000000..b75d98d --- /dev/null +++ b/index.scroll @@ -0,0 +1,8 @@ +buildHtml +baseUrl https://noted.scroll.pub +metaTags +editButton /edit.html +title Noted - Simple & Beautiful Note Taker +style.css +body.html +script.js \ No newline at end of file diff --git a/readme.scroll b/readme.scroll new file mode 100644 index 0000000..8ed6675 --- /dev/null +++ b/readme.scroll @@ -0,0 +1,2 @@ +# noted.scroll.pub +Website generated by DeepSeek from prompt: Make me a note taker \ No newline at end of file diff --git a/script.js b/script.js new file mode 100644 index 0000000..478664d --- /dev/null +++ b/script.js @@ -0,0 +1,49 @@ +// Load saved notes from localStorage +const notesContainer = document.getElementById('notes-container'); +const noteInput = document.getElementById('note-text'); +const saveBtn = document.getElementById('save-btn'); +const clearBtn = document.getElementById('clear-btn'); + +let notes = JSON.parse(localStorage.getItem('notes')) || []; + +function renderNotes() { + notesContainer.innerHTML = ''; + notes.forEach((note, index) => { + const noteItem = document.createElement('li'); + noteItem.className = 'note-item'; + noteItem.innerHTML = ` + <span>${note}</span> + <span class="delete-note" onclick="deleteNote(${index})">✕</span> + `; + notesContainer.appendChild(noteItem); + }); +} + +function saveNote() { + const noteText = noteInput.value.trim(); + if (noteText) { + notes.push(noteText); + localStorage.setItem('notes', JSON.stringify(notes)); + noteInput.value = ''; + renderNotes(); + } +} + +function deleteNote(index) { + notes.splice(index, 1); + localStorage.setItem('notes', JSON.stringify(notes)); + renderNotes(); +} + +function clearNotes() { + notes = []; + localStorage.removeItem('notes'); + renderNotes(); +} + +// Event listeners +saveBtn.addEventListener('click', saveNote); +clearBtn.addEventListener('click', clearNotes); + +// Initial render +renderNotes(); \ No newline at end of file diff --git a/style.css b/style.css new file mode 100644 index 0000000..7e79a2b --- /dev/null +++ b/style.css @@ -0,0 +1,128 @@ +:root { + --primary-color: #5e35b1; + --secondary-color: #7e57c2; + --background-color: #f5f5f5; + --text-color: #333; + --shadow: 0 2px 10px rgba(0, 0, 0, 0.1); +} + +* { + 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(--background-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; +} + +.note-input { + background: white; + padding: 1.5rem; + border-radius: 8px; + box-shadow: var(--shadow); + margin-bottom: 2rem; +} + +textarea { + width: 100%; + min-height: 150px; + padding: 1rem; + border: 2px solid #ddd; + border-radius: 4px; + resize: vertical; + font-size: 1rem; + margin-bottom: 1rem; +} + +.controls { + display: flex; + gap: 1rem; +} + +button { + padding: 0.8rem 1.5rem; + border: none; + border-radius: 4px; + background-color: var(--primary-color); + color: white; + font-size: 1rem; + cursor: pointer; + transition: background-color 0.3s ease; +} + +button:hover { + background-color: var(--secondary-color); +} + +.notes-list { + background: white; + padding: 1.5rem; + border-radius: 8px; + box-shadow: var(--shadow); +} + +#notes-container { + list-style: none; +} + +.note-item { + padding: 1rem; + border-bottom: 1px solid #eee; + display: flex; + justify-content: space-between; + align-items: center; +} + +.note-item:last-child { + border-bottom: none; +} + +.delete-note { + background: #ff4444; + padding: 0.3rem 0.6rem; + border-radius: 3px; + color: white; + cursor: pointer; +} + +footer { + text-align: center; + margin-top: 2rem; + color: #666; +} + +@media (max-width: 600px) { + body { + padding: 1rem; + } + + h1 { + font-size: 2rem; + } + + .controls { + flex-direction: column; + } + + button { + width: 100%; + } +} \ No newline at end of file