}
// Button Specific Variables
-$button-border-radius: 3px;
+$button-border-radius: 2px;
.button-base {
text-decoration: none;
margin: $-xs $-xs $-xs 0;
display: inline-block;
border: none;
+ font-weight: 500;
+ font-family: $text;
outline: 0;
border-radius: $button-border-radius;
cursor: pointer;
- transition: all ease-in-out 80ms;
- box-shadow: 0 0 0 0 #000;
+ transition: all ease-in-out 120ms;
+ text-transform: uppercase;
+ box-shadow: 0 0.5px 1.5px 0 rgba(0, 0, 0, 0.21);
@include generate-button-colors(#EEE, $primary);
}
body {
font-family: $text;
font-size: $fs-m;
- line-height: 1.4em;
- color: #444;
+ line-height: 1.6;
+ color: #616161;
-webkit-font-smoothing: antialiased;
}
}
h1, h2, h3, h4 {
- font-weight: 500;
+ font-weight: 400;
position: relative;
display: block;
color: #555;
///////////////
// Sizes
-$max-width: 1100px;
+$max-width: 1400px;
// Screen breakpoints
$xl: 1100px;
// Fonts
$heading: 'Roboto', Helvetica, Arial, sans-serif;
$text: 'Roboto', Helvetica, Arial, sans-serif;
-$fs-m: 16px;
+$fs-m: 15px;
$fs-s: 14px;
// Colours
-$primary: #1c77c1;
+$primary: #0288D1;
+$primary-dark: #0288D1;
$secondary: #e27b41;
-$positive: #409945;
-$negative: #D35252;
+$positive: #52A256;
+$negative: #D32F2F;
// Text colours
$text-dark: #444;
display: block;
z-index: 2;
top: 0;
+ background-color: $primary-dark;
+ color: #fff;
.padded {
padding: $-m;
}
+ border-bottom: 1px solid #DDD;
//margin-bottom: $-l;
-}
-
-#sidebar {
- position: fixed;
- background-color: #444;
- color: #EEE;
- height: 100%;
- top: 0;
- z-index: 1;
- //padding-top: $-m;
- width: 340px;
- border-right: 1px solid #DDD;
- h4, li, p, a {
- color: #CCC;
+ .links a {
+ display: inline-block;
+ padding: $-l;
+ color: #FFF;
+ &:last-child {
+ padding-right: 0;
+ }
}
-}
-
-#content {
- //margin-top: 63px;
- margin-left: 340px;
- display: block;
- position: relative;
- padding: 0 16px;
-}
-
-.logo-container {
- padding: $-l $-s 0 $-s;
- color: #CCC;
- .logo {
- display: block;
- font-size: 2em;
- font-weight: bold;
- padding: $-m 0;
+ .search-box {
+ padding-top: $-l *0.8;
}
- i {
- padding-right: $-s;
+ .avatar, .user-name {
+ display: inline-block;
+ }
+ .avatar {
+ margin-top: $-l*0.8;
}
-}
-
-.user-overview {
- margin-top: $-m;
.user-name {
- display: inline-block;
vertical-align: top;
- padding: $-m $-s;
+ padding-top: $-l*1.1;
+ padding-left: $-m;
}
}
-
-.search-box {
- input {
- width: 100%;
- border-radius: 0;
- padding: $-m;
- background-color: rgba(0, 0, 0, 0.1);
- border: none;
- border-top: 1px solid #333;
- border-bottom: 1px solid #333;
- color: #EEE;
- }
+#content {
+ display: block;
+ position: relative;
}
-.menu {
- list-style: none;
- margin: 0;
- .col-md-4 {
- padding: 0;
- }
- a {
- padding: $-m;
- display: block;
- border-bottom: 1px solid #3A3939;
- }
+
+.logo {
+ display: inline-block;
+ font-size: 1.8em;
+ color: #fff;
+ font-weight: 400;
+ padding: $-l $-l $-l 0;
+ vertical-align: top;
+ line-height: 1;
}
.page-title input {
}
.faded-small {
- color: #666;
+ color: #000;
font-size: 0.9em;
+ background-color: rgba(21, 101, 192, 0.15);
a, span {
- color: #666;
+ color: #000;
}
}
a {
display: inline-block;
padding: $-s;
+ &:last-child {
+ padding-right: 0;
+ }
}
}
}
.setting-nav {
- margin-top: $-l;
- border-top: 1px solid #DDD;
- border-bottom: 1px solid #DDD;
+ text-align: center;
a {
padding: $-m;
display: inline-block;
//color: #666;
&.selected {
//color: $primary;
- background-color: #f8f8f8;
+ border-bottom: 2px solid $primary;
}
}
}
\ No newline at end of file
</div>
@endif
- <section id="sidebar">
- <div class="sidebar-bg"><div class="overlay"></div></div>
- <header>
- <div class="padded row clearfix">
- <div class="col-md-12 logo-container">
+ <header id="header">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-4">
<a href="/" class="logo">{{ Setting::get('app-name', 'BookStack') }}</a>
- <div class="user-overview">
- <img class="avatar" src="{{Auth::user()->getAvatar(50)}}" alt="{{ Auth::user()->name }}">
- <span class="user-name">
- {{ Auth::user()->name }}
- </span>
+ </div>
+ <div class="col-md-3">
+ <div class="search-box text-center" style="display: none">
+ <form action="/pages/search/all" id="search-form" method="GET" style="display: none;">
+ <input type="text" placeholder="Search all pages..." name="term" id="search-input">
+ </form>
+ </div>
+ <img class="avatar" src="{{Auth::user()->getAvatar(30)}}" alt="{{ Auth::user()->name }}">
+ <span class="user-name">
+ {{ Auth::user()->name }}
+ </span>
+ </div>
+ <div class="col-md-5">
+ <div class="float right links">
+ <a href="/search"><i class="zmdi zmdi-search"></i></a>
+ <a href="/books"><i class="zmdi zmdi-book"></i>Books</a>
+ <a href="/users"><i class="zmdi zmdi-accounts"></i>Users</a>
+ <a href="/logout"><i class="zmdi zmdi-run zmdi-hc-flip-horizontal"></i>Logout</a>
</div>
</div>
</div>
- </header>
- <div class="search-box">
- <form action="/pages/search/all" id="search-form" method="GET">
- <input type="text" placeholder="Search all pages..." name="term" id="search-input">
- </form>
</div>
- <div class="row menu">
- <div class="col-md-4"><a href="/books"><i class="zmdi zmdi-book"></i>Books</a></div>
- <div class="col-md-4"><a href="/users"><i class="zmdi zmdi-accounts"></i>Users</a></div>
- <div class="col-md-4"><a href="/logout"><i class="zmdi zmdi-run zmdi-hc-flip-horizontal"></i>Logout</a></div>
- </div>
- @if(isset($book) && isset($current) && !isset($books))
- <div class="book-tree">
- @include('pages/sidebar-tree-list', ['book' => $book])
- </div>
- @endif
+ {{--@if(isset($book) && isset($current) && !isset($books))--}}
+ {{--<div class="book-tree">--}}
+ {{--@include('pages/sidebar-tree-list', ['book' => $book])--}}
+ {{--</div>--}}
+ {{--@endif--}}
@yield('sidebar')
- </section>
+ </header>
<section id="content">
@yield('content')
@section('content')
- <div class="row faded-small">
- <div class="col-md-6"></div>
- <div class="col-md-6">
- <div class="action-buttons faded">
- @if($currentUser->can('page-create'))
- <a href="{{$book->getUrl() . '/page/create'}}" class="text-pos"><i class="zmdi zmdi-plus"></i> New Page</a>
- @endif
- @if($currentUser->can('chapter-create'))
- <a href="{{$book->getUrl() . '/chapter/create'}}" class="text-pos"><i class="zmdi zmdi-plus"></i> New Chapter</a>
- @endif
- @if($currentUser->can('book-update'))
- <a href="{{$book->getEditUrl()}}" class="text-primary"><i class="zmdi zmdi-edit"></i>Edit</a>
- <a href="{{ $book->getUrl() }}/sort" class="text-primary"><i class="zmdi zmdi-sort"></i>Sort</a>
- @endif
- @if($currentUser->can('book-delete'))
- <a href="{{ $book->getUrl() }}/delete" class="text-neg"><i class="zmdi zmdi-delete"></i>Delete</a>
- @endif
+ <div class="faded-small">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-12">
+ <div class="action-buttons faded">
+ @if($currentUser->can('page-create'))
+ <a href="{{$book->getUrl() . '/page/create'}}" class="text-pos"><i class="zmdi zmdi-plus"></i> New Page</a>
+ @endif
+ @if($currentUser->can('chapter-create'))
+ <a href="{{$book->getUrl() . '/chapter/create'}}" class="text-pos"><i class="zmdi zmdi-plus"></i> New Chapter</a>
+ @endif
+ @if($currentUser->can('book-update'))
+ <a href="{{$book->getEditUrl()}}" class="text-primary"><i class="zmdi zmdi-edit"></i>Edit</a>
+ <a href="{{ $book->getUrl() }}/sort" class="text-primary"><i class="zmdi zmdi-sort"></i>Sort</a>
+ @endif
+ @if($currentUser->can('book-delete'))
+ <a href="{{ $book->getUrl() }}/delete" class="text-neg"><i class="zmdi zmdi-delete"></i>Delete</a>
+ @endif
+ </div>
+ </div>
</div>
</div>
</div>
- <div class="row">
- <div class="col-md-6 col-md-offset-1">
- <div class="page-content">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-7">
+
<h1>{{$book->name}}</h1>
<p class="text-muted">{{$book->description}}</p>
@if(is_a($childElement, 'Oxbow\Chapter') && count($childElement->pages) > 0)
<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>
+ <h4><a href="{{$page->getUrl()}}"><i class="zmdi zmdi-file-text"></i>{{$page->name}}</a></h4>
@endforeach
</div>
@endif
Last Updated {{$book->updated_at->diffForHumans()}} @if($book->createdBy) by {{$book->updatedBy->name}} @endif
</p>
- </div>
- </div>
+ </div>
- <div class="col-md-3 col-md-offset-1">
- <div class="margin-top large"><br></div>
- <h3>Recent Activity</h3>
- @include('partials/activity-list', ['activity' => Activity::entityActivity($book, 20, 0)])
+ <div class="col-md-4 col-md-offset-1">
+ <div class="margin-top large"><br></div>
+ <h3>Recent Activity</h3>
+ @include('partials/activity-list', ['activity' => Activity::entityActivity($book, 20, 0)])
+ </div>
</div>
</div>
+
<script>
$(function() {
@section('content')
- <div class="row">
- <div class="col-md-6 col-md-offset-1">
- <div class="page-content">
+
+ <div class="container">
+ <div class="row">
+ <div class="col-md-7">
<h2>Books</h2>
@foreach($books as $book)
<div class="book">
<hr>
@endforeach
</div>
- </div>
- <div class="col-md-3 col-md-offset-1">
- <div class="margin-top large"> </div>
- <h3>Recent Activity</h3>
- @include('partials/activity-list', ['activity' => $activity])
+ <div class="col-md-4 col-md-offset-1">
+ <div class="margin-top large"> </div>
+ <h3>Recent Activity</h3>
+ @include('partials/activity-list', ['activity' => $activity])
+ </div>
</div>
</div>
+
@stop
\ No newline at end of file
@section('content')
- <div class="row faded-small">
- <div class="col-md-6 faded">
- <div class="breadcrumbs padded-horizontal">
- <a href="{{$book->getUrl()}}"><i class="zmdi zmdi-book"></i>{{ $book->name }}</a>
- @if($page->hasChapter())
- <span class="sep">»</span>
- <a href="{{ $page->chapter->getUrl() }}">
- <i class="zmdi zmdi-collection-bookmark"></i>
- {{$page->chapter->name}}
- </a>
- @endif
- </div>
- </div>
- <div class="col-md-6 faded">
- <div class="action-buttons">
- @if($currentUser->can('page-update'))
- <a href="{{$page->getUrl() . '/revisions'}}" class="text-primary"><i class="zmdi zmdi-replay"></i>Revisions</a>
- <a href="{{$page->getUrl() . '/edit'}}" class="text-primary" ><i class="zmdi zmdi-edit"></i>Edit</a>
- @endif
- @if($currentUser->can('page-delete'))
- <a href="{{$page->getUrl() . '/delete'}}" class="text-neg"><i class="zmdi zmdi-delete"></i>Delete</a>
- @endif
+ <div class="faded-small">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-6 faded">
+ <div class="breadcrumbs">
+ <a href="{{$book->getUrl()}}"><i class="zmdi zmdi-book"></i>{{ $book->name }}</a>
+ @if($page->hasChapter())
+ <span class="sep">»</span>
+ <a href="{{ $page->chapter->getUrl() }}">
+ <i class="zmdi zmdi-collection-bookmark"></i>
+ {{$page->chapter->name}}
+ </a>
+ @endif
+ </div>
+ </div>
+ <div class="col-md-6 faded">
+ <div class="action-buttons">
+ @if($currentUser->can('page-update'))
+ <a href="{{$page->getUrl() . '/revisions'}}" class="text-primary"><i class="zmdi zmdi-replay"></i>Revisions</a>
+ <a href="{{$page->getUrl() . '/edit'}}" class="text-primary" ><i class="zmdi zmdi-edit"></i>Edit</a>
+ @endif
+ @if($currentUser->can('page-delete'))
+ <a href="{{$page->getUrl() . '/delete'}}" class="text-neg"><i class="zmdi zmdi-delete"></i>Delete</a>
+ @endif
+ </div>
+ </div>
</div>
</div>
</div>
+
<div class="side-nav faded">
<h4>Page Navigation</h4>
<ul class="page-nav-list">
-<div class="row">
- <div class="col-md-6 col-md-offset-3 setting-nav">
- <a href="/settings" @if($selected == 'settings') class="selected" @endif><i class="zmdi zmdi-settings"></i>Settings</a>
- <a href="/users" @if($selected == 'users') class="selected" @endif><i class="zmdi zmdi-accounts"></i>Users</a>
+
+<div class="faded-small">
+ <div class="container">
+ <div class="row">
+ <div class="col-md-12 setting-nav">
+ <a href="/settings" @if($selected == 'settings') class="selected" @endif><i class="zmdi zmdi-settings"></i>Settings</a>
+ <a href="/users" @if($selected == 'users') class="selected" @endif><i class="zmdi zmdi-accounts"></i>Users</a>
+ </div>
+ </div>
</div>
</div>
\ No newline at end of file