Standardized breadcrumbs a little further with icons

resources/assets/sass/_header.scss

@@ -200,14 +200,24 @@ header .search-box {
   display: flex;
   flex-direction: row;
   align-items: center;
-}
+  justify-content: flex-start;
-
+  flex-wrap: wrap;
-.breadcrumbs .separator {
+  .icon-list-item {
-  fill: #aaa;
+    width: auto;
-  font-size: 1.6em;
+    padding-top: $-xs;
-  line-height: 0.8;
+    padding-bottom: $-xs;
-  margin: 0 $-xs;
+    &:not(:hover) {
-  margin-top: -2px;
+      color: #666;
+      fill: #888;
+    }
+  }
+  .separator {
+    display: inline-block;
+    fill: #aaa;
+    font-size: 1.6em;
+    line-height: 0.8;
+    margin: -2px 0 0;
+  }
 }
 
 .faded {

resources/views/books/create.blade.php

@@ -2,10 +2,16 @@
 
 @section('body')
     <div class="container small">
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
-                '/books' => trans('entities.books'),
+                '/books' => [
-                '/create-book' => trans('entities.books_create')
+                    'text' => trans('entities.books'),
+                    'icon' => 'book'
+                ],
+                '/create-book' => [
+                    'text' => trans('entities.books_create'),
+                    'icon' => 'add'
+                ]
             ]])
         </div>
 

resources/views/books/delete.blade.php

@@ -4,10 +4,13 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $book,
-                $book->getUrl('/delete') => trans('entities.books_delete')
+                $book->getUrl('/delete') => [
+                    'text' => trans('entities.books_delete'),
+                    'icon' => 'delete',
+                ]
             ]])
         </div>
 

resources/views/books/edit.blade.php

@@ -4,10 +4,13 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $book,
-                $book->getUrl('/edit') => trans('entities.books_edit')
+                $book->getUrl('/edit') => [
+                    'text' => trans('entities.books_edit'),
+                    'icon' => 'edit',
+                ]
             ]])
         </div>
 

resources/views/books/permissions.blade.php

@@ -4,10 +4,13 @@
 
     <div class="container">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $book,
-                $book->getUrl('/permissions') => trans('entities.books_permissions')
+                $book->getUrl('/permissions') => [
+                    'text' => trans('entities.books_permissions'),
+                    'icon' => 'lock',
+                ]
             ]])
         </div>
 

resources/views/books/sort.blade.php

@@ -6,7 +6,7 @@
 
     <div class="container">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $book,
                 $book->getUrl('/sort') => [

resources/views/chapters/_breadcrumbs.blade.php

@@ -1,4 +0,0 @@
-@include('partials.breadcrumbs', ['crumbs' => [
-        $chapter->book,
-        $chapter,
-]])

resources/views/chapters/create.blade.php

@@ -3,10 +3,13 @@
 @section('body')
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $book,
-                $book->getUrl('create-chapter') => trans('entities.chapters_create')
+                $book->getUrl('create-chapter') => [
+                    'text' => trans('entities.chapters_create'),
+                    'icon' => 'add',
+                ]
             ]])
         </div>
 

resources/views/chapters/delete.blade.php

@@ -4,11 +4,14 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $chapter->book,
                 $chapter,
-                $chapter->getUrl('/delete') => trans('entities.chapters_delete')
+                $chapter->getUrl('/delete') => [
+                    'text' => trans('entities.chapters_delete'),
+                    'icon' => 'delete',
+                ]
             ]])
         </div>
 

resources/views/chapters/edit.blade.php

@@ -4,11 +4,14 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $book,
                 $chapter,
-                $chapter->getUrl('/edit') => trans('entities.chapters_edit')
+                $chapter->getUrl('/edit') => [
+                    'text' => trans('entities.chapters_edit'),
+                    'icon' => 'edit'
+                ]
             ]])
         </div>
 

resources/views/chapters/move.blade.php

@@ -4,11 +4,14 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $chapter->book,
                 $chapter,
-                $chapter->getUrl('/move') => trans('entities.chapters_move')
+                $chapter->getUrl('/move') => [
+                    'text' => trans('entities.chapters_move'),
+                    'icon' => 'folder',
+                ]
             ]])
         </div>
 

resources/views/chapters/permissions.blade.php

@@ -4,11 +4,14 @@
 
     <div class="container">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $chapter->book,
                 $chapter,
