]> BookStack Code Mirror - bookstack/commitdiff
Cleaned some page pointer layout/styles up
authorDan Brown <redacted>
Sun, 16 Jun 2019 10:17:15 +0000 (11:17 +0100)
committerDan Brown <redacted>
Sun, 16 Jun 2019 10:17:15 +0000 (11:17 +0100)
resources/assets/icons/copy.svg
resources/assets/icons/link.svg
resources/assets/sass/_pages.scss
resources/views/pages/pointer.blade.php [new file with mode: 0644]
resources/views/pages/show.blade.php

index 45e34a39bdb3db169569ef0e89d49fc4824d771d..3a52e2314a6f88c42b04f590602bf2d583ecb6e4 100644 (file)
@@ -1,4 +1,3 @@
 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-    <path d="M0 0h24v24H0z" fill="none"/>
     <path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/>
 </svg>
\ No newline at end of file
     <path d="M16 1H4c-1.1 0-2 .9-2 2v14h2V3h12V1zm3 4H8c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h11c1.1 0 2-.9 2-2V7c0-1.1-.9-2-2-2zm0 16H8V7h11v14z"/>
 </svg>
\ No newline at end of file
index 94eea0ed877d18877aa75e67fedb6239fdf1f2ca..3e8be1ce7da2bff861bbeae974d9ea631bddc20a 100644 (file)
@@ -1,4 +1,3 @@
 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
 <svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-    <path d="M0 0h24v24H0z" fill="none"/>
     <path d="M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z"/>
 </svg>
\ No newline at end of file
     <path d="M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z"/>
 </svg>
\ No newline at end of file
index c58f6ef476e55cac1498e5dc41ba09b4ac21ecc7..39e93f5b1403240c7157bd5dba5e761e473b834d 100755 (executable)
 }
 .pointer {
   border: 1px solid #CCC;
 }
 .pointer {
   border: 1px solid #CCC;
-  display: inline-block;
+  display: flex;
+  align-items: center;
+  justify-items: center;
   padding: $-s $-s;
   border-radius: 4px;
   padding: $-s $-s;
   border-radius: 4px;
-  box-shadow: 0 0 8px 1px rgba(212, 209, 209, 0.35);
+  box-shadow: 0 0 12px 1px rgba(212, 209, 209, 0.3);
   position: absolute;
   top: -60px;
   background-color:#FFF;
   position: absolute;
   top: -60px;
   background-color:#FFF;
     border-right: 1px solid #CCC;
     z-index: 56;
   }
     border-right: 1px solid #CCC;
     z-index: 56;
   }
-  input {
-    background-color: #FFF;
-    border: 1px solid #DDD;
-    color: #666;
-    width: 172px;
-    z-index: 40;
-  }
   input, button, a {
     position: relative;
     border-radius: 0;
   input, button, a {
     position: relative;
     border-radius: 0;
     vertical-align: top;
     padding: 5px 16px;
   }
     vertical-align: top;
     padding: 5px 16px;
   }
-  > i {
-    color: #888;
-    font-size: 18px;
-    padding-top: 4px;
+  input {
+    background-color: #FFF;
+    border: 1px solid #DDD;
+    color: #666;
+    width: 172px;
+    z-index: 40;
+    padding: 5px 10px;
   }
   span.icon {
   }
   span.icon {
+    fill: #444;
     cursor: pointer;
     user-select: none;
     cursor: pointer;
     user-select: none;
+    display: inline-block;
+    line-height: 1;
   }
   .input-group .button {
     line-height: 1;
   }
   .input-group .button {
     line-height: 1;
     box-shadow: none;
   }
   a.button {
     box-shadow: none;
   }
   a.button {
-    margin: 0 0 0 0;
-
-    &:hover {
-      fill: #fff;
-    }
+    margin: 0;
+    color: #FFF;
   }
   .svg-icon {
     width: 1.2em;
   }
   .svg-icon {
     width: 1.2em;
diff --git a/resources/views/pages/pointer.blade.php b/resources/views/pages/pointer.blade.php
new file mode 100644 (file)
index 0000000..d4aca5d
--- /dev/null
@@ -0,0 +1,13 @@
+<div class="pointer-container" id="pointer">
+    <div class="pointer anim {{ userCan('page-update', $page) ? 'is-page-editable' : ''}}" >
+        <span class="icon mr-xxs">@icon('link') @icon('include', ['style' => 'display:none;'])</span>
+        <div class="input-group inline block">
+            <input readonly="readonly" type="text" id="pointer-url" placeholder="url">
+            <button class="button outline icon" data-clipboard-target="#pointer-url" type="button" title="{{ trans('entities.pages_copy_link') }}">@icon('copy')</button>
+        </div>
+        @if(userCan('page-update', $page))
+            <a href="{{ $page->getUrl('/edit') }}" id="pointer-edit" data-edit-href="{{ $page->getUrl('/edit') }}"
+               class="button outline icon heading-edit-icon ml-s px-s" title="{{ trans('entities.pages_edit_content_link')}}">@icon('edit')</a>
+        @endif
+    </div>
+</div>
\ No newline at end of file
index ff4db2eec4a84df6b787c7f129e1f3cfe262b61e..0ae3fa5b6d1b7b36c109fd32e0f51fd6e7b25a03 100644 (file)
     </div>
 
     <div class="content-wrap card">
     </div>
 
     <div class="content-wrap card">
-        <div class="page-content flex" page-display="{{ $page->id }}">
-
-            <div class="pointer-container" id="pointer">
-                <div class="pointer anim {{ userCan('page-update', $page) ? 'is-page-editable' : ''}}" >
-                    <span class="icon text-primary">@icon('link') @icon('include', ['style' => 'display:none;'])</span>
-                    <span class="input-group">
-                    <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') }}">@icon('copy')</button>
-                </span>
-                    @if(userCan('page-update', $page))
-                        <a href="{{ $page->getUrl('/edit') }}" id="pointer-edit" data-edit-href="{{ $page->getUrl('/edit') }}"
-                           class="button icon heading-edit-icon" title="{{ trans('entities.pages_edit_content_link')}}">@icon('edit')</a>
-                    @endif
-                </div>
-            </div>
-
+        <div class="page-content" page-display="{{ $page->id }}">
+            @include('pages.pointer', ['page' => $page])
             @include('pages.page-display')
         </div>
     </div>
             @include('pages.page-display')
         </div>
     </div>