Spaces:
Runtime error
Runtime error
File size: 6,360 Bytes
665eca1 1476658 665eca1 1476658 665eca1 1476658 665eca1 1476658 665eca1 1476658 665eca1 1476658 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 | {% extends "base.html" %}
{% block content %}
<div class="max-w-7xl mx-auto px-4 sm:px-6">
<div class="mb-8">
<h1 class="font-display text-4xl sm:text-5xl font-bold tracking-tight mb-2">
<span class="bg-gradient-to-r from-blue-400 to-purple-500 bg-clip-text text-transparent">
All Notes
</span>
</h1>
<p class="font-mono text-sm text-gray-400">{{ notes|length }} notes available</p>
</div>
<!-- Search & Filter -->
<form method="GET" class="glass p-4 rounded-xl mb-8">
<div class="grid grid-cols-1 md:grid-cols-5 gap-3">
<input type="text" name="search" placeholder="Search..." value="{{ search or '' }}"
class="bg-white/5 border border-white/10 rounded-lg px-3 py-2 font-mono text-xs focus:outline-none focus:border-blue-500 transition">
<select name="subject"
class="bg-white/5 border border-white/10 rounded-lg px-3 py-2 font-mono text-xs focus:outline-none focus:border-blue-500 transition">
<option value="">All Subjects</option>
{% for subject in subjects %}
<option value="{{ subject.id }}" {% if selected_subject == subject.id|string %}selected{% endif %}>
{{ subject.name }}
</option>
{% endfor %}
</select>
<select name="note_type"
class="bg-white/5 border border-white/10 rounded-lg px-3 py-2 font-mono text-xs focus:outline-none focus:border-blue-500 transition">
<option value="">All Types</option>
{% for note_type in note_types %}
<option value="{{ note_type.id }}" {% if selected_note_type == note_type.id|string %}selected{% endif %}>
{{ note_type.name }}
</option>
{% endfor %}
</select>
<select name="sort"
class="bg-white/5 border border-white/10 rounded-lg px-3 py-2 font-mono text-xs focus:outline-none focus:border-blue-500 transition">
<option value="newest" {% if selected_sort == 'newest' %}selected{% endif %}>Newest first</option>
<option value="oldest" {% if selected_sort == 'oldest' %}selected{% endif %}>Oldest first</option>
<option value="title" {% if selected_sort == 'title' %}selected{% endif %}>Title A-Z</option>
</select>
<div class="flex gap-2">
<button type="submit" class="flex-1 bg-blue-500/20 border border-blue-500/50 rounded-lg px-3 py-2 font-mono text-xs hover:bg-blue-500/30 transition">
Filter
</button>
<a href="{{ url_for('notes.list') }}" class="flex-1 bg-white/5 border border-white/10 rounded-lg px-3 py-2 font-mono text-xs text-center hover:bg-white/10 transition">
Clear
</a>
</div>
</div>
</form>
<!-- Notes Grid -->
{% if notes %}
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
{% for note in notes %}
<div class="glass p-5 rounded-xl card-hover group cursor-pointer note-card" data-href="{{ url_for('notes.preview', id=note.id) }}" role="link" tabindex="0">
<div class="flex items-start justify-between mb-3">
<div class="flex-1">
<h3 class="font-display text-lg font-bold mb-1 group-hover:text-blue-400 transition truncate">
{{ note.title }}
</h3>
<div class="flex gap-2 mb-2">
<span class="px-2 py-0.5 bg-blue-500/20 border border-blue-500/50 rounded-md font-mono text-[10px]">
{{ note.subject.name }}
</span>
<span class="px-2 py-0.5 bg-purple-500/20 border border-purple-500/50 rounded-md font-mono text-[10px]">
{{ note.note_type.name }}
</span>
<span class="px-2 py-0.5 bg-white/5 border border-white/10 rounded-md font-mono text-[10px] text-gray-400">
{% if note.original_link %}Link{% else %}File{% endif %}
</span>
</div>
</div>
</div>
{% if note.description %}
<p class="font-mono text-xs text-gray-400 mb-3 line-clamp-2">{{ note.description }}</p>
{% endif %}
<div class="flex items-center gap-2 mb-3 font-mono text-[10px] text-gray-500">
<img src="https://api.dicebear.com/9.x/thumbs/svg?seed={{ note.user.email }}" alt="{{ note.user.name }} Avatar" class="w-5 h-5 rounded-full">
<span>{{ note.user.name }}</span>
<span>•</span>
<span>{{ note.created_at.strftime('%b %d, %Y') }}</span>
</div>
<div class="flex gap-2">
<a href="{{ url_for('notes.share', id=note.id) }}" class="flex-1 bg-white/5 border border-white/10 rounded-lg px-3 py-1.5 font-mono text-[10px] text-center hover:bg-white/10 transition interactive-link">
Share
</a>
</div>
</div>
{% endfor %}
</div>
{% else %}
<div class="glass p-12 rounded-2xl text-center">
<p class="font-mono text-gray-400">No notes found</p>
</div>
{% endif %}
</div>
<script>
document.addEventListener('DOMContentLoaded', function () {
const cards = document.querySelectorAll('.note-card[data-href]');
cards.forEach((card) => {
card.addEventListener('click', (event) => {
if (event.target.closest('a, button, input, select, textarea, form, label')) {
return;
}
window.location.href = card.dataset.href;
});
card.addEventListener('keydown', (event) => {
if (event.key === 'Enter' || event.key === ' ') {
event.preventDefault();
window.location.href = card.dataset.href;
}
});
});
});
</script>
{% endblock %}
|