colin
/
bookstack
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Started another major redsign

This commit is contained in:
Dan Brown 2015-08-30 17:53:30 +01:00
parent 17f4aa4300
commit 505a22bc7b
10 changed files with 161 additions and 168 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
resources/assets/sass/_buttons.scss
View File

@ -14,7 +14,7 @@
} }
// Button Specific Variables // Button Specific Variables
$button-border-radius: 3px; $button-border-radius: 2px;
.button-base { .button-base {
text-decoration: none; text-decoration: none;
@ -24,11 +24,14 @@ $button-border-radius: 3px;
margin: $-xs $-xs $-xs 0; margin: $-xs $-xs $-xs 0;
display: inline-block; display: inline-block;
border: none; border: none;
font-weight: 500;
font-family: $text;
outline: 0; outline: 0;
border-radius: $button-border-radius; border-radius: $button-border-radius;
cursor: pointer; cursor: pointer;
transition: all ease-in-out 80ms; transition: all ease-in-out 120ms;
box-shadow: 0 0 0 0 #000; text-transform: uppercase;
box-shadow: 0 0.5px 1.5px 0 rgba(0, 0, 0, 0.21);
@include generate-button-colors(#EEE, $primary); @include generate-button-colors(#EEE, $primary);
} }

4
resources/assets/sass/_html.scss
View File

@ -7,8 +7,8 @@ html {
body { body {
font-family: $text; font-family: $text;
font-size: $fs-m; font-size: $fs-m;
line-height: 1.4em; line-height: 1.6;
color: #444; color: #616161;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
} }

2
resources/assets/sass/_text.scss
View File

@ -28,7 +28,7 @@ h4 {
} }
h1, h2, h3, h4 { h1, h2, h3, h4 {
font-weight: 500; font-weight: 400;
position: relative; position: relative;
display: block; display: block;
color: #555; color: #555;

11
resources/assets/sass/_variables.scss
View File

@ -2,7 +2,7 @@
/////////////// ///////////////
// Sizes // Sizes
$max-width: 1100px; $max-width: 1400px;
// Screen breakpoints // Screen breakpoints
$xl: 1100px; $xl: 1100px;
@ -26,14 +26,15 @@ $-xxs: 3px;
// Fonts // Fonts
$heading: 'Roboto', Helvetica, Arial, sans-serif; $heading: 'Roboto', Helvetica, Arial, sans-serif;
$text: 'Roboto', Helvetica, Arial, sans-serif; $text: 'Roboto', Helvetica, Arial, sans-serif;
$fs-m: 16px; $fs-m: 15px;
$fs-s: 14px; $fs-s: 14px;
// Colours // Colours
$primary: #1c77c1; $primary: #0288D1;
$primary-dark: #0288D1;
$secondary: #e27b41; $secondary: #e27b41;
$positive: #409945; $positive: #52A256;
$negative: #D35252; $negative: #D32F2F;
// Text colours // Text colours
$text-dark: #444; $text-dark: #444;

106
resources/assets/sass/styles.scss
View File

@ -16,83 +16,51 @@ header {
display: block; display: block;
z-index: 2; z-index: 2;
top: 0; top: 0;
background-color: $primary-dark;
color: #fff;
.padded { .padded {
padding: $-m; padding: $-m;
} }
border-bottom: 1px solid #DDD;
//margin-bottom: $-l; //margin-bottom: $-l;
} .links a {
display: inline-block;
#sidebar { padding: $-l;
position: fixed; color: #FFF;
background-color: #444; &:last-child {
color: #EEE; padding-right: 0;
height: 100%; }
top: 0; }
z-index: 1; .search-box {
//padding-top: $-m; padding-top: $-l *0.8;
width: 340px; }
border-right: 1px solid #DDD; .avatar, .user-name {
h4, li, p, a { display: inline-block;
color: #CCC; }
.avatar {
margin-top: $-l*0.8;
}
.user-name {
vertical-align: top;
padding-top: $-l*1.1;
padding-left: $-m;
} }
} }
#content { #content {
//margin-top: 63px;
margin-left: 340px;
display: block; display: block;
position: relative; 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;
}
i {
padding-right: $-s;
}
}
.user-overview { .logo {
margin-top: $-m;
.user-name {
display: inline-block; display: inline-block;
font-size: 1.8em;
color: #fff;
font-weight: 400;
padding: $-l $-l $-l 0;
vertical-align: top; vertical-align: top;
padding: $-m $-s; line-height: 1;
}
}
.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;
}
}
.menu {
list-style: none;
margin: 0;
.col-md-4 {
padding: 0;
}
a {
padding: $-m;
display: block;
border-bottom: 1px solid #3A3939;
}
} }
.page-title input { .page-title input {
@ -259,10 +227,11 @@ h1, h2, h3, h4, h5, h6 {
} }
.faded-small { .faded-small {
color: #666; color: #000;
font-size: 0.9em; font-size: 0.9em;
background-color: rgba(21, 101, 192, 0.15);
a, span { a, span {
color: #666; color: #000;
} }
} }
@ -271,6 +240,9 @@ h1, h2, h3, h4, h5, h6 {
a { a {
display: inline-block; display: inline-block;
padding: $-s; padding: $-s;
&:last-child {
padding-right: 0;
}
} }
} }
@ -488,16 +460,14 @@ body.dragging, body.dragging * {
} }
.setting-nav { .setting-nav {
margin-top: $-l; text-align: center;
border-top: 1px solid #DDD;
border-bottom: 1px solid #DDD;
a { a {
padding: $-m; padding: $-m;
display: inline-block; display: inline-block;
//color: #666; //color: #666;
&.selected { &.selected {
//color: $primary; //color: $primary;
background-color: #f8f8f8; border-bottom: 2px solid $primary;
} }
} }
} }

