Notes
lfm2 24b a2b · basic

Reviews & generation details
Reviews
No human review yet. Unreviewed does not mean unsuccessful.
Generation context
Imported historical artifact. Its exact original instructions and lineage are not known.
Generation prompt · exact text unavailable
See the current prompt for reference. It may differ from the instructions used to generate this artifact.
Inspect original source 26,025 bytes · SHA-256 6429fc5fb51d
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Notes App</title>
<style>
:root {
--bg-dark: #1e1e1e;
--bg-light: #f5f5f5;
--text-dark: #111;
--text-light: #222;
--accent: #4a90e2;
--border: #e0e0e0;
--card-bg: #fff;
--shadow: 0 2px 8px rgba(0,0,0,0.1);
--font-sans: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
--font-serif: Georgia, serif;
--radius: 6px;
--spacing: 1rem;
--transition: all 0.2s ease;
}
body {
margin: 0;
font-family: var(--font-sans);
background: var(--bg-dark);
color: var(--text-light);
display: flex;
height: 100vh;
overflow: hidden;
}
/* Layout */
#app {
display: flex;
width: 100%;
height: 100vh;
}
/* Sidebar */
.sidebar {
width: 280px;
background: var(--bg-dark);
border-right: 1px solid var(--border);
overflow-y: auto;
transition: width var(--transition);
position: relative;
}
.sidebar.collapsed {
width: 60px;
}
.sidebar-header {
padding: var(--spacing);
background: #2d2d2d;
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
justify-content: space-between;
cursor: pointer;
}
.sidebar-title {
font-size: 0.9rem;
font-weight: 600;
margin: 0;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.sidebar-list {
list-style: none;
padding: 0;
margin: 0;
max-height: 100%;
overflow-y: auto;
}
.sidebar-note {
padding: .5rem .75rem;
cursor: pointer;
display: flex;
align-items: center;
gap: .6rem;
border-radius: var(--radius);
transition: background var(--transition), color var(--transition);
}
.sidebar-note:hover, .sidebar-note.selected {
background: #2a2a2a;
color: #fff;
}
.sidebar-note.collapsible {
padding-left: 1.3rem;
font-size: 0.85rem;
}
.sidebar-note.collapsible::after {
content: '+';
display: inline-block;
width: 1.2em;
text-align: center;
transition: transform var(--transition);
}
.sidebar-note.collapsible.expanded::after {
content: '-';
}
.sidebar-note.full {
padding-left: 2rem;
}
.trash-note {
background: #e0e0e0;
color: #b00;
}
.trash-note:hover {
background: #d0d0d0;
}
.trash-icon {
width: 1.2em;
margin-right: .5rem;
cursor: pointer;
}
/* Main */
.main {
flex: 1;
display: grid;
grid-template-columns: 1fr auto 1fr;
gap: var(--spacing);
padding: var(--spacing);
overflow: hidden;
}
.editor-wrapper {
background: var(--bg-light);
border-radius: var(--radius);
box-shadow: var(--shadow);
overflow: hidden;
display: flex;
flex-direction: column;
}
.editor-toolbar {
display: flex;
gap: .5rem;
padding: .5rem .75rem;
background: #f0f0f0;
border-bottom: 1px solid var(--border);
border-radius: var(--radius) 0 0 0;
}
.editor-toolbar button {
background: none;
border: none;
font-size: .9rem;
cursor: pointer;
color: #555;
transition: color var(--transition);
}
.editor-toolbar button.active { color: var(--accent); }
.editor-toolbar input[type="text"] {
flex: 1;
background: #fff;
border: 1px solid var(--border);
border-radius: var(--radius);
padding: .4rem .6rem;
outline: none;
}
.editor {
min-height: 400px;
padding: .5rem .75rem;
margin: 0;
overflow-y: auto;
font-size: 1rem;
line-height: 1.5;
white-space: pre-wrap;
word-wrap: break-word;
background: #fff;
border: 1px solid var(--border);
border-radius: var(--radius);
}
/* Controls */
.controls {
display: flex;
gap: .5rem;
padding: .5rem .75rem;
background: #fafafa;
border-top: 1px solid var(--border);
border-bottom: 1px solid var(--border);
border-radius: 0 0 var(--radius) var(--radius);
}
.controls button {
background: none;
border: none;
font-size: .9rem;
cursor: pointer;
color: #555;
transition: color var(--transition);
}
.controls button:hover { color: var(--accent); }
/* Search */
.search-bar {
flex: 1;
background: #fff;
border: 1px solid var(--border);
border-radius: var(--radius);
padding: .5rem .75rem;
font-size: .95rem;
margin-bottom: .5rem;
outline: none;
}
.search-bar input {
width: 100%;
border: 1px solid var(--border);
border-radius: var(--radius);
background: #fff;
font-size: 1rem;
padding: .3rem .5rem;
}
/* Empty states */
.empty-state {
display: flex;
align-items: center;
gap: .5rem;
color: #888;
font-style: italic;
padding: .5rem .75rem;
}
.empty-state span {
font-weight: 500;
}
/* Themes */
.dark-mode { background: var(--bg-dark); color: #eee; }
.light-mode { background: var(--bg-light); color: #111; }
/* Responsive */
@media (max-width: 900px) {
.main { grid-template-columns: 1fr auto; }
.sidebar { width: 60px; }
.main { grid-template-columns: 1fr; }
.sidebar.collapsed { display: none; }
}
</style>
</head>
<body>
<div id="app">
<div class="sidebar" id="sidebar">
<div class="sidebar-header" id="sidebar-header">
<span class="sidebar-title">Notebooks</span>
<button id="toggle-sidebar" aria-label="Toggle sidebar">☰</button>
</div>
<ul id="notebook-list" class="sidebar-list"></ul>
<div id="trash-section" style="display:none;">
<div class="trash-note" id="trash-note">
<span class="trash-icon" onclick="toggleTrash()">✔</span>
<span>Trash</span>
</div>
<ul id="trash-list"></ul>
</div>
</div>
<div class="main">
<div class="controls">
<button onclick="toggleSearch()"><span class="editor-toolbar">🔍</span></button>
<input id="search-input" class="search-bar" type="text" placeholder="Search notes...">
<button onclick="toggleTheme()"><span class="editor-toolbar">🌓</span></button>
</div>
<div class="editor-wrapper">
<div id="toolbar">
<button onclick="toggleBold()"><span class="editor-toolbar">&textbf;</span></button>
<button onclick="toggleItalic()"><span class="editor-toolbar">*</span></button>
<button onclick="toggleUnderline()"><span class="editor-toolbar">__</span></button>
<button onclick="toggleStrike()"><span class="editor-toolbar">~~</span></button>
<button onclick="toggleCode()"><span class="editor-toolbar">`</span></button>
<button onclick="toggleListBullet()"><span class="editor-toolbar">•</span></button>
<button onclick="toggleListNumber()"><span class="editor-toolbar">1.</span></button>
<button onclick="toggleCheckbox()"><span class="editor-toolbar">✓</span></button>
<button onclick="toggleQuote()"><span class="editor-toolbar">> </span></button>
<button onclick="toggleBlockquote()"><span class="editor-toolbar">“ ”</span></button>
<button onclick="toggleListContinuation()">⌥+Enter</button>
<button onclick="undo()"><span class="editor-toolbar">⌫</span></button>
<button onclick="redo()"><span class="editor-toolbar">⇧⌘+Y</span></button>
</div>
<div id="note-list" class="note-list"></div>
<div id="editor" contenteditable="true" placeholder="Start writing..."></div>
</div>
</div>
<script>
/* ==== CONFIG ====
* Auto-save debounce ms
* Snippet length (chars) for preview
* Theme: light/dark
* Layout state (collapsed, open sidebar)
* */
const CONFIG = {
AUTO_SAVE: 1500,
SNAPSHOT_DELAY: 500,
MIN_SNIPPET_LEN: 3,
THEME: 'light',
LAYOUT: {sidebarCollapsed: false, theme: 'light'},
SELECTION: null,
EDITOR: null,
NOTES: [],
CURRENT_NOTE: null,
TRASH: [],
SEARCH_TERM: '',
SEARCH_RESULTS: [],
FORMATTING_STATE: {bold: false, italic: false, underline: false, strikethrough: false, code: false, h1: false, h2: false, h3: false, listBullet: false, listNumber: false, checklist: false, blockquote: false},
SEARCH_FILTERED: [],
THEME_ICON: '',
FONT_SERIF: 'Georgia, serif'
};
let lastSaved = Date.now();
let autoSaveTimer = null;
let searchTimer = null;
/* ==== DATA MODEL ==== */
function findNoteIndex(notes, id) {
return notes.findIndex(n => n.id === id);
}
function getNote(notes, id) {
return notes.find(n => n.id === id);
}
function saveNotes() {
localStorage.setItem('notesApp', JSON.stringify(CONFIG.NOTES || CONFIG.NOTES || []));
localStorage.setItem('notesApp:selected', CONFIG.SELECTED_NOTE_ID);
localStorage.setItem('notesApp:theme', CONFIG.THEME);
localStorage.setItem('notesApp:layout', JSON.stringify(CONFIG.LAYOUT));
localStorage.setItem('notesApp:search', CONFIG.SEARCH_TERM);
localStorage.setItem('notesApp:searchResults', JSON.stringify(CONFIG.SEARCH_RESULTS));
localStorage.setItem('notesApp:trash', CONFIG.TRASH);
localStorage.setItem('notesApp:sortOrder', JSON.stringify(CONFIG.SORT_ORDER || 'created'));
lastSaved = Date.now();
}
function loadNotes() {
const nb = localStorage.getItem('notesApp');
if (nb) CONFIG.NOTES = JSON.parse(nb);
const ts = localStorage.getItem('notesApp:theme');
if (ts) CONFIG.THEME = ts;
const layout = localStorage.getItem('notesApp:layout');
if (layout) CONFIG.LAYOUT = JSON.parse(layout);
const search = localStorage.getItem('notesApp:search');
if (search) CONFIG.SEARCH_TERM = search;
const results = localStorage.getItem('notesApp:searchResults');
if (results) CONFIG.SEARCH_RESULTS = JSON.parse(results);
const trash = localStorage.getItem('notesApp:trash');
if (trash) CONFIG.TRASH = JSON.parse(trash);
const sort = localStorage.getItem('notesApp:sortOrder');
if (sort) CONFIG.SORT_ORDER = sort;
render();
}
function setSelectedNote(id) {
CONFIG.SELECTED_NOTE_ID = id;
updateEditor();
}
function setCurrentNote(note) {
CONFIG.CURRENT_NOTE = note;
updateEditor();
}
function setSearch(term) {
CONFIG.SEARCH_TERM = term;
CONFIG.SEARCH_RESULTS = [];
if (!term) return;
const all = CONFIG.NOTES.concat(CONFIG.TRASH);
for (const n of all) {
if (n.title.toLowerCase().includes(term.toLowerCase()) ||
n.body.toLowerCase().includes(term.toLowerCase())) {
CONFIG.SEARCH_RESULTS.push(n);
}
}
updateSearchResults();
}
function updateSearchResults() {
const term = CONFIG.SEARCH_TERM;
if (!term) { CONFIG.SEARCH_RESULTS = []; return; }
const all = CONFIG.NOTES.concat(CONFIG.TRASH);
CONFIG.SEARCH_RESULTS = [];
for (const n of all) {
if (n.title.toLowerCase().includes(term.toLowerCase()) ||
n.body.toLowerCase().includes(term.toLowerCase())) {
CONFIG.SEARCH_RESULTS.push(n);
}
}
updateSearchResultsUI();
}
function updateSearchResultsUI() {
const list = document.getElementById('note-list');
list.innerHTML = '';
if (CONFIG.SEARCH_RESULTS.length === 0) {
const item = document.createElement('li');
item.textContent = 'No results';
item.style.padding = '.3rem .5rem';
item.style.color = '#888';
list.appendChild(item);
return;
}
CONFIG.SEARCH_RESULTS.forEach(n => {
const li = document.createElement('li');
li.textContent = n.title;
li.style.padding = '.2rem .5rem';
li.style.cursor = 'pointer';
li.onclick = () => setSelectedNote(n.id);
list.appendChild(li);
});
}
function render() {
// Sidebar
const sidebar = document.getElementById('sidebar');
const nbList = document.getElementById('notebook-list');
const trashSection = document.getElementById('trash-section');
const trashList = document.getElementById('trash-list');
// Notebooks
if (CONFIG.NOTES.length === 0) {
nbList.innerHTML = `<li class="sidebar-title">No notebooks</li>`;
return;
}
const nbMap = {};
CONFIG.NOTES.forEach(n => {
nbMap[n.id] = n;
const li = document.createElement('li');
li.className = 'sidebar-note' + (n.folded ? ' collapsible' : '');
if (n.id === CONFIG.SELECTED_NOTE_ID) {
li.classList.add('selected');
}
if (n.trash && !CONFIG.TRASH.includes(n.id)) {
li.classList.add('trash-note');
}
// Folded
if (n.folded) {
li.innerHTML = `<span class="sidebar-note-full">${n.title}</span>`;
li.onclick = () => toggleCollapse(n.id);
} else {
li.innerHTML = `<span>${n.title}</span>`;
li.onclick = () => setSelectedNote(n.id);
// Checklist
if (n.checklist && n.checklist && n.checked) {
li.innerHTML = `<input type="checkbox" class="checkbox" checked><span>${n.title}</span>`;
}
// Checkbox toggle
if (n.checklist && !n.checked) {
li.onclick = e => { e.stopPropagation(); toggleCheckbox(n.id); };
}
}
nbList.appendChild(li);
// Trash
if (n.trash && !CONFIG.TRASH.includes(n.id)) {
trashList.innerHTML += `<li class="trash-note" id="trash-${n.id}"><span class="trash-icon" onclick="toggleTrash(${n.id})">✔</span><span>${n.title}</span></li>`;
}
});
// Collapse if needed
if (CONFIG.LAYOUT.sidebarCollapsed) {
sidebar.classList.add('collapsed');
const nb = sidebar.querySelector('.sidebar-title');
nb.style.flex = '0 0 auto';
nb.style.overflow = 'hidden';
// Hide all notes
document.querySelectorAll('.sidebar-note').forEach(el => el.style.display = 'none');
} else {
sidebar.classList.remove('collapsed');
document.querySelectorAll('.sidebar-note').forEach(el => el.style.display = '');
}
// Editor
const editor = document.getElementById('editor');
editor.innerHTML = CONFIG.CURRENT_NOTE ? CONFIG.CURRENT_NOTE.body : '<p>Start writing...</p>';
// Toolbar
document.querySelectorAll('.editor-toolbar button').forEach(btn => {
btn.onclick = () => {
if (btn.textContent.includes('B')) toggleBold();
else if (btn.textContent.includes('I')) toggleItalic();
else if (btn.textContent.includes('U')) toggleUnderline();
else if (btn.textContent.includes('S')) toggleStrike();
else if (btn.textContent.includes('`')) toggleCode();
else if (btn.textContent.includes('•')) toggleListBullet();
else if (btn.textContent.includes('1.')) toggleListNumber();
else if (btn.textContent.includes('✓')) toggleCheckbox();
else if (btn.textContent.includes('“')) toggleQuote();
else if (btn.textContent.includes('“ ‘')) toggleBlockquote();
else if (btn.textContent.includes('⌥+Enter')) toggleListContinuation();
else if (btn.textContent.includes('⌫')) undo();
else if (btn.textContent.includes('⇧⌘+Y')) redo();
};
});
// Controls
document.getElementById('toggleSidebar').onclick = () => {
CONFIG.LAYOUT.sidebarCollapsed = !CONFIG.LAYOUT.sidebarCollapsed;
render();
};
document.getElementById('toggleTheme').onclick = toggleTheme();
document.getElementById('toggleSearch').onclick = () => { document.querySelector('.search-bar').focus(); };
// Editor
editor.contentEditable = true;
editor.focus();
editor.oninput = debounce(() => {
saveNotes();
updateEditor();
}, CONFIG.AUTO_SAVE);
editor.onkeydown = e => handleKey(e, editor);
editor.onfocusout = () => setSelectedNote(CONFIG.CURRENT_NOTE?.id || null);
// Sort order
document.querySelector('.sort-order-btn').onclick = () => {
const order = CONFIG.SORT_ORDER === 'created' ? 'modified' : 'created';
CONFIG.SORT_ORDER = order;
sortNotes(CONFIG.NOTES, order);
saveNotes();
updateEditor();
};
// Move notes
editor.ondragover = e => e.preventDefault();
editor.ondrop = e => {
e.preventDefault();
if (!CONFIG.CURRENT_NOTE) return;
const id = CONFIG.CURRENT_NOTE.id;
const data = {id, target: e.target.closest('.sidebar-note')?.id };
if (data.target) {
moveNote(id, data.target);
saveNotes();
}
};
// Trash
function toggleTrash(id) {
const note = CONFIG.NOTES.find(n => n.id === id);
if (!note) return;
note.trash = !note.trash;
if (note.trash) {
CONFIG.TRASH.push(note.id);
CONFIG.NOTES = CONFIG.NOTES.filter(n => !note.trash);
} else {
CONFIG.NOTES.push(note);
CONFIG.TRASH = CONFIG.TRASH.filter(tid => tid !== note.id);
}
saveNotes();
updateTrashList();
}
function updateTrashList() {
const list = document.getElementById('trash-list');
list.innerHTML = '';
CONFIG.TRASH.forEach(id => {
const n = CONFIG.NOTES.find(n => n.id === id);
if (!n) return;
const li = document.createElement('li');
li.className = 'trash-note';
li.id = `trash-${id}`;
li.innerHTML = `<span class="trash-icon" onclick="toggleTrash(${id})">✔</span><span>${n.title}</span>`;
list.appendChild(li);
});
}
// Search
function updateSearchResultsUI() {
const list = document.getElementById('note-list');
list.innerHTML = '';
CONFIG.SEARCH_RESULTS.forEach(n => {
const li = document.createElement('li');
li.textContent = n.title;
li.style.padding = '.2rem .5rem';
li.style.cursor = 'pointer';
li.onclick = () => setSelectedNote(n.id);
list.appendChild(li);
});
}
// Helpers
function toggleBold() {
CONFIG.FORMATTING_STATE.bold = !CONFIG.FORMATTING_STATE.bold;
updateToolbar();
applyFormatting('bold');
}
function toggleItalic() {
CONFIG.FORMATTING_STATE.italic = !CONFIG.FORMATTING_STATE.italic;
updateToolbar();
applyFormatting('italic');
}
function toggleUnderline() {
CONFIG.FORMATTING_STATE.underline = !CONFIG.FORMATTING_STATE.underline;
updateToolbar();
applyFormatting('underline');
}
function toggleStrikethrough() {
CONFIG.FORMATTING_STATE.strikethrough = !CONFIG.FORMATTING_STATE.strikethrough;
updateToolbar();
applyFormatting('strike');
}
function toggleCode() {
CONFIG.FORMATTING_STATE.code = !CONFIG.FORMATTING_STATE.code;
updateToolbar();
applyFormatting('code');
}
function toggleListBullet() {
CONFIG.FORMATTING_STATE.listBullet = !CONFIG.FORMATTING_STATE.listBullet;
updateToolbar();
applyFormatting('bullet');
}
function toggleListNumber() {
CONFIG.FORMATTING_STATE.listNumber = !CONFIG.FORMATTING_STATE.listNumber;
updateToolbar();
applyFormatting('number');
}
function toggleCheckbox() {
const el = editor.querySelector('.checkbox');
if (el) el.checked = !el.checked;
else {
const sel = CONFIG.CURRENT_NOTE;
if (!sel) return;
let check = false;
if (sel.checklist) {
check = !sel.checklist;
sel.checklist = check;
} else {
check = !!el.checked;
sel.checklist = check;
}
}
saveNotes();
updateEditor();
}
function toggleQuote() {
CONFIG.FORMATTING_STATE.blockquote = !CONFIG.FORMATTING_STATE.blockquote;
updateToolbar();
applyFormatting('blockquote');
}
function toggleBlockquote() {
CONFIG.FORMATTING_STATE.blockquote = !CONFIG.FORMATTING_STATE.blockquote;
updateToolbar();
applyFormatting('blockquote');
}
function toggleListContinuation(e) {
e.preventDefault();
if (!CONFIG.CURRENT_NOTE) return;
const sel = document.querySelector('.note-list .selected');
if (sel) {
const next = document.querySelector('.note-list li:not(.selected)');
if (next) {
CONFIG.NOTES.push({...CONFIG.CURRENT_NOTE, id: null, parentId: CONFIG.NOTES.findIndex(n => n.id === CONFIG.CURRENT_NOTE.id) + 1});
setSelectedNote(CONFIG.NOTES[CONFIG.NOTES.length - 1].id);
}
}
}
function undo() {
document.execCommand('undo');
saveNotes();
updateEditor();
}
function redo() {
document.execCommand('redo');
saveNotes();
updateEditor();
}
function handleKey(e, el) {
// Formatting shortcuts
if (e.key === 'b') { e.preventDefault(); toggleBold(); }
else if (e.key === 'i') { e.preventDefault(); toggleItalic(); }
else if (e.key === 'u') { e.preventDefault(); toggleUnderline(); }
else if (e.key === 's') { e.preventDefault(); toggleStrikethrough(); }
else if (e.key === '`') { e.preventDefault(); toggleCode(); }
else if (e.key === 'Enter' && !e.shiftKey) {
// List item
const sel = document.querySelector('.note-list li.selected');
if (sel) {
const next = document.querySelector('.note-list li:not(.selected)');
if (next) {
e.preventDefault();
setSelectedNote(CONFIG.NOTES.findIndex(n => n.id === CONFIG.CURRENT_NOTE.id) + 1);
} else {
// New item
const id = CONFIG.CURRENT_NOTE ? CONFIG.CURRENT_NOTE.id : null;
if (!id) {
const newNote = { ...CONFIG.CURRENT_NOTE, id: Date.now(), title: '', body: '' };
CONFIG.NOTES.push(newNote);
setSelectedNote(newNote.id);
}
}
} else if (e.target && e.target.tagName === 'SPAN') {
// Inline formatting
const sel = document.querySelector('.note-list li.selected');
if (sel) {
const text = el.textContent;
let formatted = '';
if (text.startsWith('#')) {
formatted = `<h1>${text.slice(1)}</h1>`;
} else if (text.startsWith('-')) {
formatted = `<ul><li>${text.slice(1).trim()}</li></ul>`;
} else if (text.startsWith('[') && text.endsWith(']')) {
formatted = `<span class="checklist">${text.slice(1, -1)}</span>`;
} else if (text.startsWith('>')) {
formatted = `<blockquote><p>${text.slice(1).trim()}</p></blockquote>`;
} else if (text.includes('`')) {
formatted = `<code>${text}</code>`;
} else {
formatted = text;
}
el.textContent = formatted;
}
}
}
// Selection
if (e.key === 'ArrowDown') { selectNote(el); e.preventDefault(); }
else if (e.key === 'ArrowUp') { selectNote(el); e.preventDefault(); }
else if (e.key === 'ArrowLeft') { document.execCommand('cut'); }
else if (e.key === 'ArrowRight') { document.execCommand('copy'); }
else if (e.key === 'Escape') { clearSelection(); }
}
function selectNote(el) {
const note = CONFIG.NOTES.find(n => n.id === CONFIG.SELECTED_NOTE_ID);
if (!note) return;
setSelectedNote(note.id);
// Scroll
const rect = el.getBoundingClientRect();
const editor = document.getElementById('editor');
editor.scrollIntoView(rect);
}
function clearSelection() {
document.querySelector('.note-list li.selected')?.classList.remove('selected');
}
function moveNote(id, targetId) {
const from = CONFIG.NOTES.find(n => n.id === id);
const to = CONFIG.NOTES.find(n => n.id === targetId);
if (!from || !to) return;
// Remove
CONFIG.NOTES = CONFIG.NOTES.filter(n => n.id !== id);
// Insert
if (to.parentId) {
to.parentId.children.push(from);
} else {
to.parentId = from;
}
}
function saveNotes() {
localStorage.setItem('notesApp', JSON.stringify(CONFIG.NOTES));
localStorage.setItem('notesApp:selected', CONFIG.SELECTED_NOTE_ID);
localStorage.setItem('notesApp:theme', CONFIG.THEME);
localStorage.setItem('notesApp:layout', JSON.stringify(CONFIG.LAYOUT));
localStorage.setItem('notesApp:search', CONFIG.SEARCH_TERM);
localStorage.setItem('notesApp:searchResults', JSON.stringify(CONFIG.SEARCH_RESULTS));
localStorage.setItem('notesApp:trash', CONFIG.TRASH);
localStorage.setItem('notesApp:sortOrder', JSON.stringify(CONFIG.SORT_ORDER));
}
function renderSidebar() {
const sidebar = document.getElementById('sidebar');
const nbList = document.getElementById('notebook-list');
const trashSection = document.getElementById('trash-section');
const trashList = document.getElementById('trash-list');
// Notebooks
if (
<!-- agent-meta {"model":"liquid/lfm2-24b-a2b","provider":"lmstudio","persona":"basic","sessionId":"996b8c73-8251-4ed6-86b1-4ad41e23e8c4","tokensIn":1291,"tokensOut":7221,"tokensTotal":8512,"cost":0,"turns":1,"toolCalls":0,"failedToolCalls":0,"timestamp":"2026-08-01T04:50:04.283Z"} -->