FallenBirdyForm/app/templates/notizen/object_notizen.html
2025-06-10 14:49:08 +02:00

125 lines
3.5 KiB
HTML

{% load static %}
{% load notizen_tags %}
<!-- Notizen für dieses Objekt -->
{% if notizen_with_html %}
<div class="mt-4">
<h4>
<i class="fas fa-sticky-note text-primary"></i>
Notizen ({{ notizen_with_html|length }})
</h4>
{% for item in notizen_with_html %}
<div class="card mb-3">
<div class="card-header">
<div class="d-flex justify-content-between align-items-center">
<h5 class="mb-0">{{ item.notiz.name }}</h5>
<div class="btn-group btn-group-sm">
<a href="{% url 'notizen:edit' item.notiz.pk %}" class="btn btn-outline-primary">
<i class="fas fa-edit"></i> Bearbeiten
</a>
<a href="{% url 'notizen:detail' item.notiz.pk %}" class="btn btn-outline-secondary">
<i class="fas fa-external-link-alt"></i> Vollansicht
</a>
</div>
</div>
<small class="text-muted">
Von {{ item.notiz.erstellt_von.get_full_name|default:item.notiz.erstellt_von.username }}
am {{ item.notiz.erstellt_am|date:"d.m.Y H:i" }}
{% if item.notiz.geaendert_am != item.notiz.erstellt_am %}
(bearbeitet am {{ item.notiz.geaendert_am|date:"d.m.Y H:i" }})
{% endif %}
</small>
</div>
<div class="card-body">
<div class="notiz-content">
{{ item.html_content|safe }}
</div>
</div>
</div>
{% endfor %}
</div>
{% endif %}
<!-- Button zum Hinzufügen einer neuen Notiz -->
<div class="mt-3">
{% if user.is_authenticated %}
<a href="{% url 'notizen:attach' content_type.id content_object.pk %}" class="btn btn-outline-primary">
<i class="fas fa-plus"></i> Notiz hinzufügen
</a>
{% endif %}
</div>
<style>
.notiz-content {
line-height: 1.6;
}
.notiz-content h1, .notiz-content h2, .notiz-content h3,
.notiz-content h4, .notiz-content h5, .notiz-content h6 {
margin-top: 1rem;
margin-bottom: 0.5rem;
}
.notiz-content h1:first-child, .notiz-content h2:first-child,
.notiz-content h3:first-child, .notiz-content h4:first-child,
.notiz-content h5:first-child, .notiz-content h6:first-child {
margin-top: 0;
}
.notiz-content p {
margin-bottom: 0.75rem;
}
.notiz-content pre {
background-color: #f8f9fa;
border: 1px solid #e9ecef;
border-radius: 0.375rem;
padding: 0.75rem;
overflow-x: auto;
font-size: 0.875em;
}
.notiz-content code {
background-color: #f8f9fa;
padding: 0.125rem 0.25rem;
border-radius: 0.25rem;
font-size: 0.875em;
}
.notiz-content pre code {
background-color: transparent;
padding: 0;
}
.notiz-content blockquote {
border-left: 4px solid #dee2e6;
padding-left: 1rem;
margin: 1rem 0;
color: #6c757d;
font-style: italic;
}
.notiz-content ul, .notiz-content ol {
margin-bottom: 0.75rem;
padding-left: 1.5rem;
}
.notiz-content table {
width: 100%;
margin-bottom: 1rem;
border-collapse: collapse;
}
.notiz-content table th,
.notiz-content table td {
padding: 0.5rem;
border: 1px solid #dee2e6;
text-align: left;
}
.notiz-content table th {
background-color: #f8f9fa;
font-weight: 600;
}
</style>