FEATURE: make history overview nicer

resources/assets/admin/css/vendor.css

@@ -14260,7 +14260,7 @@ img {
 	margin-left: -20px;
 }
 
-.timeline > li {
+.timeline:not(.more-space) > li {
 	margin-top: -25px;
 }
 

resources/views/admin/history/overview.blade.php

@@ -4,30 +4,35 @@
 @section('pageDescription', $page->meta_description)
 
 @section('content')
-    <div id="accordion" role="tablist" aria-multiselectable="true">
+    <ul class="timeline more-space">
+        <?php $odd = false; ?>
         @foreach($history['changesets'] as $revision => $changes)
-            <div class="panel panel-default">
-                <div class="panel-heading" role="tab" id="heading-{{$revision}}">
-                    <h6 class="panel-title">
-                        <a class="collapsed" data-toggle="collapse" data-parent="#accordion"
-                           href="#revision-{{$revision}}" aria-expanded="false" aria-controls="revision-{{$revision}}">
-                            <strong>{{$history['info'][$revision]['user']['name']}}</strong> |
-                            @date($history['info'][$revision]['changed_at']) |
-                            {{trans_choice('admin/history.numOfChanges', count($changes))}}
-                        </a>
-                    </h6>
+            <li @if($odd) class="timeline-inverted" @endif>
+                <?php $odd = !$odd;?>
+                <div class="timeline-badge big"
+                     style="background: url('{{\App\Helpers\Gravatar::img($history['info'][$revision]['user']['email'], 40)}}') no-repeat center center"
+                     data-toggle="tooltip" data-placement="top"
+                     title="{{$history['info'][$revision]['user']['name']}} {{$history['info'][$revision]['user']['email']}}"></div>
+                <div class="timeline-panel">
+                    <div class="timeline-heading">
+                        <h5 class="timeline-title">{{$revision}}
+                            <small class="text-muted">
+                                @date($history['info'][$revision]['changed_at'])
+                            </small>
+                        </h5>
                     </div>
-                <div id="revision-{{$revision}}" class="panel-collapse collapse" role="tabpanel"
-                     aria-labelledby="heading-{{$revision}}">
+                    <div class="timeline-body">
                         @foreach($changes as $change)
-                            <div class="accordion-content" data-tab-content>
+                            <p>
                                 <strong>{{$change->column_trans}}</strong>: {!! $change->diff !!}
-                            </div>
+                            </p>
                         @endforeach
                     </div>
                 </div>
+            </li>
         @endforeach
-    </div>
+    </ul>
+
     <a href="{{route('content.edit', ['id' => $page->id])}}" class="btn btn-primary">
         @lang('admin/history.backToEdit')
     </a>