Alle 3 er baseret på den faktiske Jinja-struktur i detail.html og er klar til at erstatte det eksisterende kort-layout direkte.
Lille initial-cirkel + navn + tid på én linje. Tekst nedenunder med kun et fast indent. Ingen bokse, ingen farvegte headers. Virker kompakt men er stadig behagelig at læse.
<div class="ln-thread">
{% for comment in comments %}
<div class="ln-msg {% if comment.er_system_besked %}system-msg{% endif %}">
<div class="ln-head">
<div class="ln-avatar {% if comment.er_system_besked %}sys{% endif %}">
{% if comment.er_system_besked %}<i class="bi bi-gear"></i>
{% else %}{{ comment.forfatter[:2]|upper }}{% endif %}
</div>
<span class="ln-name">{{ comment.forfatter }}</span>
<span class="ln-time">{{ comment.created_at.strftime('%d/%m-%Y %H:%M') }}</span>
</div>
<div class="ln-body">{{ comment.indhold|replace('\n','<br>')|safe }}</div>
</div>
{% endfor %}
<div class="ln-input">...form...</div>
</div>
Ingen avatarer. Kun tekst-rækker. En 3px venstre-streg i blå viser hvem der er tekniker vs. hvid/grå for alle andre. Højeste mulige informationsdensitet — ligner en IT-log.
<div class="jira-log">
{% for comment in comments %}
<div class="jira-row">
<div class="jira-stripe {% if comment.er_system_besked %}sys
{%- elif comment.er_intern %}tech{% endif %}"></div>
<div class="jira-inner">
<div class="jira-meta">
<strong>{{ comment.forfatter }}</strong>
{% if comment.er_intern %}<span class="badge bg-primary">BMC</span>{% endif %}
· {{ comment.created_at.strftime('%d/%m-%Y %H:%M') }}
</div>
<div class="jira-text">{{ comment.indhold|replace('\n','<br>')|safe }}</div>
</div>
</div>
{% endfor %}
</div>
Kunde-beskeder til venstre. BMC/tekniker-svar til højre. Ingen farvegte headers, ingen bobler — bare flad alignment og subtil baggrundsforskel. Klart at forstå hvem der sagde hvad.
<div class="inbox-feed">
{% for comment in comments %}
{% if comment.er_system_besked %}
<div class="ib-msg sys" style="align-self:center;max-width:90%">
{% elif comment.er_intern %}
<div class="ib-msg right">
{% else %}
<div class="ib-msg left">
{% endif %}
<div class="ib-bubble">{{ comment.indhold|replace('\n','<br>')|safe }}</div>
<div class="ib-meta">{{ comment.forfatter }} · {{ comment.created_at.strftime('%d/%m-%Y %H:%M') }}</div>
</div>
{% endfor %}
</div>