Allow custom skip link(s)

jazairi · jazairi · commit daa56df04bc0 · 2024-03-26T12:51:05.000-04:00
Why these changes are being introduced: TIMDEX UI requires multiple skip links, and other applications may benefit from being able to change the href or text of the skip link. Relevant ticket(s): * [GDT-161](https://mitlibraries.atlassian.net/browse/GDT-161) How this addresses that need: This moves the skip link to a partial, `layouts/_skip_links.html.erb`, so applications using this gem can customize it if needed. Side effects of this change: Any CSS changes (e.g., if we need to add a class selector for multiple skip links).
diff --git a/README.md b/README.md
@@ -58,6 +58,9 @@ repo and make appropriate changes.
 `app/views/layouts/_site_footer.html.erb` is also available if you really need
 a third footer above the other two (I'm looking at you bento!).
 
+`app/views/layouts/_skip_links.html.erb` provides the option to change the href or text for the skip link, or include
+multiple skip links if needed.
+
 If you need to make changes to other templates, you can also copy those to your local repo but you should check with others as the main header / footer / etc are probably best left as they are in this gem.
 
 ## Adding Additional JavaScript to HTML Head
diff --git a/app/views/layouts/_skip_links.html.erb b/app/views/layouts/_skip_links.html.erb
@@ -0,0 +1 @@
+<a id="skip" class="sr sr-focusable" href="#content-main">Skip to main content</a>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -4,7 +4,7 @@
     <%= render partial: "layouts/head" %>
   </head>
   <body class="app-theme">
-    <a id="skip" class="skip sr sr-focusable" href="#content-main">Skip to main content</a>
+    <%= render partial: "layouts/skip_links" %>
 
     <div class="wrap-page">
 

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1 @@`
	`1`	`+<a id="skip" class="sr sr-focusable" href="#content-main">Skip to main content</a>`