Bug 27846: authorities, catalogue and cataloguing folders

Modified breadcrumbs to be accessible, in particular for a
screen-reader.

Made the block of breadcrumbs be a <nav aria label="Breadcrumb"
class="breadcrumb"> with an ordered list inside. The last breadcrumbs
also has aria-current="page" to specify that it is the current page.

To test:
1) Apply patch
2) Build scss file
3) Ensure each of the files in the authorities, catalogue and
   cataloguing folders have breadcrumbs that are in a <nav aria
   label="Breadcrumb" class="breadcrumb"> block
4) Ensure that there is an ordered list in the block of breadcrumbs
5) Ensure that the last breadcrumb has aria-current="page"
6) Ensure that the breadcrumbs on each page of the staff client
   belonging to these files look the same as before, but the '>' symbol
   is replaced with '/' and the last breadcrumb has bold text
7) Ensure that when the last breadcrumb is clicked it takes you to the
   page you are currently on

Sponsored-by: Catalyst IT
Signed-off-by: Owen Leonard <oleonard@myacpl.org>
Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
This commit is contained in:
Wainui Witika-Park 2021-03-13 09:29:07 +00:00 committed by Jonathan Druart
parent cde5aa1050
commit ec04fcb16a
24 changed files with 435 additions and 76 deletions

View File