-                $chapter->getUrl('/permissions') => trans('entities.chapters_permissions')
+                $chapter->getUrl('/permissions') => [
+                    'text' => trans('entities.chapters_permissions'),
+                    'icon' => 'lock',
+                ]
             ]])
         </div>
 

resources/views/chapters/show.blade.php

@@ -9,7 +9,10 @@
 @section('body')
 
     <div class="mb-m">
-        @include('chapters._breadcrumbs', ['chapter' => $chapter])
+        @include('partials.breadcrumbs', ['crumbs' => [
+            $chapter->book,
+            $chapter,
+        ]])
     </div>
 
     <div class="content-wrap card">

resources/views/pages/_breadcrumbs.blade.php

@@ -1,5 +0,0 @@
-@include('partials.breadcrumbs', ['crumbs' => [
-        $page->book,
-        $page->hasChapter() ? $page->chapter : null,
-        $page,
-]])

resources/views/pages/copy.blade.php

@@ -4,12 +4,15 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $page->book,
                 $page->chapter,
                 $page,
-                $page->getUrl('/copy') => trans('entities.pages_copy')
+                $page->getUrl('/copy') => [
+                    'text' => trans('entities.pages_copy'),
+                    'icon' => 'copy',
+                ]
             ]])
         </div>
 

resources/views/pages/delete.blade.php

@@ -4,12 +4,15 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $page->book,
                 $page->chapter,
                 $page,
-                $page->getUrl('/delete') => trans('entities.pages_delete')
+                $page->getUrl('/delete') => [
+                    'text' => trans('entities.pages_delete'),
+                    'icon' => 'delete',
+                ]
             ]])
         </div>
 

resources/views/pages/move.blade.php

@@ -4,12 +4,15 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $page->book,
                 $page->chapter,
                 $page,
-                $page->getUrl('/move') => trans('entities.pages_move')
+                $page->getUrl('/move') => [
+                    'text' => trans('entities.pages_move'),
+                    'icon' => 'folder',
+                ]
             ]])
         </div>
 

resources/views/pages/permissions.blade.php

@@ -4,12 +4,15 @@
 
     <div class="container">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $page->book,
                 $page->chapter,
                 $page,
-                $page->getUrl('/permissions') => trans('entities.pages_permissions')
+                $page->getUrl('/permissions') => [
+                    'text' => trans('entities.pages_permissions'),
+                    'icon' => 'lock',
+                ]
             ]])
         </div>
 

resources/views/pages/revision.blade.php

@@ -16,7 +16,10 @@
             $page->$book,
             $page->chapter,
             $page,
-            $page->getUrl('/revisions') => trans('entities.pages_revisions'),
+            $page->getUrl('/revisions') => [
+                'text' => trans('entities.pages_revisions'),
+                'icon' => 'history',
+            ],
             $revision->getUrl('/changes') => $diff ? trans('entities.pages_revisions_numbered_changes', ['id' => $revision->id]) : null,
             $revision->getUrl() => !$diff ? trans('entities.pages_revisions_numbered', ['id' => $revision->id]) : null,
         ]])

resources/views/pages/revisions.blade.php

@@ -3,12 +3,15 @@
 @section('body')
     <div class="container">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $page->book,
                 $page->chapter,
                 $page,
-                $page->getUrl('/revisions') => trans('entities.pages_revisions')
+                $page->getUrl('/revisions') => [
+                    'text' => trans('entities.pages_revisions'),
+                    'icon' => 'history',
+                ]
             ]])
         </div>
 

resources/views/pages/show.blade.php

@@ -3,7 +3,11 @@
 @section('body')
 
     <div class="mb-m">
-        @include('pages._breadcrumbs', ['page' => $page])
+        @include('partials.breadcrumbs', ['crumbs' => [
+            $page->book,
+            $page->hasChapter() ? $page->chapter : null,
+            $page,
+        ]])
     </div>
 
     <div class="content-wrap card">

resources/views/partials/breadcrumbs.blade.php

@@ -13,34 +13,16 @@
                 {{ $crumb }}
             </a>
         @elseif (is_array($crumb))
-            <a href="{{  baseUrl($key)  }}">
+            <a href="{{  baseUrl($key)  }}" class="icon-list-item">
-                @icon($crumb['icon']) {{ $crumb['text'] }}
+                <span>@icon($crumb['icon'])</span>
+                <span>{{ $crumb['text'] }}</span>
             </a>
         @elseif($crumb instanceof \BookStack\Entities\Entity)
