mirror of
https://github.com/BookStackApp/BookStack.git
synced 2024-08-25 11:45:58 +00:00
Updated standard entity lists
This commit is contained in:
parent
837d2bc582
commit
8b7bee7c67
@ -53,9 +53,9 @@ class Chapter extends Entity
|
||||
* @param int $length
|
||||
* @return string
|
||||
*/
|
||||
public function getExcerpt($length = 100)
|
||||
public function getExcerpt(int $length = 100)
|
||||
{
|
||||
$description = $this->description;
|
||||
$description = $this->text ?? $this->description;
|
||||
return strlen($description) > $length ? substr($description, 0, $length-3) . '...' : $description;
|
||||
}
|
||||
|
||||
@ -67,4 +67,13 @@ class Chapter extends Entity
|
||||
{
|
||||
return "'BookStack\\\\Chapter' as entity_type, id, id as entity_id, slug, name, {$this->textField} as text, '' as html, book_id, priority, '0' as chapter_id, '0' as draft, created_by, updated_by, updated_at, created_at";
|
||||
}
|
||||
|
||||
/**
|
||||
* Check if this chapter has any child pages.
|
||||
* @return bool
|
||||
*/
|
||||
public function hasChildren()
|
||||
{
|
||||
return count($this->pages) > 0;
|
||||
}
|
||||
}
|
||||
|
@ -102,6 +102,9 @@ p.secondary, p .secondary, span.secondary, .text-secondary {
|
||||
.bg-book {
|
||||
background-color: $color-book;
|
||||
}
|
||||
.bg-chapter {
|
||||
background-color: $color-chapter;
|
||||
}
|
||||
.bg-shelf {
|
||||
background-color: $color-bookshelf;
|
||||
}
|
@ -1,7 +1,11 @@
|
||||
|
||||
.book-contents .entity-list-item {
|
||||
.icon {
|
||||
margin-top: $-xs;
|
||||
width: 30px;
|
||||
border-radius: 4px;
|
||||
justify-self: stretch;
|
||||
align-self: stretch;
|
||||
height: auto;
|
||||
}
|
||||
p {
|
||||
margin-bottom: 0;
|
||||
@ -10,8 +14,60 @@
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
.inset-list {
|
||||
}
|
||||
|
||||
.entity-list-item + .chapter-expansion {
|
||||
display: flex;
|
||||
padding: 0 $-m $-m $-m;
|
||||
align-items: center;
|
||||
border: 0;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
> .icon {
|
||||
width: 30px;
|
||||
height: auto;
|
||||
border-radius: 0 0 4px 4px;
|
||||
align-self: stretch;
|
||||
flex-shrink: 0;
|
||||
&:before {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
height: 1px;
|
||||
background-color: currentColor;
|
||||
content: '';
|
||||
opacity: 0.2;
|
||||
}
|
||||
}
|
||||
> .content {
|
||||
flex: 1;
|
||||
}
|
||||
.chapter-expansion-toggle {
|
||||
border-radius: 0 4px 4px 0;
|
||||
padding: $-xs $-m;
|
||||
}
|
||||
.chapter-expansion-toggle:hover {
|
||||
background-color: rgba(0, 0, 0, 0.06);
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.entity-list-item.has-children {
|
||||
padding-bottom: 0;
|
||||
> .icon {
|
||||
border-radius: 4px 4px 0 0;
|
||||
}
|
||||
}
|
||||
|
||||
.inset-list {
|
||||
display: none;
|
||||
.entity-list-item-name {
|
||||
font-size: 1rem;
|
||||
}
|
||||
.entity-list-item-children {
|
||||
padding-top: 0;
|
||||
padding-bottom: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@ -355,7 +411,7 @@ ul.pagination {
|
||||
.svg-icon {
|
||||
color: #FFF;
|
||||
fill: #FFF;
|
||||
font-size: 2rem;
|
||||
font-size: 1.66rem;
|
||||
margin-right: 0;
|
||||
position: absolute;
|
||||
bottom: $-xs;
|
||||
@ -367,6 +423,10 @@ ul.pagination {
|
||||
}
|
||||
}
|
||||
|
||||
.chapter > .entity-list-item-image {
|
||||
width: 60px;
|
||||
}
|
||||
|
||||
.entity-list.compact {
|
||||
font-size: 0.6 * $fs-m;
|
||||
h4, a {
|
||||
|
@ -363,7 +363,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
.entity-list-item > span:first-child, .icon-list-item > span:first-child {
|
||||
.entity-list-item > span:first-child, .icon-list-item > span:first-child, .chapter-expansion > .icon {
|
||||
font-size: 0.8rem;
|
||||
width: 1.88em;
|
||||
height: 1.88em;
|
||||
|
@ -49,7 +49,7 @@
|
||||
{{--TODO--}}
|
||||
<h3 class="text-muted">{{ trans('entities.search_results') }} <a v-if="searching" v-on:click="clearSearch()" class="text-small">@icon('close'){{ trans('entities.search_clear') }}</a></h3>
|
||||
<div v-if="!searchResults">
|
||||
@include('partials/loading-icon')
|
||||
@include('partials.loading-icon')
|
||||
</div>
|
||||
<div v-html="searchResults"></div>
|
||||
</div>
|
||||
|
@ -1,29 +1,22 @@
|
||||
<div class="chapter entity-list-item"
|
||||
data-entity-type="chapter" data-entity-id="{{$chapter->id}}">
|
||||
<div class="icon text-chapter">@icon('chapter')</div>
|
||||
<a href="{{ $chapter->getUrl() }}" class="chapter entity-list-item @if($chapter->hasChildren()) has-children @endif" data-entity-type="chapter" data-entity-id="{{$chapter->id}}">
|
||||
<span class="icon text-chapter">@icon('chapter')</span>
|
||||
<div class="content">
|
||||
<a href="{{ $chapter->getUrl() }}" ><h4 class="entity-list-item-name break-text">{{ $chapter->name }}</h4></a>
|
||||
<div>
|
||||
|
||||
<h4 class="entity-list-item-name break-text">{{ $chapter->name }}</h4>
|
||||
<div class="entity-item-snippet">
|
||||
<p class="text-muted break-text">{{ $chapter->getExcerpt() }}</p>
|
||||
<p class="text-muted break-text mb-s">{{ $chapter->getExcerpt() }}</p>
|
||||
</div>
|
||||
|
||||
@if(count($chapter->pages) > 0)
|
||||
<p chapter-toggle class="text-muted">@icon('caret-right') @icon('page') <span>{{ trans_choice('entities.x_pages', $chapter->pages->count()) }}</span></p>
|
||||
<div class="inset-list">
|
||||
@foreach($chapter->pages as $page)
|
||||
<a href="{{ $page->getUrl() }}" class="inner-page {{$page->draft ? 'draft' : ''}} entity-list-item">
|
||||
<div class="icon text-page">@icon('page')</div>
|
||||
</div>
|
||||
</a>
|
||||
@if ($chapter->hasChildren())
|
||||
<div class="chapter chapter-expansion">
|
||||
<span class="icon text-chapter">@icon('page')</span>
|
||||
<div class="content">
|
||||
<h6 class="entity-list-item-name break-text">{{ $page->name }}</h6>
|
||||
{{ $slot ?? '' }}
|
||||
</div>
|
||||
</a>
|
||||
@endforeach
|
||||
</div>
|
||||
@endif
|
||||
|
||||
<div chapter-toggle class="text-muted chapter-expansion-toggle">@icon('caret-right') <span>{{ trans_choice('entities.x_pages', $chapter->pages->count()) }}</span></div>
|
||||
<div class="inset-list">
|
||||
<div class="entity-list-item-children">
|
||||
@include('partials.entity-list-basic', ['entities' => $chapter->pages])
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@endif
|
Loading…
Reference in New Issue
Block a user