Improve layout of error display

Resources/views/errors.html.twig

@@ -6,14 +6,16 @@
     {% for log in logs %}
         {# @var log \App\Ardent\LoggerBundle\Entity\LogEntry #}
         <div class="card">
-            <div class="card-body">
-                <h5 class="card-title">{{ log.levelName }} #{{ log.id }}</h5>
-                <h6 class="card-subtitle mb-2 text-muted">{{ log.createdAt | date('D, d M y H:i:s') }}</h6>
+            <div class="card-header bg-dark text-white" role="button" data-toggle="collapse" data-target="#log-body{{ log.id }}">{{ log.levelName }} #{{ log.id }}</div>
+            <div class="card-body collapse" id="log-body{{ log.id }}">
                 <p class="card-text">{{ log.message }}</p>
-                {% for context in log.context %}
-                    <p class="card-text"> > {{ context }}</p>
-                {% endfor %}
+                <ul class="list-group list-group-flush">
+                    {% for context in log.context %}
+                        <li class="list-group-item">{{ context }}</li>
+                    {% endfor %}
+                </ul>
             </div>
+            <div class="card-footer">{{ log.createdAt | date('D, d M y H:i:s') }} </div>
         </div>
     {% endfor %}
 {% endblock %}