-            <a href="{{ $crumb->getUrl() }}" class="text-{{$crumb->getType()}}">
+            <a href="{{ $crumb->getUrl() }}" class="text-{{$crumb->getType()}} icon-list-item">
-                @icon($crumb->getType()){{ $crumb->getShortName() }}
+                <span>@icon($crumb->getType())</span>
+                <span>{{ $crumb->getShortName() }}</span>
             </a>
         @endif
         <?php $breadcrumbCount++; ?>
     @endforeach
-
-    {{--@if (isset($book) && userCan('view', $book))--}}
-        {{--<a href="{{ $book->getUrl() }}" class="text-book">--}}
-            {{--@icon('book'){{ $book->getShortName() }}--}}
-        {{--</a>--}}
-        {{--<div class="separator">@icon('chevron-right')</div>--}}
-    {{--@endif--}}
-    {{--@if(isset($chapter) && userCan('view', $chapter))--}}
-        {{--<a href="{{ $chapter->getUrl() }}" class="text-chapter">--}}
-            {{--@icon('chapter'){{ $chapter->getShortName() }}--}}
-        {{--</a>--}}
-        {{--@if (isset($page))--}}
-            {{--<div class="separator">@icon('chevron-right')</div>--}}
-        {{--@endif--}}
-    {{--@endif--}}
-    {{--@if(isset($page) && userCan('view', $page))--}}
-        {{--<a href="{{ $page->getUrl() }}" class="text-page">--}}
-            {{--@icon('page'){{ $page->getShortName() }}--}}
-        {{--</a>--}}
-    {{--@endif--}}
 </div>

resources/views/shelves/create.blade.php

@@ -4,10 +4,16 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
-                '/shelves' => trans('entities.shelves'),
+                '/shelves' => [
-                '/create-shelf' => trans('entities.shelves_create')
+                    'text' => trans('entities.shelves'),
+                    'icon' => 'bookshelf',
+                ],
+                '/create-shelf' => [
+                    'text' => trans('entities.shelves_create'),
+                    'icon' => 'add',
+                ]
             ]])
         </div>
 

resources/views/shelves/delete.blade.php

@@ -4,10 +4,13 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $shelf,
-                $shelf->getUrl('/delete') => trans('entities.shelves_delete')
+                $shelf->getUrl('/delete') => [
+                    'text' => trans('entities.shelves_delete'),
+                    'icon' => 'delete',
+                ]
             ]])
         </div>
 

resources/views/shelves/edit.blade.php

@@ -4,10 +4,13 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $shelf,
-                $shelf->getUrl('/edit') => trans('entities.shelves_edit')
+                $shelf->getUrl('/edit') => [
+                    'text' => trans('entities.shelves_edit'),
+                    'icon' => 'edit',
+                ]
             ]])
         </div>
 

resources/views/shelves/permissions.blade.php

@@ -4,10 +4,13 @@
 
     <div class="container small">
 
-        <div class="my-l">
+        <div class="my-s">
             @include('partials.breadcrumbs', ['crumbs' => [
                 $shelf,
-                $shelf->getUrl('/permissions') => trans('entities.shelves_permissions')
+                $shelf->getUrl('/permissions') => [
+                    'text' => trans('entities.shelves_permissions'),
+                    'icon' => 'lock',
+                ]
             ]])
         </div>
 

resources/views/tri-layout.blade.php

@@ -8,9 +8,9 @@
         {{--@yield('toolbar')--}}
     {{--</div>--}}
 
-    <div class="tri-layout-container mt-xl" tri-layout @yield('container-attrs') >
+    <div class="tri-layout-container mt-m" tri-layout @yield('container-attrs') >
 
-        <div class="tri-layout-left print-hidden " id="sidebar">
+        <div class="tri-layout-left print-hidden pt-m" id="sidebar">
             <div class="tri-layout-left-contents">
                 @yield('left')
             </div>
@@ -20,7 +20,7 @@
             @yield('body')
         </div>
 
-        <div class="tri-layout-right print-hidden">
+        <div class="tri-layout-right print-hidden pt-m">
             <div class="tri-layout-right-contents">
                 @yield('right')
             </div>