]> BookStack Code Mirror - bookstack/commitdiff
Started design update
authorDan Brown <redacted>
Sat, 19 Aug 2017 17:32:24 +0000 (18:32 +0100)
committerDan Brown <redacted>
Sat, 19 Aug 2017 17:32:24 +0000 (18:32 +0100)
resources/assets/sass/_blocks.scss
resources/assets/sass/_codemirror.scss
resources/assets/sass/_grid.scss
resources/assets/sass/_lists.scss
resources/assets/sass/_pages.scss
resources/views/base.blade.php
resources/views/pages/form.blade.php
resources/views/pages/show.blade.php
resources/views/pages/sidebar-tree-list.blade.php
resources/views/sidebar-layout.blade.php [new file with mode: 0644]

index e3a0d6952e5f2e00d4f8702def887c90582ba2a0..3eb60152d748b1a0ac7ae2a0f0a8470dabd7e99f 100644 (file)
   &.warning:before {
     content: '\f1f1';
   }
+}
+
+.card {
+  margin: $-m;
+  background-color: #FFF;
+  box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.2);
+  h3 {
+    padding: $-m;
+    border-bottom: 1px solid #E8E8E8;
+    margin: 0;
+    font-size: $fs-s;
+    color: #888;
+    font-weight: 400;
+    text-transform: uppercase;
+  }
+  .body {
+    padding: $-m;
+  }
 }
