Updated and aligned entity dashboard elements

diff --git a/resources/assets/sass/_forms.scss b/resources/assets/sass/_forms.scss
index b35caae55af89fda2d22d1de936da11ad33365bc..9e4ef702d97a8a9e51d131421abad5fc890ccd96 100644 (file)
--- a/resources/assets/sass/_forms.scss
+++ b/resources/assets/sass/_forms.scss
@@ -325,6 +325,10 @@ div[editor-type="markdown"] .title-input.page-title input[type="text"] {
   &.flexible input {
     width: 100%;
   }
+  .search-box-cancel {
+    left: auto;
+    right: 0;
+  }
 }
 
 .outline > input {

diff --git a/resources/assets/sass/styles.scss b/resources/assets/sass/styles.scss
index bdc57d8fcee866ac40bfdb2a994d33375f073f65..424074a0d270394bd44e70f5e615c055b792e703 100644 (file)
--- a/resources/assets/sass/styles.scss
+++ b/resources/assets/sass/styles.scss
@@ -96,17 +96,6 @@ $loadingSize: 10px;
   }
 }
 
-
-// Search results
-.search-results > h3 a {
-  font-size: 0.66em;
-  color: $primary;
-  padding-left: $-m;
-  i {
-    padding-right: $-s;
-  }
-}
-
 // Back to top link
 $btt-size: 40px;
 [back-to-top] {

diff --git a/resources/views/books/show.blade.php b/resources/views/books/show.blade.php
index fbf928102ec2bf00687c6eb5188a0bd3da25aeee..b33cb6715e3a630729d745b9352894126243413b 100644 (file)
--- a/resources/views/books/show.blade.php
+++ b/resources/views/books/show.blade.php
@@ -45,14 +45,7 @@
             @endif
         </div>
 
-        <div class="search-results" v-cloak v-show="searching">
-            {{--TODO--}}
-            <h3 class="text-muted">{{ trans('entities.search_results') }} <a v-if="searching" v-on:click="clearSearch()" class="text-small">@icon('close'){{ trans('entities.search_clear') }}</a></h3>
-            <div v-if="!searchResults">
-                @include('partials.loading-icon')
-            </div>
-            <div v-html="searchResults"></div>
-        </div>
+        @include('partials.entity-dashboard-search-results')
     </div>
 
 @stop
@@ -133,20 +126,14 @@
 
 @section('left')
 
+    @include('partials.entity-dashboard-search-box')
+
     @if($book->tags->count() > 0)
         <div class="mb-xl">
             @include('components.tag-list', ['entity' => $book])
         </div>
     @endif
 
-    <div class="mb-xl">
-        <form v-on:submit.prevent="searchBook" class="search-box flexible">
-            <input v-model="searchTerm" v-on:change="checkSearchForm()" type="text" name="term" placeholder="{{ trans('entities.books_search_this') }}">
-            <button type="submit">@icon('search')</button>
-            <button v-if="searching" v-cloak class="text-neg" v-on:click="clearSearch()" type="button">@icon('close')</button>
-        </form>
-    </div>
-
     @if(count($activity) > 0)
         <div class="mb-xl">
             <h5>{{ trans('entities.recent_activity') }}</h5>

diff --git a/resources/views/chapters/show.blade.php b/resources/views/chapters/show.blade.php
index 399a4d662909f04eac29217d42e76b1d7de5f6a9..878a935df3ef606d9325e01f6a9b3095de6bc890 100644 (file)
--- a/resources/views/chapters/show.blade.php
+++ b/resources/views/chapters/show.blade.php
@@ -44,14 +44,7 @@
             @endif
         </div>
 
-        <div class="search-results" v-cloak v-show="searching">
-            {{--TODO--}}
-            <h3 class="text-muted">{{ trans('entities.search_results') }} <a v-if="searching" @click="clearSearch()" class="text-small">@icon('close'){{ trans('entities.search_clear') }}</a></h3>
-            <div v-if="!searchResults">
-                @include('partials.loading-icon')
-            </div>
-            <div v-html="searchResults"></div>
-        </div>
+        @include('partials.entity-dashboard-search-results')
     </div>
 
 @stop
@@ -137,20 +130,14 @@
 
 @section('left')
 
+    @include('partials.entity-dashboard-search-box')
+
     @if($chapter->tags->count() > 0)
         <div class="mb-xl">
             @include('components.tag-list', ['entity' => $chapter])
         </div>
     @endif
 
-    <div class="mb-xl">
-        <form @submit.prevent="searchBook" class="search-box flexible">
-            <input v-model="searchTerm" @change="checkSearchForm()" type="text" name="term" placeholder="{{ trans('entities.chapters_search_this') }}">
-            <button type="submit">@icon('search')</button>
-            <button v-if="searching" v-cloak class="text-neg" @click="clearSearch()" type="button">@icon('close')</button>
-        </form>
-    </div>
-
     @include('partials.book-tree', ['book' => $book, 'sidebarTree' => $sidebarTree])
 @stop
 

diff --git a/resources/views/partials/entity-dashboard-search-box.blade.php b/resources/views/partials/entity-dashboard-search-box.blade.php
new file mode 100644 (file)
index 0000000..99d37c5
--- /dev/null
+++ b/resources/views/partials/entity-dashboard-search-box.blade.php
@@ -0,0 +1,7 @@
+<div class="mb-xl">
+    <form v-on:submit.prevent="searchBook" class="search-box flexible">
+        <input v-model="searchTerm" v-on:change="checkSearchForm" type="text" name="term" placeholder="{{ trans('entities.books_search_this') }}">
+        <button type="submit">@icon('search')</button>
+        <button v-if="searching" v-cloak class="search-box-cancel text-neg" v-on:click="clearSearch" type="button">@icon('close')</button>
+    </form>
+</div>
\ No newline at end of file

diff --git a/resources/views/partials/entity-dashboard-search-results.blade.php b/resources/views/partials/entity-dashboard-search-results.blade.php
new file mode 100644 (file)
index 0000000..68c6f53
--- /dev/null
+++ b/resources/views/partials/entity-dashboard-search-results.blade.php
@@ -0,0 +1,15 @@
+<div class="search-results" v-cloak v-show="searching">
+    <div class="grid half v-center">
+        <h3 class="text-muted px-none">
+            {{ trans('entities.search_results') }}
+        </h3>
+        <div class="text-right">
+            <a v-if="searching" v-on:click="clearSearch" class="button outline">{{ trans('entities.search_clear') }}</a>
+        </div>
+    </div>
+
+    <div v-if="!searchResults">
+        @include('partials.loading-icon')
+    </div>
+    <div class="book-contents" v-html="searchResults"></div>
+</div>
\ No newline at end of file