@ -8,7 +8,18 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'authorities-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; Authorities</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="#" aria-current="page">
Authorities
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -181,7 +181,32 @@ function confirmnotdup(redirect){
[% INCLUDE 'header.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/authorities/authorities-home.pl">Authorities</a> &rsaquo; [% IF ( authid ) %]Modify authority #[% authid | html %] ([% authtypetext | html %])[% ELSE %]Adding authority [% authtypetext | html %][% END %] </div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/authorities/authorities-home.pl">Authorities</a>
</li>
[% IF ( authid ) %]
<li>
<a href="#" aria-current="page">
Modify authority #[% authid | html %] ([% authtypetext | html %])
</a>
</li>
[% ELSE %]
<li>
<a href="#" aria-current="page">
Adding authority [% authtypetext | html %]
</a>
</li>
[% END %]
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -17,13 +17,27 @@
<body id="auth_detail" class="auth">
[% INCLUDE 'header.inc' %]
[% INCLUDE 'authorities-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/authorities/authorities-home.pl">Authorities</a> &rsaquo;
[% IF ( unknownauthid ) %]
Unknown authority record
[% ELSE %]
Details for authority #[% authid | html %] ([% authtypetext | html %])
[% END %]
</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/authorities/authorities-home.pl">Authorities</a>
</li>
<li>
<a href="#" aria-current="page">
[% IF ( unknownauthid ) %]
Unknown authority record
[% ELSE %]
Details for authority #[% authid | html %] ([% authtypetext | html %])
[% END %]
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -15,7 +15,22 @@ div#result { margin-top: 1em; }
<body id="auth_merge" class="cat">
[% INCLUDE 'header.inc' %]
[% INCLUDE 'authorities-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/authorities/authorities-home.pl">Authorities</a> &rsaquo; Merging records</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/authorities/authorities-home.pl">Authorities</a>
</li>
<li>
<a href="#" aria-current="page">
Merging records
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -10,7 +10,21 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'authorities-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/authorities/authorities-home.pl">Authorities</a> &rsaquo; Authority search results</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/authorities/authorities-home.pl">Authorities</a>
</li>
<li>
<a href="#" aria-current="page">
Authority search results
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -17,13 +17,33 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a> &rsaquo;
[% IF ( unknownbiblionumber ) %]
Unknown record
[% ELSE %]
[% INCLUDE 'biblio-title.inc' link = 1 %] &rsaquo; ISBD details
[% END %]
</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
[% IF ( unknownbiblionumber ) %]
<li>
<a href="#" aria-current="page">
Unknown record
</a>
</li>
[% ELSE %]
<li>
[% INCLUDE 'biblio-title.inc' link = 1 %]
</li>
<li>
<a href="#" aria-current="page">
ISBD details
</a>
</li>
[% END %]
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -18,13 +18,33 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a> &rsaquo;
[% IF ( unknownbiblionumber ) %]
Unknown record
[% ELSE %]
[% INCLUDE 'biblio-title.inc' link = 1 %] &rsaquo; MARC details
[% END %]
</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
[% IF ( unknownbiblionumber ) %]
<li>
<a href="#" aria-current="page">
Unknown record
</a>
</li>
[% ELSE %]
<li>
[% INCLUDE 'biblio-title.inc' link = 1 %]
</li>
<li>
<a href="#" aria-current="page">
MARC details
</a>
</li>
[% END %]
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -28,7 +28,19 @@
<body id="catalog_advsearch" class="catalog">
[% INCLUDE 'header.inc' %]
[% INCLUDE 'adv-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; Advanced search</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="#" aria-current="page">
Advanced search
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -47,13 +47,33 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a> &rsaquo;
[% IF ( unknownbiblionumber ) %]
Unknown record
[% ELSE %]
[% INCLUDE 'biblio-title.inc' link = 1 %] &rsaquo; Details
[% END %]
</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
[% IF ( unknownbiblionumber ) %]
<li>
<a href="#" aria-current="page">
Unknown record
</a>
</li>
[% ELSE %]
<li>
[% INCLUDE 'biblio-title.inc' link = 1 %]
</li>
<li>
<a href="#" aria-current="page">
Details
</a>
</li>
[% END %]
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -27,7 +27,24 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a> &rsaquo; [% INCLUDE 'biblio-title.inc' link = 1 %] &rsaquo; Images</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
<li>
[% INCLUDE 'biblio-title.inc' link = 1 %]
</li>
<li>
<a href="#" aria-current="page">
Images
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -15,7 +15,24 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a> &rsaquo; [% INCLUDE 'biblio-title.inc' link = 1 %] &rsaquo; Checkout history</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
<li>
[% INCLUDE 'biblio-title.inc' link = 1 %]
</li>
<li>
<a href="#" aria-current="page">
Checkout history
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -150,9 +150,22 @@
<body id="catalog_itemsearch" class="catalog">
[% INCLUDE 'header.inc' %]
[% INCLUDE 'home-search.inc' %]
<div id="breadcrumbs">
<a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a> &rsaquo; Item search
</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
<li>
<a href="#" aria-current="page">
Item search
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -19,15 +19,25 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs">
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
&rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a> &rsaquo;
[% IF ( unknownbiblionumber ) %]
Unknown record
[% ELSE %]
MARC details for <em>[% bibliotitle | html %]</em>
[% END %]
</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
<li>
<a href="#" aria-current="page">
[% IF ( unknownbiblionumber ) %]
Unknown record
[% ELSE %]
MARC details for <em>[% bibliotitle | html %]</em>
[% END %]
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -15,7 +15,24 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a> &rsaquo; [% INCLUDE 'biblio-title.inc' link = 1 %] &rsaquo; Item details</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
<li>
[% INCLUDE 'biblio-title.inc' link = 1 %]
</li>
<li>
<a href="#" aria-current="page">
Item details
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -32,11 +32,22 @@
[% CoceProviders = Koha.Preference('CoceProviders') %]
[% CoceHost = Koha.Preference('CoceHost') %]
<div id="breadcrumbs">
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
&rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
&rsaquo; Search [% IF ( query_desc ) %]for '[% query_desc | html %]'[% END %][% IF ( limit_desc ) %]&nbsp;with limit(s):&nbsp;'[% limit_desc | html %]'[% END %]
</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
<li>
<a href="#" aria-current="page">
Search [% IF ( query_desc ) %] for '[% query_desc | html %]'[% END %]
[% IF ( limit_desc ) %] &nbsp;with limit(s):&nbsp;'[% limit_desc | html %]'[% END %]
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -13,9 +13,21 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs">
<a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a> &rsaquo; Search history
</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
<li>
<a href="#" aria-current="page">
Search history
</a>
</li>
</ol>
</nav>
<div class="container-fluid">
<div class="row">

View File

@ -12,7 +12,24 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a> &rsaquo; [% INCLUDE 'biblio-title.inc' link = 1 %] &rsaquo; Stock rotation details</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
<li>
[% INCLUDE 'biblio-title.inc' link = 1 %]
</li>
<li>
<a href="#" aria-current="page">
Stock rotation details
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -711,15 +711,25 @@ function PopupMARCFieldDoc(field) {
[% INCLUDE 'header.inc' %]
<div id="breadcrumbs">
<a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo;
<a href="/cgi-bin/koha/cataloguing/addbooks.pl">Cataloging</a> &rsaquo;
[% IF ( biblionumber ) %]
Editing <em>[% title | html %]</em> (Record number [% biblionumber | html %])
[% ELSE %]
Add MARC record
[% END %]
</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/cataloguing/addbooks.pl">Cataloging</a>
</li>
<li>
<a href="#" aria-current="page">
[% IF ( biblionumber ) %]
Editing <em>[% title | html %]</em> (Record number [% biblionumber | html %])
[% ELSE %]
Add MARC record
[% END %]
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -10,7 +10,18 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cataloging-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; Cataloging</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="#" aria-current="page">
Cataloging
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -24,12 +24,24 @@
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cataloging-search.inc' %]
<div id="breadcrumbs">
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
&rsaquo; <a href="/cgi-bin/koha/cataloguing/addbooks.pl">Cataloging</a>
&rsaquo; Edit <a href="/cgi-bin/koha/cataloguing/addbiblio.pl?biblionumber=[% biblionumber | uri %]">[% title | html %] [% IF ( author ) %] by [% author | html %][% END %] (Record #[% biblionumber | html %])</a>
&rsaquo; <a href="/cgi-bin/koha/cataloguing/additem.pl?biblionumber=[% biblionumber | uri %]">Items</a>
</div>
</li>
<li>
<a href="/cgi-bin/koha/cataloguing/addbooks.pl">Cataloging</a>
</li>
<li>
<a href="/cgi-bin/koha/cataloguing/addbiblio.pl?biblionumber=[% biblionumber | uri %]">Edit <em>[% title | html %] [% IF ( author ) %] by [% author | html %][% END %] (Record #[% biblionumber | html %])</em></a>
</li>
<li>
<a href="#" aria-current="page">
Items
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -18,7 +18,21 @@
[% INCLUDE 'header.inc' %]
[% PROCESS 'keyboard_shortcuts.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/cataloguing/addbooks.pl">Cataloging</a> &rsaquo; Editor</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/cataloguing/addbooks.pl">Cataloging</a>
</li>
<li>
<a href="#" aria-current="page">
Editor
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -5,7 +5,22 @@
<body id="catalog_linkitem" class="catalog">
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/cataloguing/addbooks.pl">Cataloging</a> &rsaquo; Link a host record to <em>[% bibliotitle | html %]</em></div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/cataloguing/addbooks.pl">Cataloging</a>
</li>
<li>
<a href="#" aria-current="page">
Link a host record to <em>[% bibliotitle | html %]</em>
</a>
</li>
</ol>
</nav>
<div class="container-fluid">
<div class="row">

View File

@ -17,7 +17,21 @@ div#result { margin-top: 1em; }
<body id="cat_merge" class="cat">
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cataloging-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/cataloguing/addbooks.pl">Cataloging</a> &rsaquo; Merging records</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/cataloguing/addbooks.pl">Cataloging</a>
</li>
<li>
<a href="#" aria-current="page">
Merging records
</a>
</li>
</nav>
<div class="main container-fluid">
<div class="row">

View File

@ -6,7 +6,25 @@
<body id="catalog_moveitem" class="catalog">
[% INCLUDE 'header.inc' %]
[% INCLUDE 'cat-search.inc' %]
<div id="breadcrumbs"><a href="/cgi-bin/koha/mainpage.pl">Home</a> &rsaquo; <a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a> &rsaquo; [% INCLUDE 'biblio-title.inc' link = 1 %] &rsaquo; Attach an item</div>
<nav aria-label="Breadcrumb" class="breadcrumb">
<ol>
<li>
<a href="/cgi-bin/koha/mainpage.pl">Home</a>
</li>
<li>
<a href="/cgi-bin/koha/catalogue/search.pl">Catalog</a>
</li>
<li>
[% INCLUDE 'biblio-title.inc' link = 1 %]
</li>
<li>
<a href="#" aria-current="page">
Attach an item
</a>
</li>
</ol>
</nav>
<div class="main container-fluid">
<div class="row">