\ No newline at end of file
index 0f006c91a65d94a3cdaa0d05723fc0384fe280fe..89ed0f54ee84c1cb25a4bd8b67de4c7f458486bc 100644 (file)
@@ -392,7 +392,7 @@ span.CodeMirror-selectedtext { background: none; }
 }
 .cm-s-base16-light .CodeMirror-gutters { background: #f5f5f5; border-right: 1px solid #DDD; }
 
-.flex-fill .CodeMirror {
+.code-fill .CodeMirror {
   position: absolute;
   top: 0;
   bottom: 0;
index de1ee83fb1caa914cc758ab12623584729286021..6bff97cb32fa876ccb591a1a4b9aa67a370178fe 100644 (file)
@@ -20,19 +20,46 @@ body.flexbox {
   align-items: stretch;
   min-height: 0;
   position: relative;
-  .flex, &.flex {
-    min-height: 0;
-    flex: 1;
+  &.rows {
+    flex-direction: row;
+  }
+  &.columns {
+    flex-direction: column;
+  }
+}
+
+.flex {
+  min-height: 0;
+  flex: 1;
+}
+
+.flex.scroll {
+  //overflow-y: auto;
+  display: flex;
+  &.sidebar {
+    margin-right: -14px;
   }
 }
+.flex.scroll .scroll-body {
+  overflow-y: scroll;
+  flex: 1;
+}
 
 .flex-child > div {
   flex: 1;
 }
 
-//body.ie .flex-child > div {
-//  flex: 1 0 0px;
-//}
+.flex.sidebar {
+  flex: 1;
+  background-color: #F2F2F2;
+  max-width: 360px;
+  min-height: 90vh;
+}
+.flex.sidebar + .flex.content {
+  flex: 3;
+  background-color: #FFFFFF;
+  border-left: 1px solid #DDD;
+}
 
 /** Rules for all columns */
 div[class^="col-"] img {
index d08ccc9bb9b7c8da0b2792148a35f8e2eedcf02c..61b2aa858179b9675649c1b74d88824741b27a82 100644 (file)
 
 // Sidebar list
 .book-tree {
-  padding: $-xs 0 0 0;
   position: relative;
   right: 0;
   top: 0;
   transition: ease-in-out 240ms;
   transition-property: right, border;
-  border-left: 0px solid #FFF;
-  background-color: #FFF;
-  max-width: 320px;
   &.fixed {
-    background-color: #FFF;
     z-index: 5;
     position: fixed;
     top: 0;
-    padding-left: $-l;
-    padding-right: $-l + 15;
+    padding-right: $-l + 5px;
     width: 30%;
-    right: -15px;
+    left: 0;
     height: 100%;
     overflow-y: scroll;
     -ms-overflow-style: none;
index 65fdfbc4be25ffb1727b9cd96648c725660fb178..f73bbd546d12021ae1b3e88539dab00de0537d2e 100755 (executable)
@@ -1,12 +1,3 @@
-#page-show {
-  >.row .col-md-9 {
-    z-index: 2;
-  }
-  >.row .col-md-3 {
-    z-index: 1;
-  }
-}
-
 .page-editor {
   display: flex;
   flex-direction: column;
@@ -36,6 +27,8 @@
 
 .page-content {
   max-width: 840px;
+  margin: 0 auto;
+  margin-top: $-xxl;
   overflow-wrap: break-word;
   .align-left {
     text-align: left;
 }
 
 .tag-display {
-  width: 100%;
-  //opacity: 0.7;
   position: relative;
   table {
     width: 100%;
index 1c972e4fb82ae216926fa859907cde50df8cbe85..edbd6a096526bcbe9a0284306c018da99959b5cd 100644 (file)
@@ -34,7 +34,7 @@
     @include('partials/notifications')
 
     <header id="header">
-        <div class="container">
+        <div class="container fluid">
             <div class="row">
                 <div class="col-sm-4" ng-non-bindable>
                     <a href="{{ baseUrl('/') }}" class="logo">
index eb5ebb0bdde4b807928f3de5741270f54d48697f..b73b67ef7e39590e49ed377798e42a0e2b1a9202 100644 (file)
@@ -74,7 +74,7 @@
 
         {{--Markdown Editor--}}
         @if(setting('app-editor') === 'markdown')
-            <div id="markdown-editor" markdown-editor class="flex-fill flex">
+            <div id="markdown-editor" markdown-editor class="flex-fill flex code-fill">
 
                 <div class="markdown-editor-wrap">
                     <div class="editor-toolbar">
index 0d75a534ab0b56dc497ff1807e4dcc6454d20810..6b06b461119a34403b22522d0c84b3298535677c 100644 (file)
-@extends('base')
+@extends('sidebar-layout')
 
-@section('content')
-
-    <div class="faded-small toolbar">
-        <div class="container">
-            <div class="row">
-                <div class="col-sm-8 col-xs-5 faded">
-                    @include('pages._breadcrumbs', ['page' => $page])
-                </div>
-                <div class="col-sm-4 col-xs-7 faded">
-                    <div class="action-buttons">
-                        <span dropdown class="dropdown-container">
-                            <div dropdown-toggle class="text-button text-primary"><i class="zmdi zmdi-open-in-new"></i>{{ trans('entities.export') }}</div>
-                            <ul class="wide">
-                                <li><a href="{{ $page->getUrl('/export/html') }}" target="_blank">{{ trans('entities.export_html') }} <span class="text-muted float right">.html</span></a></li>
-                                <li><a href="{{ $page->getUrl('/export/pdf') }}" target="_blank">{{ trans('entities.export_pdf') }} <span class="text-muted float right">.pdf</span></a></li>
-                                <li><a href="{{ $page->getUrl('/export/plaintext') }}" target="_blank">{{ trans('entities.export_text') }} <span class="text-muted float right">.txt</span></a></li>
-                            </ul>
-                        </span>
+@section('toolbar')
+    <div class="col-sm-8 col-xs-5 faded">
+        @include('pages._breadcrumbs', ['page' => $page])
+    </div>
+    <div class="col-sm-4 col-xs-7 faded">
+        <div class="action-buttons">
+                    <span dropdown class="dropdown-container">
+                        <div dropdown-toggle class="text-button text-primary"><i class="zmdi zmdi-open-in-new"></i>{{ trans('entities.export') }}</div>
+                        <ul class="wide">
+                            <li><a href="{{ $page->getUrl('/export/html') }}" target="_blank">{{ trans('entities.export_html') }} <span class="text-muted float right">.html</span></a></li>
+                            <li><a href="{{ $page->getUrl('/export/pdf') }}" target="_blank">{{ trans('entities.export_pdf') }} <span class="text-muted float right">.pdf</span></a></li>
+                            <li><a href="{{ $page->getUrl('/export/plaintext') }}" target="_blank">{{ trans('entities.export_text') }} <span class="text-muted float right">.txt</span></a></li>
+                        </ul>
+                    </span>
+            @if(userCan('page-update', $page))
+                <a href="{{ $page->getUrl('/edit') }}" class="text-primary text-button" ><i class="zmdi zmdi-edit"></i>{{ trans('common.edit') }}</a>
+            @endif
+            @if(userCan('page-update', $page) || userCan('restrictions-manage', $page) || userCan('page-delete', $page))
+                <div dropdown class="dropdown-container">
+                    <a dropdown-toggle class="text-primary text-button"><i class="zmdi zmdi-more-vert"></i></a>
+                    <ul>
                         @if(userCan('page-update', $page))
-                            <a href="{{ $page->getUrl('/edit') }}" class="text-primary text-button" ><i class="zmdi zmdi-edit"></i>{{ trans('common.edit') }}</a>
+                            <li><a href="{{ $page->getUrl('/move') }}" class="text-primary" ><i class="zmdi zmdi-folder"></i>{{ trans('common.move') }}</a></li>
+                            <li><a href="{{ $page->getUrl('/revisions') }}" class="text-primary"><i class="zmdi zmdi-replay"></i>{{ trans('entities.revisions') }}</a></li>
                         @endif
-                        @if(userCan('page-update', $page) || userCan('restrictions-manage', $page) || userCan('page-delete', $page))
-                            <div dropdown class="dropdown-container">
-                                <a dropdown-toggle class="text-primary text-button"><i class="zmdi zmdi-more-vert"></i></a>
-                                <ul>
-                                    @if(userCan('page-update', $page))
-                                        <li><a href="{{ $page->getUrl('/move') }}" class="text-primary" ><i class="zmdi zmdi-folder"></i>{{ trans('common.move') }}</a></li>
-                                        <li><a href="{{ $page->getUrl('/revisions') }}" class="text-primary"><i class="zmdi zmdi-replay"></i>{{ trans('entities.revisions') }}</a></li>
-                                    @endif
-                                    @if(userCan('restrictions-manage', $page))
-                                        <li><a href="{{ $page->getUrl('/permissions') }}" class="text-primary"><i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.permissions') }}</a></li>
-                                    @endif
-                                    @if(userCan('page-delete', $page))
-                                        <li><a href="{{ $page->getUrl('/delete') }}" class="text-neg"><i class="zmdi zmdi-delete"></i>{{ trans('common.delete') }}</a></li>
-                                    @endif
-                                </ul>
-                            </div>
+                        @if(userCan('restrictions-manage', $page))
+                            <li><a href="{{ $page->getUrl('/permissions') }}" class="text-primary"><i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.permissions') }}</a></li>
                         @endif
-
-                    </div>
+                        @if(userCan('page-delete', $page))
+                            <li><a href="{{ $page->getUrl('/delete') }}" class="text-neg"><i class="zmdi zmdi-delete"></i>{{ trans('common.delete') }}</a></li>
+                        @endif
+                    </ul>
                 </div>
-            </div>
+            @endif
+
         </div>
     </div>
+@stop
 
+@section('sidebar')
+    @if($book->restricted || ($page->chapter && $page->chapter->restricted) || $page->restricted)
+        <div class="text-muted">
 
-    <div class="container" id="page-show">
-        <div class="row">
-            <div class="col-md-9 print-full-width">
-                <div class="page-content" ng-non-bindable>
-
-                    <div class="pointer-container" id="pointer">
-                        <div class="pointer anim" >
-                            <span class="icon text-primary"><i class="zmdi zmdi-link"></i></span>
-                            <input readonly="readonly" type="text" id="pointer-url" placeholder="url">
-                            <button class="button icon" data-clipboard-target="#pointer-url" type="button" title="{{ trans('entities.pages_copy_link') }}"><i class="zmdi zmdi-copy"></i></button>
-                        </div>
-                    </div>
-
-                    @include('pages/page-display')
+            @if($book->restricted)
+                @if(userCan('restrictions-manage', $book))
+                    <a href="{{ $book->getUrl('/permissions') }}"><i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.books_permissions_active') }}</a>
+                @else
+                    <i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.books_permissions_active') }}
+                @endif
+                <br>
+            @endif
+
+            @if($page->chapter && $page->chapter->restricted)
+                @if(userCan('restrictions-manage', $page->chapter))
+                    <a href="{{ $page->chapter->getUrl('/permissions') }}"><i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.chapters_permissions_active') }}</a>
+                @else
+                    <i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.chapters_permissions_active') }}
+                @endif
+                <br>
+            @endif
+
+            @if($page->restricted)
+                @if(userCan('restrictions-manage', $page))
+                    <a href="{{ $page->getUrl('/permissions') }}"><i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.pages_permissions_active') }}</a>
+                @else
+                    <i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.pages_permissions_active') }}
+                @endif
+                <br>
+            @endif
+        </div>
+    @endif
 
-                    <hr>
+    @include('pages/sidebar-tree-list', ['book' => $book, 'sidebarTree' => $sidebarTree, 'pageNav' => $pageNav])
+@stop
 
-                    @include('partials.entity-meta', ['entity' => $page])
+@section('body')
+    <div class="page-content" ng-non-bindable>
 
-                </div>
-                @include('comments/comments', ['pageId' => $page->id])
+        <div class="pointer-container" id="pointer">
+            <div class="pointer anim" >
+                <span class="icon text-primary"><i class="zmdi zmdi-link"></i></span>
+                <input readonly="readonly" type="text" id="pointer-url" placeholder="url">
+                <button class="button icon" data-clipboard-target="#pointer-url" type="button" title="{{ trans('entities.pages_copy_link') }}"><i class="zmdi zmdi-copy"></i></button>
             </div>
+        </div>
 
-            <div class="col-md-3 print-hidden">
-                <div class="margin-top large"></div>
-                @if($book->restricted || ($page->chapter && $page->chapter->restricted) || $page->restricted)
-                    <div class="text-muted">
-
-                        @if($book->restricted)
-                            @if(userCan('restrictions-manage', $book))
-                                <a href="{{ $book->getUrl('/permissions') }}"><i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.books_permissions_active') }}</a>
-                            @else
-                                <i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.books_permissions_active') }}
-                            @endif
-                            <br>
-                        @endif
-
-                        @if($page->chapter && $page->chapter->restricted)
-                            @if(userCan('restrictions-manage', $page->chapter))
-                                <a href="{{ $page->chapter->getUrl('/permissions') }}"><i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.chapters_permissions_active') }}</a>
-                            @else
-                                <i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.chapters_permissions_active') }}
-                            @endif
-                            <br>
-                        @endif
-
-                        @if($page->restricted)
-                            @if(userCan('restrictions-manage', $page))
-                                <a href="{{ $page->getUrl('/permissions') }}"><i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.pages_permissions_active') }}</a>
-                            @else
-                                <i class="zmdi zmdi-lock-outline"></i>{{ trans('entities.pages_permissions_active') }}
-                            @endif
-                            <br>
-                        @endif
-                    </div>
-                @endif
+        @include('pages/page-display')
 
+        <hr>
 
+        @include('partials.entity-meta', ['entity' => $page])
 
-                @include('pages/sidebar-tree-list', ['book' => $book, 'sidebarTree' => $sidebarTree, 'pageNav' => $pageNav])
-            </div>
-
-        </div>
+    </div>
+    <div class="container small">
+        @include('comments/comments', ['pageId' => $page->id])
     </div>
 @stop
 
index 90737740cfa2f3bc98ad8d74cc7d118c4400c2bf..902a6def2a62bcc08ab7d7319bd56810a24fdd17 100644 (file)
@@ -2,73 +2,86 @@
 <div class="book-tree" ng-non-bindable>
 
     @if(isset($page) && $page->tags->count() > 0)
-        <div class="tag-display">
-            <h6 class="text-muted">{{ trans('entities.page_tags') }}</h6>
-            <table>
-                <tbody>
-                @foreach($page->tags as $tag)
-                    <tr class="tag">
-                        <td @if(!$tag->value) colspan="2" @endif><a href="{{ baseUrl('/search?term=%5B' . urlencode($tag->name) .'%5D') }}">{{ $tag->name }}</a></td>
-                        @if($tag->value) <td class="tag-value"><a href="{{ baseUrl('/search?term=%5B' . urlencode($tag->name) .'%3D' . urlencode($tag->value) . '%5D') }}">{{$tag->value}}</a></td> @endif
-                    </tr>
-                @endforeach
-                </tbody>
-            </table>
+        <div class="card tag-display">
+            <h3><i class="zmdi zmdi-tag"></i> {{ trans('entities.page_tags') }}</h3>
+            <div class="body">
+                <table>
+                    <tbody>
+                    @foreach($page->tags as $tag)
+                        <tr class="tag">
+                            <td @if(!$tag->value) colspan="2" @endif><a href="{{ baseUrl('/search?term=%5B' . urlencode($tag->name) .'%5D') }}">{{ $tag->name }}</a></td>
+                            @if($tag->value) <td class="tag-value"><a href="{{ baseUrl('/search?term=%5B' . urlencode($tag->name) .'%3D' . urlencode($tag->value) . '%5D') }}">{{$tag->value}}</a></td> @endif
+                        </tr>
+                    @endforeach
+                    </tbody>
+                </table>
+            </div>
         </div>
     @endif
 
     @if (isset($page) && $page->attachments->count() > 0)
-        <h6 class="text-muted">{{ trans('entities.pages_attachments') }}</h6>
-        @foreach($page->attachments as $attachment)
-            <div class="attachment">
-                <a href="{{ $attachment->getUrl() }}" @if($attachment->external) target="_blank" @endif><i class="zmdi zmdi-{{ $attachment->external ? 'open-in-new' : 'file' }}"></i>{{ $attachment->name }}</a>
+        <div class="card">
+            <h3><i class="zmdi zmdi-attachment-alt"></i> {{ trans('entities.pages_attachments') }}</h3>
+            <div class="body">
+                @foreach($page->attachments as $attachment)
+                    <div class="attachment">
+                        <a href="{{ $attachment->getUrl() }}" @if($attachment->external) target="_blank" @endif><i class="zmdi zmdi-{{ $attachment->external ? 'open-in-new' : 'file' }}"></i>{{ $attachment->name }}</a>
+                    </div>
+                @endforeach
             </div>
-        @endforeach
+        </div>
     @endif
 
     @if (isset($pageNav) && count($pageNav))
-        <h6 class="text-muted">{{ trans('entities.pages_navigation') }}</h6>
-        <div class="sidebar-page-nav menu">
-            @foreach($pageNav as $navItem)
-                <li class="page-nav-item h{{ $navItem['level'] }}">
-                    <a href="{{ $navItem['link'] }}">{{ $navItem['text'] }}</a>
-                </li>
-            @endforeach
+        <div class="card">
+            <h3><i class="zmdi zmdi-compass"></i> {{ trans('entities.pages_navigation') }}</h3>
+            <div class="body">
+                <div class="sidebar-page-nav menu">
+                    @foreach($pageNav as $navItem)
+                        <li class="page-nav-item h{{ $navItem['level'] }}">
+                            <a href="{{ $navItem['link'] }}">{{ $navItem['text'] }}</a>
+                        </li>
+                    @endforeach
+                </div>
+            </div>
         </div>
     @endif
 
-    <h6 class="text-muted">{{ trans('entities.books_navigation') }}</h6>
-    <ul class="sidebar-page-list menu">
+    <div class="card">
+        <h3><i class="zmdi zmdi-book"></i> {{ trans('entities.books_navigation') }}</h3>
+        <div class="body">
+            <ul class="sidebar-page-list menu">
 
-        @if (userCan('view', $book))
-            <li class="book-header"><a href="{{ $book->getUrl() }}" class="book {{ $current->matches($book)? 'selected' : '' }}"><i class="zmdi zmdi-book"></i>{{$book->name}}</a></li>
-        @endif
-
-        @foreach($sidebarTree as $bookChild)
-            <li class="list-item-{{ $bookChild->getClassName() }} {{ $bookChild->getClassName() }} {{ $bookChild->isA('page') && $bookChild->draft ? 'draft' : '' }}">
-                <a href="{{ $bookChild->getUrl() }}" class="{{ $bookChild->getClassName() }} {{ $current->matches($bookChild)? 'selected' : '' }}">
-                    @if($bookChild->isA('chapter'))<i class="zmdi zmdi-collection-bookmark"></i>@else <i class="zmdi zmdi-file-text"></i>@endif{{ $bookChild->name }}
-                </a>
-
-                @if($bookChild->isA('chapter') && count($bookChild->pages) > 0)
-                    <p chapter-toggle class="text-muted @if($bookChild->matchesOrContains($current)) open @endif">
-                        <i class="zmdi zmdi-caret-right"></i> <i class="zmdi zmdi-file-text"></i> <span>{{ trans('entities.x_pages', ['count' => $bookChild->pages->count()]) }}</span>
-                    </p>
-                    <ul class="menu sub-menu inset-list @if($bookChild->matchesOrContains($current)) open @endif">
-                        @foreach($bookChild->pages as $childPage)
-                            <li class="list-item-page {{ $childPage->isA('page') && $childPage->draft ? 'draft' : '' }}">
-                                <a href="{{ $childPage->getUrl() }}" class="page {{ $current->matches($childPage)? 'selected' : '' }}">
-                                    <i class="zmdi zmdi-file-text"></i> {{ $childPage->name }}
-                                </a>
-                            </li>
-                        @endforeach
-                    </ul>
+                @if (userCan('view', $book))
+                    <li class="book-header"><a href="{{ $book->getUrl() }}" class="book {{ $current->matches($book)? 'selected' : '' }}"><i class="zmdi zmdi-book"></i>{{$book->name}}</a></li>
                 @endif
 
+                @foreach($sidebarTree as $bookChild)
+                    <li class="list-item-{{ $bookChild->getClassName() }} {{ $bookChild->getClassName() }} {{ $bookChild->isA('page') && $bookChild->draft ? 'draft' : '' }}">
+                        <a href="{{ $bookChild->getUrl() }}" class="{{ $bookChild->getClassName() }} {{ $current->matches($bookChild)? 'selected' : '' }}">
+                            @if($bookChild->isA('chapter'))<i class="zmdi zmdi-collection-bookmark"></i>@else <i class="zmdi zmdi-file-text"></i>@endif{{ $bookChild->name }}
+                        </a>
+
+                        @if($bookChild->isA('chapter') && count($bookChild->pages) > 0)
+                            <p chapter-toggle class="text-muted @if($bookChild->matchesOrContains($current)) open @endif">
+                                <i class="zmdi zmdi-caret-right"></i> <i class="zmdi zmdi-file-text"></i> <span>{{ trans('entities.x_pages', ['count' => $bookChild->pages->count()]) }}</span>
+                            </p>
+                            <ul class="menu sub-menu inset-list @if($bookChild->matchesOrContains($current)) open @endif">
+                                @foreach($bookChild->pages as $childPage)
+                                    <li class="list-item-page {{ $childPage->isA('page') && $childPage->draft ? 'draft' : '' }}">
+                                        <a href="{{ $childPage->getUrl() }}" class="page {{ $current->matches($childPage)? 'selected' : '' }}">
+                                            <i class="zmdi zmdi-file-text"></i> {{ $childPage->name }}
+                                        </a>
+                                    </li>
+                                @endforeach
+                            </ul>
+                        @endif
 
-            </li>
-        @endforeach
 
+                    </li>
+                @endforeach
+            </ul>
+        </div>
+    </div>
 
-    </ul>
 </div>
diff --git a/resources/views/sidebar-layout.blade.php b/resources/views/sidebar-layout.blade.php
new file mode 100644 (file)
index 0000000..78e0536
--- /dev/null
@@ -0,0 +1,30 @@
+@extends('base')
+
+@section('content')
+
+    <div class="faded-small toolbar">
+        <div class="container fluid">
+            <div class="row">
+                @yield('toolbar')
+            </div>
+        </div>
+    </div>
+
+
+    <div class="flex-fill flex">
+
+        <div class="sidebar flex print-hidden">
+            <div class="scroll-body">
+                @yield('sidebar')
+            </div>
+        </div>
+
+        <div class="content flex">
+            <div class="scroll-body">
+                @yield('body')
+            </div>
+        </div>
+    </div>
+
+
+@stop