Attachment 105709 Details for Bug 22807 – Bug 22807: (follow-up) Update style of skip button

[patch] Bug 22807: (follow-up) Update style of skip button

Bug-22807-follow-up-Update-style-of-skip-button.patch (text/plain), 2.71 KB, created by Owen Leonard on 2020-06-10 18:55:47 UTC

(hide)

Description:

Filename:

MIME Type:

Creator: Owen Leonard

Created: 2020-06-10 18:55:47 UTC

Size: 2.71 KB

patch

obsolete

>From c5c44371f40405f75a12be4bff6da38af28260f4 Mon Sep 17 00:00:00 2001
>From: Owen Leonard <oleonard@myacpl.org>
>Date: Wed, 10 Jun 2020 18:30:50 +0000
>Subject: [PATCH] Bug 22807: (follow-up) Update style of skip button
>
>This patch updates the markup and style of the skip button, adapting
>(i.e. stealing) the style of the skip link at https://webaim.org.
>
>To test, apply the patch and rebuild the OPAC CSS:
>https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client
>
>Go to any page in the OPAC and hit the tab key. The "Skip to main
>content" link should appear. Tabbing away from it should cause the link
>to hide. Hitting the ENTER key when the link is highlighted should cause
>the page to scroll to the main content.
>---
> koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss    | 25 ++++++++++++++++++++++
> .../opac-tmpl/bootstrap/en/includes/masthead.inc   |  2 +-
> 2 files changed, 26 insertions(+), 1 deletion(-)
>
>diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
>index 8babc17b63..bba5d0ec15 100644
>--- a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
>+++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
>@@ -3234,4 +3234,29 @@ $star-selected: #EDB867;
> }
> /*end browse search*/
> 
>+/* Skip to content link. CSS adapted from https://webaim.org/ */
>+#scrolltocontent {
>+    background: #c60000;
>+    border: 1px solid white;
>+    border-radius: 0 0 4px 0;
>+    border-width: 0 1px 1px 0;
>+    color: white;
>+    left: 0px;
>+    padding: 6px 12px;
>+    position: absolute;
>+    text-decoration: none;
>+    text-shadow: 0 -1px 0 rgba(58, 0, 0, 0.75);
>+    top: -40px;
>+    transition: top .5s ease-out;
>+    z-index: 100;
>+
>+    &:focus {
>+        left: 0px;
>+        outline-color: transparent;
>+        position: absolute;
>+        top: 0px;
>+        transition: top .1s ease-in;
>+    }
>+}
>+
> @import "responsive";
>diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc b/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc
>index 8de7ec60a5..f061f78ced 100644
>--- a/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc
>+++ b/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc
>@@ -12,7 +12,7 @@
>         <div class="navbar navbar-inverse navbar-static-top">
>             <div class="navbar-inner">
>                 <div class="container-fluid">
>-                    <button id="scrolltocontent" class="sr-only sr-only-focusable pull-left nav btn btn-danger" type="button">Skip to main content</button>
>+                    <button id="scrolltocontent">Skip to main content</button>
>                     <h1 id="logo">
>                         <a class="brand" href="/cgi-bin/koha/opac-main.pl">
>                             [% IF ( LibraryNameTitle ) %]
>-- 
>2.11.0

Actions: View | Diff | Splinter Review

Attachments on bug 22807: 105663 | 105664 | 105678 | 105698 | 105699 | 105700 | 105708 | 105709 | 105710 | 105711 | 105712 | 105713 | 105714 | 106124 | 106125 | 106126 | 106127 | 106128