]> BookStack Code Mirror - bookstack/commitdiff
projects / bookstack / commitdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side (parent: 7d951b8)
Added a "skip to content" link.
authorDan Brown <redacted>
Tue, 15 Jun 2021 19:58:45 +0000 (20:58 +0100)
committerDan Brown <redacted>
Tue, 15 Jun 2021 19:58:45 +0000 (20:58 +0100)
Closes #2810

resources/lang/en/common.php patch | blob | history
resources/sass/styles.scss patch | blob | history
resources/views/base.blade.php patch | blob | history
resources/views/common/parts/skip-to-content.blade.php [new file with mode: 0644] patch | blob
resources/views/errors/500.blade.php patch | blob | history
resources/views/pages/edit.blade.php patch | blob | history
resources/views/simple-layout.blade.php patch | blob | history
resources/views/tri-layout.blade.php patch | blob | history

diff --git a/resources/lang/en/common.php b/resources/lang/en/common.php
index d4508c3c7d4c9a7def3b457b1d9d2d96673d7d23..1861869e3ff7ac7d8ed69becf0e3f9aa2aef9a39 100644 (file)
--- a/resources/lang/en/common.php
+++ b/resources/lang/en/common.php
@@ -60,6 +60,7 @@ return [
     'no_activity' => 'No activity to show',
     'no_items' => 'No items available',
     'back_to_top' => 'Back to top',
+    'skip_to_main_content' => 'Skip to main content',
     'toggle_details' => 'Toggle Details',
     'toggle_thumbnails' => 'Toggle Thumbnails',
     'details' => 'Details',
diff --git a/resources/sass/styles.scss b/resources/sass/styles.scss
index 37f39a4f74f8f5c3c43cf9f7bc9c051c956bd785..582bf7c7569a7faa4a55b7fc1d159e31cd490db6 100644 (file)
--- a/resources/sass/styles.scss
+++ b/resources/sass/styles.scss
@@ -136,6 +136,23 @@ $btt-size: 40px;
   }
 }
 
+.skip-to-content-link {
+  position: fixed;
+  top: -$-xxl;
+  left: 0;
+  background-color: #FFF;
+  z-index: 15;
+  border-radius: 0 4px 4px 0;
+  display: block;
+  box-shadow: $bs-dark;
+  font-weight: bold;
+  &:focus {
+    top: $-xl;
+    outline-offset: -10px;
+    outline: 2px dotted var(--color-primary);
+  }
+}
+
 .contained-search-box {
   display: flex;
   height: 38px;
diff --git a/resources/views/base.blade.php b/resources/views/base.blade.php
index 66604345f3bfb0c4136138eb6269b116dc1ea7da..0734466be7cc81b2cc91e00b860047a118fa8ba1 100644 (file)
--- a/resources/views/base.blade.php
+++ b/resources/views/base.blade.php
@@ -28,6 +28,7 @@
 </head>
 <body class="@yield('body-class')">
 
+    @include('common.parts.skip-to-content')
     @include('partials.notifications')
     @include('common.header')
 
diff --git a/resources/views/common/parts/skip-to-content.blade.php b/resources/views/common/parts/skip-to-content.blade.php
new file mode 100644 (file)
index 0000000..b63573d
--- /dev/null
+++ b/resources/views/common/parts/skip-to-content.blade.php
@@ -0,0 +1 @@
+<a class="px-m py-s skip-to-content-link" href="#main-content">{{ trans('common.skip_to_main_content') }}</a>
\ No newline at end of file
diff --git a/resources/views/errors/500.blade.php b/resources/views/errors/500.blade.php
index d06ddbc574a2707542a96d97349f86c473d36fdc..ad759b49dc60bc18139a71022d5b99d42ef2083f 100644 (file)
--- a/resources/views/errors/500.blade.php
+++ b/resources/views/errors/500.blade.php
@@ -5,7 +5,7 @@
     <div class="container small py-xl">
 
         <main class="card content-wrap auto-height">
-            <div class="body">
+            <div id="main-content" class="body">
                 <h3>{{ trans('errors.error_occurred') }}</h3>
                 <h5 class="mb-m">{{ $message ?? 'An unknown error occurred' }}</h5>
                 <p><a href="{{ url('/') }}" class="button outline">{{ trans('errors.return_home') }}</a></p>
diff --git a/resources/views/pages/edit.blade.php b/resources/views/pages/edit.blade.php
index f580b06cf7cd1caeee8a0bb624e5ba20a8411d10..2120bddb233a7d457bb7fd83d60dbf5449c8c0dd 100644 (file)
--- a/resources/views/pages/edit.blade.php
+++ b/resources/views/pages/edit.blade.php
@@ -8,7 +8,7 @@
 
 @section('content')
 
-    <div class="flex-fill flex fill-height">
+    <div id="main-content" class="flex-fill flex fill-height">
         <form action="{{ $page->getUrl() }}" autocomplete="off" data-page-id="{{ $page->id }}" method="POST" class="flex flex-fill">
             {{ csrf_field() }}
 
diff --git a/resources/views/simple-layout.blade.php b/resources/views/simple-layout.blade.php
index a57aaebef64f39f45460c27dfc6d955ff2ce74d4..b7d6d3ccddc9f88e4f524ebfbe2569be1c7e3416 100644 (file)
--- a/resources/views/simple-layout.blade.php
+++ b/resources/views/simple-layout.blade.php
@@ -4,7 +4,7 @@
 
     <div class="flex-fill flex">
         <div class="content flex">
-            <div class="scroll-body">
+            <div id="main-content" class="scroll-body">
                 @yield('body')
             </div>
         </div>
diff --git a/resources/views/tri-layout.blade.php b/resources/views/tri-layout.blade.php
index dc4115f291f1a874aa794cb7525a89a6db6fd39d..d985db6499d03f003b23d4b16c4e850966706fe5 100644 (file)
--- a/resources/views/tri-layout.blade.php
+++ b/resources/views/tri-layout.blade.php
@@ -34,7 +34,7 @@
         </div>
 
         <div class="@yield('body-wrap-classes') tri-layout-middle">
-            <div class="tri-layout-middle-contents">
+            <div id="main-content" class="tri-layout-middle-contents">
                 @yield('body')
             </div>
         </div>
The core source code for the BookStack project.
Morty Proxy This is a proxified and sanitized view of the page, visit original site.