mirror of
https://github.com/BookStackApp/BookStack.git
synced 2024-11-25 08:53:55 +08:00
Cleaned book-show page/chapter list design
This commit is contained in:
parent
1f03d8fb2a
commit
30d2edddda
|
@ -14,6 +14,6 @@ var elixir = require('laravel-elixir');
|
|||
elixir(function(mix) {
|
||||
mix.sass('styles.scss');
|
||||
mix.scripts('image-manager.js', 'public/js/image-manager.js');
|
||||
mix.scripts('book-sidebar.js', 'public/js/book-sidebar.js');
|
||||
mix.scripts('book-dashboard.js', 'public/js/book-dashboard.js');
|
||||
mix.scripts('jquery-extensions.js', 'public/js/jquery-extensions.js');
|
||||
});
|
||||
|
|
|
@ -169,7 +169,7 @@ body.flexbox {
|
|||
|
||||
.page-list {
|
||||
h3 {
|
||||
margin: $-l 0;
|
||||
margin: $-l 0 $-m 0;
|
||||
}
|
||||
a.chapter {
|
||||
color: $color-chapter;
|
||||
|
@ -177,16 +177,43 @@ body.flexbox {
|
|||
.inset-list {
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
padding-left: $-l*2;
|
||||
border-top: 3px dotted #EEE;
|
||||
// padding-left: $-m;
|
||||
margin-bottom: $-l;
|
||||
}
|
||||
h4 {
|
||||
display: block;
|
||||
margin: $-m 0;
|
||||
margin: $-s 0 0 0;
|
||||
border-left: 5px solid $color-page;
|
||||
padding: $-xs 0 $-xs $-m;
|
||||
}
|
||||
hr {
|
||||
margin-top: 0;
|
||||
}
|
||||
.book-child {
|
||||
padding-left: $-l;
|
||||
&.page {
|
||||
border-left: 5px solid $color-page;
|
||||
}
|
||||
&.chapter {
|
||||
border-left: 5px solid $color-chapter;
|
||||
}
|
||||
}
|
||||
}
|
||||
.chapter-toggle {
|
||||
cursor: pointer;
|
||||
margin: 0 0 $-l 0;
|
||||
transition: all ease-in-out 180ms;
|
||||
i {
|
||||
transition: all ease-in-out 180ms;
|
||||
transform: rotate(0deg);
|
||||
transform-origin: 25% 50%;
|
||||
}
|
||||
&.open {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
&.open i {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
}
|
||||
|
||||
.side-nav {
|
||||
|
|
|
@ -11,6 +11,6 @@
|
|||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<a href="/books" class="button muted">Cancel</a>
|
||||
<a href="{{ back()->getTargetUrl() }}" class="button muted">Cancel</a>
|
||||
<button type="submit" class="button pos">Save Book</button>
|
||||
</div>
|
|
@ -39,10 +39,10 @@
|
|||
<hr>
|
||||
@if(count($book->children()) > 0)
|
||||
@foreach($book->children() as $childElement)
|
||||
<div class="book-child">
|
||||
<div class="book-child {{ $childElement->getName() }}">
|
||||
<h3>
|
||||
<a href="{{ $childElement->getUrl() }}" class="{{ $childElement->getName() }}">
|
||||
<i class="zmdi {{ $childElement->isA('chapter') ? 'zmdi-collection-bookmark chapter-toggle':'zmdi-file-text'}}"></i>{{ $childElement->name }}
|
||||
<i class="zmdi {{ $childElement->isA('chapter') ? 'zmdi-collection-bookmark':'zmdi-file-text'}}"></i>{{ $childElement->name }}
|
||||
</a>
|
||||
</h3>
|
||||
<p class="text-muted">
|
||||
|
@ -50,6 +50,7 @@
|
|||
</p>
|
||||
|
||||
@if($childElement->isA('chapter') && count($childElement->pages) > 0)
|
||||
<p class="text-muted chapter-toggle open"><i class="zmdi zmdi-caret-right"></i> {{ count($childElement->pages) }} Pages</p>
|
||||
<div class="inset-list">
|
||||
@foreach($childElement->pages as $page)
|
||||
<h4><a href="{{$page->getUrl()}}"><i class="zmdi zmdi-file-text"></i>{{$page->name}}</a></h4>
|
||||
|
@ -109,6 +110,7 @@
|
|||
|
||||
$('.chapter-toggle').click(function(e) {
|
||||
e.preventDefault();
|
||||
$(this).toggleClass('open');
|
||||
$(this).closest('.book-child').find('.inset-list').slideToggle(180);
|
||||
});
|
||||
|
||||
|
|
|
@ -7,7 +7,7 @@
|
|||
<div class="row">
|
||||
<div class="col-md-4 faded">
|
||||
<div class="breadcrumbs">
|
||||
<a href="{{$book->getUrl()}}"><i class="zmdi zmdi-book"></i>{{ $book->name }}</a>
|
||||
<a href="{{$book->getUrl()}}" class="text-book"><i class="zmdi zmdi-book"></i>{{ $book->name }}</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-8 faded">
|
||||
|
|
Loading…
Reference in New Issue
Block a user