transition: all ease-in-out 180ms;
user-select: none;
svg[data-icon="caret-right"] {
+ margin-right: 0;
+ font-size: 1rem;
transition: all ease-in-out 180ms;
transform: rotate(0deg);
- transform-origin: 25% 50%;
+ transform-origin: 50% 50%;
}
&.open svg[data-icon="caret-right"] {
transform: rotate(90deg);
}
+ svg[data-icon="caret-right"] + * {
+ margin-left: $-xs;
+ }
}
[overlay] {
.sidebar-page-nav {
$nav-indent: $-m;
list-style: none;
- margin: $-s 0 $-m 2px;
+ margin: $-s 0 $-m $-xs;
position: relative;
&:after {
content: '';
}
// Sidebar list
-.book-tree .book.entity-list-item {
- font-size: 0.6rem;
- h4 {
- font-size: 1rem;
- margin: 0;
- }
-}
-.book-tree .sidebar-page-list {
+.book-tree .sidebar-page-list {
list-style: none;
- margin: $-xs 0 0;
+ margin: $-xs -$-s 0 -$-s;
padding-left: 0;
padding-right: 0;
position: relative;
+
+ &:after, .sub-menu:after {
+ content: '';
+ display: block;
+ position: absolute;
+ left: $-m;
+ top: 1rem;
+ bottom: 1rem;
+ border-left: 4px solid rgba(0, 0, 0, 0.1);
+ z-index: 0;
+ }
+
ul {
list-style: none;
padding-left: 1rem;
padding-right: 0;
}
- .entity-icon {
- font-size: 12px;
- z-index: 2;
- background-color: #FFF;
+ .entity-list-item {
+ padding-top: $-xxs;
+ padding-bottom: $-xxs;
+ .content {
+ padding-top: $-xs;
+ padding-bottom: $-xs;
+ }
+ }
+ .entity-list-item.no-hover {
+ margin-top: -$-xs;
+ padding-right: 0;
}
.entity-list-item-name {
font-size: 1em;
margin: 0;
}
- .entity-list-item {
- font-size: 0.8rem;
- }
- .entity-list-item.selected {
- background-color: #F2F2F2;
- }
.chapter-child-menu {
- font-size: 12px;
- padding-left: 2rem;
+ font-size: .8rem;
margin-top: -.2rem;
+ margin-left: -1rem;
}
[chapter-toggle] {
padding-left: 1.5rem;
padding-bottom: .2rem;
}
- .icon {
+ .entity-list-item .icon {
z-index: 2;
- }
- &:after, .sub-menu:after {
- content: '';
- display: block;
- position: absolute;
- left: 1.6rem;
- top: 1rem;
- bottom: 1rem;
- border-left: 2px solid #DDD;
+ width: 4px;
+ height: auto;
+ align-self: stretch;
+ flex-shrink: 0;
+ border-radius: 1px;
opacity: 0.6;
- z-index: 0;
+ }
+ .entity-list-item .icon:after {
+ opacity: 1;
+ }
+ .entity-list-item .icon svg {
+ display: none;
}
}
}
}
-.entity-list-item.selected {
- h3, i, p ,a, span {
- color: #EEE;
- }
-}
-
.scroll-box {
max-height: 250px;
overflow-y: scroll;
@section('container-classes', 'mt-xl')
+@section('body')
+ @include('books.list', ['books' => $books, 'view' => $view])
+@stop
+
@section('left')
@if($recents)
<div id="recents" class="mb-xl">
</div>
@stop
-@section('body')
- @include('books.list', ['books' => $books, 'view' => $view])
-@stop
-
@section('right')
<div class="actions mb-xl">
-<div class="content-wrap card">
+<div class="content-wrap mt-m card">
<div class="grid half v-center">
<h1 class="list-heading">{{ trans('entities.books') }}</h1>
<div class="text-right">
@section('right')
+ <div class="mb-xl">
+ <h5>{{ trans('common.details') }}</h5>
+ <div class="text-small text-muted blended-links">
+ @include('partials.entity-meta', ['entity' => $book])
+ @if($book->restricted)
+ <div class="active-restriction">
+ @if(userCan('restrictions-manage', $book))
+ <a href="{{ $book->getUrl('/permissions') }}">@icon('lock'){{ trans('entities.books_permissions_active') }}</a>
+ @else
+ @icon('lock'){{ trans('entities.books_permissions_active') }}
+ @endif
+ </div>
+ @endif
+ </div>
+ </div>
+
+
<div class="actions mb-xl">
<h5>{{ trans('common.actions') }}</h5>
<div class="icon-list text-primary">
</form>
</div>
- <div class="mb-xl">
- <h5>{{ trans('common.details') }}</h5>
- <div class="text-small text-muted blended-links">
- @include('partials.entity-meta', ['entity' => $book])
- @if($book->restricted)
- <div class="active-restriction">
- @if(userCan('restrictions-manage', $book))
- <a href="{{ $book->getUrl('/permissions') }}">@icon('lock'){{ trans('entities.books_permissions_active') }}</a>
- @else
- @icon('lock'){{ trans('entities.books_permissions_active') }}
- @endif
- </div>
- @endif
- </div>
- </div>
-
@if(count($activity) > 0)
<div class="mb-xl">
<h5>{{ trans('entities.recent_activity') }}</h5>
@section('right')
+ <div class="mb-xl">
+ <h5>{{ trans('common.details') }}</h5>
+ <div class="blended-links text-small text-muted">
+ @include('partials.entity-meta', ['entity' => $chapter])
+
+ @if($book->restricted)
+ <div class="active-restriction">
+ @if(userCan('restrictions-manage', $book))
+ <a href="{{ $book->getUrl('/permissions') }}">@icon('lock'){{ trans('entities.books_permissions_active') }}</a>
+ @else
+ @icon('lock'){{ trans('entities.books_permissions_active') }}
+ @endif
+ </div>
+ @endif
+
+ @if($chapter->restricted)
+ <div class="active-restriction">
+ @if(userCan('restrictions-manage', $chapter))
+ <a href="{{ $chapter->getUrl('/permissions') }}">@icon('lock'){{ trans('entities.chapters_permissions_active') }}</a>
+ @else
+ @icon('lock'){{ trans('entities.chapters_permissions_active') }}
+ @endif
+ </div>
+ @endif
+ </div>
+ </div>
+
<div class="actions mb-xl">
<h5>{{ trans('common.actions') }}</h5>
<div class="icon-list text-primary">
</form>
</div>
- <div class="mb-xl">
- <h5>{{ trans('common.details') }}</h5>
- <div class="blended-links text-small text-muted">
- @include('partials.entity-meta', ['entity' => $chapter])
-
- @if($book->restricted)
- <div class="active-restriction">
- @if(userCan('restrictions-manage', $book))
- <a href="{{ $book->getUrl('/permissions') }}">@icon('lock'){{ trans('entities.books_permissions_active') }}</a>
- @else
- @icon('lock'){{ trans('entities.books_permissions_active') }}
- @endif
- </div>
- @endif
-
- @if($chapter->restricted)
- <div class="active-restriction">
- @if(userCan('restrictions-manage', $chapter))
- <a href="{{ $chapter->getUrl('/permissions') }}">@icon('lock'){{ trans('entities.chapters_permissions_active') }}</a>
- @else
- @icon('lock'){{ trans('entities.chapters_permissions_active') }}
- @endif
- </div>
- @endif
- </div>
- </div>
-
@include('partials/book-tree', ['book' => $book, 'sidebarTree' => $sidebarTree])
@stop
@endif
@if ($page->attachments->count() > 0)
- <div id="page-attachments" class="mb-xl">
+ <div id="page-attachments" class="mb-l">
<h5>{{ trans('entities.pages_attachments') }}</h5>
<div class="body">
@foreach($page->attachments as $attachment)
- <div class="attachment">
- <a href="{{ $attachment->getUrl() }}" @if($attachment->external) target="_blank" @endif>@icon($attachment->external ? 'export' : 'file'){{ $attachment->name }}</a>
+ <div class="attachment icon-list">
+ <a class="icon-list-item py-xs" href="{{ $attachment->getUrl() }}" @if($attachment->external) target="_blank" @endif>
+ <span class="icon">@icon($attachment->external ? 'export' : 'file')</span>
+ <span>{{ $attachment->name }}</span>
+ </a>
</div>
@endforeach
</div>
</div>
@endif
+ @include('partials.book-tree', ['book' => $book, 'sidebarTree' => $sidebarTree])
+@stop
+
+@section('right')
<div id="page-details" class="entity-details mb-xl">
<h5>{{ trans('common.details') }}</h5>
- <div class="body text-muted text-small blended-links">
+ <div class="body text-small blended-links">
@include('partials.entity-meta', ['entity' => $page])
@if($book->restricted)
</div>
</div>
- @include('partials.book-tree', ['book' => $book, 'sidebarTree' => $sidebarTree])
-@stop
-
-@section('right')
<div class="actions mb-xl">
<h5>Actions</h5>
<div id="book-tree" class="book-tree mb-xl" v-pre>
<h5>{{ trans('entities.books_navigation') }}</h5>
- @if (userCan('view', $book))
- <div class="entity-list">
- @include('partials.entity-list-item-basic', ['entity' => $book, 'classes' => ($current->matches($book)? 'selected' : '')])
- </div>
- @endif
- <ul class="sidebar-page-list menu entity-list">
+ <ul class="sidebar-page-list mt-xs menu entity-list">
+ @if (userCan('view', $book))
+ <li class="list-item-book book">
+ @include('partials.entity-list-item-basic', ['entity' => $book, 'classes' => ($current->matches($book)? 'selected' : '')])
+ </li>
+ @endif
@foreach($sidebarTree as $bookChild)
<li class="list-item-{{ $bookChild->getClassName() }} {{ $bookChild->getClassName() }} {{ $bookChild->isA('page') && $bookChild->draft ? 'draft' : '' }}">
@include('partials.entity-list-item-basic', ['entity' => $bookChild, 'classes' => $current->matches($bookChild)? 'selected' : ''])
@if($bookChild->isA('chapter') && count($bookChild->pages) > 0)
- @include('chapters.child-menu', ['chapter' => $bookChild, 'current' => $current])
+ <div class="entity-list-item no-hover">
+ <span class="icon text-chapter">
+
+ </span>
+ <div class="content">
+ @include('chapters.child-menu', ['chapter' => $bookChild, 'current' => $current])
+ </div>
+ </div>
+
@endif
</li>
<div class="breadcrumbs text-center">
<?php $breadcrumbCount = 0; ?>
- {{--Show top level item--}}
+ {{-- Show top level books item --}}
@if (count($crumbs) > 0 && array_first($crumbs) instanceof \BookStack\Entities\Book)
<a href="{{ baseUrl('/books') }}" class="text-book icon-list-item outline-hover">
<span>@icon('books')</span>
<?php $breadcrumbCount++; ?>
@endif
+ {{-- Show top level shelves item --}}
+ @if (count($crumbs) > 0 && array_first($crumbs) instanceof \BookStack\Entities\Bookshelf)
+ <a href="{{ baseUrl('/shelves') }}" class="text-bookshelf icon-list-item outline-hover">
+ <span>@icon('bookshelf')</span>
+ <span>{{ trans('entities.shelves') }}</span>
+ </a>
+ <?php $breadcrumbCount++; ?>
+ @endif
+
@foreach($crumbs as $key => $crumb)
<?php $isEntity = ($crumb instanceof \BookStack\Entities\Entity); ?>
-<div class="content-wrap card">
- {{--TODO - Create unique list item--}}
+<div class="content-wrap mt-m card">
<div class="grid half v-center">
<h1 class="list-heading">{{ trans('entities.shelves') }}</h1>
@section('body')
+ <div class="mb-s">
+ @include('partials.breadcrumbs', ['crumbs' => [
+ $shelf,
+ ]])
+ </div>
+
<div class="card content-wrap">
<h1 class="break-text">{{$shelf->name}}</h1>
<div class="book-content">