diff --git a/resources/sass/_colors.scss b/resources/sass/_colors.scss
index e01ecebc9..c51f01659 100644
--- a/resources/sass/_colors.scss
+++ b/resources/sass/_colors.scss
@@ -92,6 +92,6 @@
.bg-chapter {
background-color: var(--color-chapter);
}
-.bg-shelf {
+.bg-bookshelf {
background-color: var(--color-bookshelf);
}
diff --git a/resources/sass/_text.scss b/resources/sass/_text.scss
index 4ada34725..4322cb5a6 100644
--- a/resources/sass/_text.scss
+++ b/resources/sass/_text.scss
@@ -352,12 +352,21 @@ li > ol, li > ul {
overflow-wrap: break-word;
}
-.limit-text {
+.text-limit-lines-1 {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
+.text-limit-lines-2 {
+ // -webkit use here is actually standardised cross-browser:
+ // https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-line-clamp
+ display: -webkit-box;
+ -webkit-box-orient: vertical;
+ -webkit-line-clamp: 2;
+ overflow: hidden;
+}
+
/**
* Grouping
*/
diff --git a/resources/views/books/grid-item.blade.php b/resources/views/books/grid-item.blade.php
deleted file mode 100644
index e1d37753a..000000000
--- a/resources/views/books/grid-item.blade.php
+++ /dev/null
@@ -1,19 +0,0 @@
-<a href="{{$book->getUrl()}}" class="grid-card" data-entity-type="book" data-entity-id="{{$book->id}}">
- <div class="bg-book featured-image-container-wrap">
- <div class="featured-image-container" @if($book->cover) style="background-image: url('{{ $book->getBookCover() }}')"@endif>
- </div>
- @icon('book')
- </div>
- <div class="grid-card-content">
- <h2>{{$book->getShortName(35)}}</h2>
- @if(isset($book->searchSnippet))
- <p class="text-muted">{!! $book->searchSnippet !!}</p>
- @else
- <p class="text-muted">{{ $book->getExcerpt(130) }}</p>
- @endif
- </div>
- <div class="grid-card-footer text-muted ">
- <p>@icon('star')<span title="{{$book->created_at->toDayDateTimeString()}}">{{ trans('entities.meta_created', ['timeLength' => $book->created_at->diffForHumans()]) }}</span></p>
- <p>@icon('edit')<span title="{{ $book->updated_at->toDayDateTimeString() }}">{{ trans('entities.meta_updated', ['timeLength' => $book->updated_at->diffForHumans()]) }}</span></p>
- </div>
-</a>
\ No newline at end of file
diff --git a/resources/views/books/list.blade.php b/resources/views/books/list.blade.php
index 42a2757f9..52cd935d1 100644
--- a/resources/views/books/list.blade.php
+++ b/resources/views/books/list.blade.php
@@ -1,4 +1,3 @@
-
<main class="content-wrap mt-m card">
<div class="grid half v-center no-row-gap">
<h1 class="list-heading">{{ trans('entities.books') }}</h1>
@@ -22,7 +21,7 @@
@else
<div class="grid third">
@foreach($books as $key => $book)
- @include('books.grid-item', ['book' => $book])
+ @include('partials.entity-grid-item', ['entity' => $book])
@endforeach
</div>
@endif
diff --git a/resources/views/pages/show.blade.php b/resources/views/pages/show.blade.php
index 48c88434e..13125464a 100644
--- a/resources/views/pages/show.blade.php
+++ b/resources/views/pages/show.blade.php
@@ -49,7 +49,7 @@
<div class="sidebar-page-nav menu">
@foreach($pageNav as $navItem)
<li class="page-nav-item h{{ $navItem['level'] }}">
- <a href="{{ $navItem['link'] }}" class="limit-text block">{{ $navItem['text'] }}</a>
+ <a href="{{ $navItem['link'] }}" class="text-limit-lines-1 block">{{ $navItem['text'] }}</a>
<div class="primary-background sidebar-page-nav-bullet"></div>
</li>
@endforeach
diff --git a/resources/views/partials/entity-grid-item.blade.php b/resources/views/partials/entity-grid-item.blade.php
new file mode 100644
index 000000000..ee31b53f2
--- /dev/null
+++ b/resources/views/partials/entity-grid-item.blade.php
@@ -0,0 +1,16 @@
+<a href="{{ $entity->getUrl() }}" class="grid-card"
+ data-entity-type="{{ $entity->getType() }}" data-entity-id="{{ $entity->id }}">
+ <div class="bg-{{ $entity->getType() }} featured-image-container-wrap">
+ <div class="featured-image-container" @if($entity->cover) style="background-image: url('{{ $entity->getBookCover() }}')"@endif>
+ </div>
+ @icon($entity->getType())
+ </div>
+ <div class="grid-card-content">
+ <h2 class="text-limit-lines-2">{{ $entity->name }}</h2>
+ <p class="text-muted">{{ $entity->getExcerpt(130) }}</p>
+ </div>
+ <div class="grid-card-footer text-muted ">
+ <p>@icon('star')<span title="{{ $entity->created_at->toDayDateTimeString() }}">{{ trans('entities.meta_created', ['timeLength' => $entity->created_at->diffForHumans()]) }}</span></p>
+ <p>@icon('edit')<span title="{{ $entity->updated_at->toDayDateTimeString() }}">{{ trans('entities.meta_updated', ['timeLength' => $entity->updated_at->diffForHumans()]) }}</span></p>
+ </div>
+</a>
\ No newline at end of file
diff --git a/resources/views/shelves/grid-item.blade.php b/resources/views/shelves/grid-item.blade.php
deleted file mode 100644
index 25b35b9ef..000000000
--- a/resources/views/shelves/grid-item.blade.php
+++ /dev/null
@@ -1,21 +0,0 @@
-<a href="{{$shelf->getUrl()}}" class="bookshelf-grid-item grid-card"
- data-entity-type="bookshelf" data-entity-id="{{$shelf->id}}">
- <div class="bg-shelf featured-image-container-wrap">
- <div class="featured-image-container" @if($shelf->cover) style="background-image: url('{{ $shelf->getBookCover() }}')"@endif>
- </div>
- @icon('bookshelf')
- </div>
- <div class="grid-card-content">
- <h2>{{$shelf->getShortName(35)}}</h2>
- @if(isset($shelf->searchSnippet))
- <p class="text-muted">{!! $shelf->searchSnippet !!}</p>
- @else
- <p class="text-muted">{{ $shelf->getExcerpt(130) }}</p>
- @endif
- </div>
- <div class="grid-card-footer text-muted text-small">
- @icon('star')<span title="{{$shelf->created_at->toDayDateTimeString()}}">{{ trans('entities.meta_created', ['timeLength' => $shelf->created_at->diffForHumans()]) }}</span>
- <br>
- @icon('edit')<span title="{{ $shelf->updated_at->toDayDateTimeString() }}">{{ trans('entities.meta_updated', ['timeLength' => $shelf->updated_at->diffForHumans()]) }}</span>
- </div>
-</a>
\ No newline at end of file
diff --git a/resources/views/shelves/list-item.blade.php b/resources/views/shelves/list-item.blade.php
index 6e5ed29a5..00cacfa70 100644
--- a/resources/views/shelves/list-item.blade.php
+++ b/resources/views/shelves/list-item.blade.php
@@ -1,5 +1,5 @@
<a href="{{ $shelf->getUrl() }}" class="shelf entity-list-item" data-entity-type="bookshelf" data-entity-id="{{$shelf->id}}">
- <div class="entity-list-item-image bg-shelf @if($shelf->image_id) has-image @endif" style="background-image: url('{{ $shelf->getBookCover() }}')">
+ <div class="entity-list-item-image bg-bookshelf @if($shelf->image_id) has-image @endif" style="background-image: url('{{ $shelf->getBookCover() }}')">
@icon('bookshelf')
</div>
<div class="content py-xs">
diff --git a/resources/views/shelves/list.blade.php b/resources/views/shelves/list.blade.php
index b20b08a2c..3600a8c79 100644
--- a/resources/views/shelves/list.blade.php
+++ b/resources/views/shelves/list.blade.php
@@ -21,7 +21,7 @@
@else
<div class="grid third">
@foreach($shelves as $key => $shelf)
- @include('shelves.grid-item', ['shelf' => $shelf])
+ @include('partials.entity-grid-item', ['entity' => $shelf])
@endforeach
</div>
@endif
diff --git a/resources/views/shelves/show.blade.php b/resources/views/shelves/show.blade.php
index 6fee6f45d..46432c1b9 100644
--- a/resources/views/shelves/show.blade.php
+++ b/resources/views/shelves/show.blade.php
@@ -22,7 +22,7 @@
@else
<div class="grid third">
@foreach($shelf->visibleBooks as $key => $book)
- @include('books.grid-item', ['book' => $book])
+ @include('partials.entity-grid-item', ['entity' => $book])
@endforeach
</div>
@endif