46
resources/views/base.blade.php
View File

@ -49,38 +49,40 @@
</div> </div>
@endif @endif
<section id="sidebar"> <header id="header">
<div class="sidebar-bg"><div class="overlay"></div></div> <div class="container">
<header> <div class="row">
<div class="padded row clearfix"> <div class="col-md-4">
<div class="col-md-12 logo-container">
<a href="/" class="logo">{{ Setting::get('app-name', 'BookStack') }}</a> <a href="/" class="logo">{{ Setting::get('app-name', 'BookStack') }}</a>
<div class="user-overview"> </div>
<img class="avatar" src="{{Auth::user()->getAvatar(50)}}" alt="{{ Auth::user()->name }}"> <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"> <span class="user-name">
{{ Auth::user()->name }} {{ Auth::user()->name }}
</span> </span>
</div> </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> </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>
<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> </div>
@if(isset($book) && isset($current) && !isset($books)) {{--@if(isset($book) && isset($current) && !isset($books))--}}
<div class="book-tree"> {{--<div class="book-tree">--}}
@include('pages/sidebar-tree-list', ['book' => $book]) {{--@include('pages/sidebar-tree-list', ['book' => $book])--}}
</div> {{--</div>--}}
@endif {{--@endif--}}
@yield('sidebar') @yield('sidebar')
</section> </header>
<section id="content"> <section id="content">
@yield('content') @yield('content')

21
resources/views/books/show.blade.php
View File

@ -2,9 +2,10 @@
@section('content') @section('content')
<div class="row faded-small"> <div class="faded-small">
<div class="col-md-6"></div> <div class="container">
<div class="col-md-6"> <div class="row">
<div class="col-md-12">
<div class="action-buttons faded"> <div class="action-buttons faded">
@if($currentUser->can('page-create')) @if($currentUser->can('page-create'))
<a href="{{$book->getUrl() . '/page/create'}}" class="text-pos"><i class="zmdi zmdi-plus"></i> New Page</a> <a href="{{$book->getUrl() . '/page/create'}}" class="text-pos"><i class="zmdi zmdi-plus"></i> New Page</a>
@ -22,11 +23,14 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<div class="container">
<div class="row"> <div class="row">
<div class="col-md-6 col-md-offset-1"> <div class="col-md-7">
<div class="page-content">
<h1>{{$book->name}}</h1> <h1>{{$book->name}}</h1>
<p class="text-muted">{{$book->description}}</p> <p class="text-muted">{{$book->description}}</p>
@ -51,7 +55,7 @@
@if(is_a($childElement, 'Oxbow\Chapter') && count($childElement->pages) > 0) @if(is_a($childElement, 'Oxbow\Chapter') && count($childElement->pages) > 0)
<div class="inset-list"> <div class="inset-list">
@foreach($childElement->pages as $page) @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 @endforeach
</div> </div>
@endif @endif
@ -66,16 +70,17 @@
Last Updated {{$book->updated_at->diffForHumans()}} @if($book->createdBy) by {{$book->updatedBy->name}} @endif Last Updated {{$book->updated_at->diffForHumans()}} @if($book->createdBy) by {{$book->updatedBy->name}} @endif
</p> </p>
</div>
</div> </div>
<div class="col-md-3 col-md-offset-1"> <div class="col-md-4 col-md-offset-1">
<div class="margin-top large"><br></div> <div class="margin-top large"><br></div>
<h3>Recent Activity</h3> <h3>Recent Activity</h3>
@include('partials/activity-list', ['activity' => Activity::entityActivity($book, 20, 0)]) @include('partials/activity-list', ['activity' => Activity::entityActivity($book, 20, 0)])
</div> </div>
</div> </div>
</div>
<script> <script>

10
resources/views/home.blade.php
View File

@ -2,9 +2,10 @@
@section('content') @section('content')
<div class="container">
<div class="row"> <div class="row">
<div class="col-md-6 col-md-offset-1"> <div class="col-md-7">
<div class="page-content">
<h2>Books</h2> <h2>Books</h2>
@foreach($books as $book) @foreach($books as $book)
<div class="book"> <div class="book">
@ -14,12 +15,13 @@
<hr> <hr>
@endforeach @endforeach
</div> </div>
</div> <div class="col-md-4 col-md-offset-1">
<div class="col-md-3 col-md-offset-1">
<div class="margin-top large">&nbsp;</div> <div class="margin-top large">&nbsp;</div>
<h3>Recent Activity</h3> <h3>Recent Activity</h3>
@include('partials/activity-list', ['activity' => $activity]) @include('partials/activity-list', ['activity' => $activity])
</div> </div>
</div> </div>
</div>
@stop @stop

9
resources/views/pages/show.blade.php
View File

@ -2,9 +2,11 @@
@section('content') @section('content')
<div class="row faded-small"> <div class="faded-small">
<div class="container">
<div class="row">
<div class="col-md-6 faded"> <div class="col-md-6 faded">
<div class="breadcrumbs padded-horizontal"> <div class="breadcrumbs">
<a href="{{$book->getUrl()}}"><i class="zmdi zmdi-book"></i>{{ $book->name }}</a> <a href="{{$book->getUrl()}}"><i class="zmdi zmdi-book"></i>{{ $book->name }}</a>
@if($page->hasChapter()) @if($page->hasChapter())
<span class="sep">&raquo;</span> <span class="sep">&raquo;</span>
@ -27,6 +29,9 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</div>
<div class="side-nav faded"> <div class="side-nav faded">
<h4>Page Navigation</h4> <h4>Page Navigation</h4>

9
resources/views/settings/navbar.blade.php
View File

@ -1,6 +1,11 @@
<div class="row">
<div class="col-md-6 col-md-offset-3 setting-nav"> <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="/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> <a href="/users" @if($selected == 'users') class="selected" @endif><i class="zmdi zmdi-accounts"></i>Users</a>
</div> </div>
</div>
</div>
</div> </div>