govuk_tech_docs 2.0.11 → 2.2.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: '085237b7227769188a60eeaf92b6dc4b8c46a2bb0c94f50daff3da0725dbe162'
-  data.tar.gz: 7bdf01e0d6901791ca227d26a98ef1845afb713040aba2ff463c0bb1b509bddb
+  metadata.gz: 4adec245cbbc73fe2a14f73eb4a0eb2f9acf4d8d751f0786271c59f479c8b244
+  data.tar.gz: 9017c133a8dace561bf56b4e2ec852b4dcdc15a341501b8784659f229f2f183a
 SHA512:
-  metadata.gz: 5a072be727fceaaab66ff8f78c70ab0a8901caf284a112761750c1d2668195d0d83c616b4bc75ecb89d600a37ec3c35309d255c3bd31b5641825067f71d04bf2
-  data.tar.gz: 3e810980b8f5c57a850e3e5c7c841981e3bcf579056c88cdafaceab0b3c540a37050efb54bb6f14c1c39b6a4e01667738f17a6cdb7f152ba41fd09f54bde69fc
+  metadata.gz: 3da0c05902288480bf1953b7d5ad275742707cb8324cebe68a1f970cb9dda1b2c70a6538aa9af7a6272973e4b08b3a10108ad6591cbb78bae5aa4e46d436357d
+  data.tar.gz: 1ca0540c1625e80f25d89426f893d15368da0c13b84e5824c4808abd62bfed7bf1e4b93738c2ecd76fe43d70fd23b5517494078ab94367f062f4a73f8c0cec8f

data/.github/pull_request_template.md

@@ -0,0 +1 @@
+⚠️ Don't forget to update the gem version in the [CHANGELOG](https://github.com/alphagov/tech-docs-gem/blob/master/CHANGELOG.md) before merging! When you're ready to release bump [version file](https://github.com/alphagov/tech-docs-gem/blob/master/lib/govuk_tech_docs/version.rb) and generate a tag. ⚠️

data/.rubocop.yml

@@ -2,7 +2,7 @@ inherit_gem:
   rubocop-govuk:
     - config/default.yml
 
-Layout/IndentHeredoc:
+Layout/HeredocIndentation:
   Enabled: false
 
 Naming/HeredocDelimiterNaming:

data/.ruby-version

@@ -1 +1 @@
-2.6.3
+2.7.2

data/.travis.yml

@@ -1,4 +1,7 @@
 language: ruby
+cache:
+  bundler: true
+  npm: true
 before_install:
   - gem update --system
   - gem install bundler

data/CHANGELOG.md

@@ -1,6 +1,58 @@
 # Changelog
 
-## Unreleased
+## 2.2.0
+
+### Accessibility Fixes
+
+- [#205: Improve table of contents accessibility](https://github.com/alphagov/tech-docs-gem/pull/205)
+- [#209: Some search and keyboard navigation updates](https://github.com/alphagov/tech-docs-gem/pull/209)
+- [#210: Stop linking images to new tabs](https://github.com/alphagov/tech-docs-gem/pull/210)
+- [#214: Implement row level table headings to allow accessible tables with row headings](https://github.com/alphagov/tech-docs-gem/pull/214)
+- [#215: Add tabindex and focus states to code blocks](https://github.com/alphagov/tech-docs-gem/pull/215)
+
+### Docs
+
+- [#206: Remove tdt docs content from readme file](https://github.com/alphagov/tech-docs-gem/pull/206)
+
+## 2.1.1
+
+### Fixes
+
+We’ve made fixes in the following pull requests:
+
+- [#199: Fix page expiry box link colours (hover and focus) ](https://github.com/alphagov/tech-docs-gem/pull/199)
+
+### Ruby version bump
+
+We've updated the Ruby version supported:
+
+- [#201: Bump ruby to 2.7.2](https://github.com/alphagov/tech-docs-gem/pull/201)
+
+## 2.1.0
+
+### New features
+
+#### Exclude pages from search engine results
+
+You can now exclude a page from search engine results by including `prevent_indexing: true` in the page's frontmatter.
+
+This was added in [pull request #192: Fixes and improvements to meta tags](https://github.com/alphagov/tech-docs-gem/pull/192).
+
+### Fixes
+
+We’ve made fixes in the following pull requests:
+
+- [#192: Fixes and improvements to meta tags](https://github.com/alphagov/tech-docs-gem/pull/192)
+
+## 2.0.13
+
+- [Pull request #189: Update orange code highlight colour to meet minimum AA colour contrast ratio criterion](https://github.com/alphagov/tech-docs-gem/pull/189)
+
+## 2.0.12
+
+- [Pull request #179: Use current markup for header and footer](https://github.com/alphagov/tech-docs-gem/pull/179)
+- [Pull request #178: Update dependencies and fix tests](https://github.com/alphagov/tech-docs-gem/pull/178) – includes updating GOV.UK Frontend to v3.6.0.
+- [Pull request #176: Use correct separator for page titles](https://github.com/alphagov/tech-docs-gem/pull/176)
 
 ## 2.0.11
 

data/README.md

@@ -3,23 +3,19 @@
 This repo contains the Ruby gem that distributes the [Tech Docs Template][tdt-template]. The Tech Docs Template is a [middleman template][mmt] that
 you can use to build technical documentation using a GOV.UK style.
 
-👉 Find out more about the template and its features from the [Tech Docs Template documentation][tdt-docs].
-
-## Usage
-
-👉 Find out how to [generate a new website with the Tech Docs Template][tdt-readme].
+To find out more about setting up and managing content for a website using this template, see the [Tech Docs Template documentation][tdt-docs].
 
 ## Contributing
 
 Everybody who uses this project is encouraged to contribute.
 
-👉 [See CONTRIBUTING.md](CONTRIBUTING.md) for guidance on making changes.
+You can find out more about contributing to this project from the[CONTRIBUTING.md file](CONTRIBUTING.md).
 
 ## GOV.UK frontend
 
 This gem uses [GOV.UK Frontend](https://github.com/alphagov/govuk-frontend), part of the [GOV.UK Design System](https://design-system.service.gov.uk/).
 
-We use `npm` to download the govuk-frontend package. To update to a new version, change the version in [package.json](blob/master/package.json) and run `npm update`.
+We use `npm` to download the govuk-frontend package. To update to a new version, change the version in the [package.json file](blob/master/package.json) and run `npm update`.
 
 ## Developing locally
 
@@ -30,19 +26,13 @@ There are 2 ways to develop with this gem. You can see your changes on either:
 
 ### Use your own Tech Docs Template website
 
-If you want to see how your changes to the gem affect your website, you have to point your site's Gemfile to your local checkout:
+To see how your changes to the gem affect your website, point your website's Gemfile to your local checkout:
 
 ```rb
 gem 'govuk_tech_docs', path: '../tech-docs-gem'
 ```
 
-To view your changes locally run:
-
-```sh
-bundle exec middleman server
-```
-
-See your website on `http://localhost:4567` in your browser.
+To preview your documentation changes locally, see the [Tech Docs Template documentation on previewing your documentation](https://tdt-documentation.london.cloudapps.digital/create_project/preview/#preview-your-documentation).
 
 ### Use the example in this repo
 
@@ -56,14 +46,16 @@ bundle exec middleman server
 
 See your website on `http://localhost:4567` in your browser.
 
+For more information on previewing your documentation locally, see the [Tech Docs template documentation on previewing your documentation](https://tdt-documentation.london.cloudapps.digital/create_project/preview/#preview-your-documentation).
+
 ## Tests
 
-The repository contains automated JavaScript tests that use [Jasmine][jas] test framework.
+This repository contains automated JavaScript tests that use the [Jasmine test framework][jas].
 
-To run the tests and see the results in your browser:
+You can run these tests and see the results in your browser.
 
-1. Run `bundle exec rake jasmine`
-2. Go to `http://localhost:8888` in your browser
+1. Run `bundle exec rake jasmine`.
+2. Go to `http://localhost:8888` in your browser.
 
 To run the tests and see the results in your terminal, run:
 
@@ -73,14 +65,15 @@ bundle exec rake jasmine:ci
 
 ## Releasing new versions
 
-To release a new version, create a new Pull Request that updates [version.rb](lib/govuk_tech_docs/version.rb) and [CHANGELOG.md](CHANGELOG.md). Don't mix this in with other changes - this makes it easier to find out what was released when. See [this PR to release a new version as an example](https://github.com/alphagov/tech-docs-gem/pull/15).
+To release a new version, create a new pull request (PR) that updates [version.rb](lib/govuk_tech_docs/version.rb) and [CHANGELOG.md](CHANGELOG.md).
+
+Do not include other changes in your pull request, as this makes it easier to find out what was released when. See an example of a [PR for releasing a new version](https://github.com/alphagov/tech-docs-gem/pull/15).
 
 Travis will automatically release a [new version to Rubygems.org](https://rubygems.org/gems/govuk_tech_docs).
 
 ## Licence
 
-Unless stated otherwise, the codebase is released under [the MIT License][mit].
-This covers both the codebase and any sample code in the documentation.
+Unless stated otherwise, the codebase is released under [the MIT License][mit]. This covers both the codebase and any sample code in the documentation.
 
 The documentation is [© Crown copyright][copyright] and available under the terms of the [Open Government 3.0][ogl] licence.
 

data/Rakefile

@@ -6,6 +6,7 @@ RSpec::Core::RakeTask.new(:spec)
 
 load "jasmine/tasks/jasmine.rake"
 
+desc "Lint Ruby and JavaScript"
 task :lint do
   sh "rubocop example lib spec Rakefile"
   sh "npm run lint --silent"

data/example/.ruby-version

@@ -1 +1 @@
-2.6.3
+2.7.2

data/example/source/index.html.md.erb

@@ -1,5 +1,6 @@
 ---
 title: GOV.UK Documentation Example
+description: Example of a documentation homepage
 old_paths:
  - /something/old-as-well.html
 ---

data/example/source/prevent-index-page.html.md

@@ -0,0 +1,10 @@
+---
+title: Un-indexed Page
+prevent_indexing: true
+hide_in_navigation: true
+---
+
+# Un-indexed page
+
+This page should not be indexed by search engines, because it contains a 
+`<meta name="robots" content="noindex">` tag.

data/govuk_tech_docs.gemspec

@@ -35,25 +35,25 @@ Gem::Specification.new do |spec|
   spec.add_dependency "activesupport"
   spec.add_dependency "chronic", "~> 0.10.2"
   spec.add_dependency "middleman", "~> 4.0"
-  spec.add_dependency "middleman-autoprefixer", "~> 2.7.0"
+  spec.add_dependency "middleman-autoprefixer", "~> 2.10.0"
   spec.add_dependency "middleman-compass", ">= 4.0.0"
   spec.add_dependency "middleman-livereload"
-  spec.add_dependency "middleman-sprockets", "~> 4.0.0"
-  spec.add_dependency "sprockets", "4.0.0.beta10"
-  spec.add_dependency "sass"
-  spec.add_dependency "middleman-syntax", "~> 3.0.0"
   spec.add_dependency "middleman-search-gds"
+  spec.add_dependency "middleman-sprockets", "~> 4.0.0"
+  spec.add_dependency "middleman-syntax", "~> 3.2.0"
   spec.add_dependency "nokogiri"
-  spec.add_dependency "redcarpet", "~> 3.3.2"
   spec.add_dependency "openapi3_parser", "~> 0.5.0"
   spec.add_dependency "pry"
+  spec.add_dependency "redcarpet", "~> 3.5.0"
+  spec.add_dependency "sass"
+  spec.add_dependency "sprockets", "~> 4.0.0"
 
 
-  spec.add_development_dependency "bundler", "~> 2.0.1"
-  spec.add_development_dependency "rake", "~> 10.0"
-  spec.add_development_dependency "capybara", "~> 2.18.0"
-  spec.add_development_dependency "rubocop-govuk", "~> 1.0.0"
-  spec.add_development_dependency "jasmine", "~> 3.1.0"
-  spec.add_development_dependency "rspec", "~> 3.7.0"
+  spec.add_development_dependency "bundler", "~> 2.2.0"
   spec.add_development_dependency "byebug"
+  spec.add_development_dependency "capybara", "~> 3.32"
+  spec.add_development_dependency "jasmine", "~> 3.5.0"
+  spec.add_development_dependency "rake", "~> 13.0"
+  spec.add_development_dependency "rspec", "~> 3.9.0"
+  spec.add_development_dependency "rubocop-govuk", "~> 3.5.0"
 end

data/lib/assets/javascripts/_modules/search.js

@@ -6,6 +6,7 @@
   Modules.Search = function Search () {
     var s = this
     var $html = $('html')
+    var $tocNav
     var $searchForm
     var $searchLabel
     var $searchInput
@@ -26,6 +27,7 @@
       $searchResults = $searchResultsWrapper.find('.search-results__content')
       $searchResultsTitle = $searchResultsWrapper.find('.search-results__title')
       $searchResultsClose = $searchResultsWrapper.find('.search-results__close')
+      $tocNav = $('#toc')
       s.downloadSearchIndex()
       attach()
       changeSearchLabel()
@@ -67,7 +69,14 @@
       $searchForm.on('submit', function (e) {
         e.preventDefault()
         showResults()
-        $searchResults.find('.search-result__title a').first().focus()
+        var $firstResult = $searchResults.find('.search-result__title a').first()
+        if ($firstResult.length) {
+          $firstResult.focus()
+        } else {
+          // if there are no results, show the "0 results" state
+          results = []
+          updateTitle()
+        }
       })
 
       // Closing the search results, move focus back to the search input
@@ -98,7 +107,7 @@
     }
 
     function changeSearchLabel () {
-      $searchLabel.text('Search')
+      $searchLabel.text('Search this documentation')
     }
 
     function getResults (query) {
@@ -192,12 +201,14 @@
       $searchResultsWrapper.addClass('is-open')
         .attr('aria-hidden', 'false')
       $html.addClass('has-search-results-open')
+      $tocNav.addClass('search-results-open')
     }
 
     function hideResults () {
       $searchResultsWrapper.removeClass('is-open')
         .attr('aria-hidden', 'true')
       $html.removeClass('has-search-results-open')
+      $tocNav.removeClass('search-results-open')
     }
 
     function sendQueryToAnalytics () {

data/lib/assets/javascripts/_modules/table-of-contents.js

@@ -7,23 +7,22 @@
     var $toc
     var $tocList
 
-    var $openLink
-    var $closeLink
+    var $openButton
+    var $closeButton
 
     this.start = function ($element) {
       $toc = $element
       $tocList = $toc.find('.js-toc-list')
-
       // Open link is not inside the module
-      $openLink = $html.find('.js-toc-show')
-      $closeLink = $toc.find('.js-toc-close')
+      $openButton = $html.find('.js-toc-show')
+      $closeButton = $toc.find('.js-toc-close')
 
       fixRubberBandingInIOS()
       updateAriaAttributes()
 
       // Need delegated handler for show link as sticky polyfill recreates element
-      $openLink.on('click.toc', preventingScrolling(openNavigation))
-      $closeLink.on('click.toc', preventingScrolling(closeNavigation))
+      $openButton.on('click.toc', preventingScrolling(openNavigation))
+      $closeButton.on('click.toc', preventingScrolling(closeNavigation))
       $tocList.on('click.toc', 'a', closeNavigation)
 
       // Allow aria hidden to be updated when resizing from mobile to desktop or
@@ -65,21 +64,17 @@
 
       toggleBackgroundVisiblity(false)
       updateAriaAttributes()
-
-      focusFirstLinkInToc()
+      $toc.focus()
     }
 
     function closeNavigation () {
       $html.removeClass('toc-open')
+      $html.removeClass('has-search-results-open')
 
       toggleBackgroundVisiblity(true)
       updateAriaAttributes()
     }
 
-    function focusFirstLinkInToc () {
-      $('a', $tocList).first().focus()
-    }
-
     function toggleBackgroundVisiblity (visibility) {
       $('.toc-open-disabled').attr('aria-hidden', visibility ? '' : 'true')
     }
@@ -87,7 +82,7 @@
     function updateAriaAttributes () {
       var tocIsVisible = $toc.is(':visible')
 
-      $($openLink).add($closeLink)
+      $($openButton).add($closeButton)
         .attr('aria-expanded', tocIsVisible ? 'true' : 'false')
 
       $toc.attr('aria-hidden', tocIsVisible ? 'false' : 'true')

data/lib/assets/stylesheets/modules/_page-review.scss

@@ -13,11 +13,9 @@
 
   a:link,
   a:visited {
-    color: inherit;
-  }
-
-  a:hover {
-    color: $govuk-link-hover-colour;
+    &:not(:focus) {
+      color: inherit;
+    }
   }
 
   a:active {

data/lib/assets/stylesheets/modules/_search.scss

@@ -1,16 +1,9 @@
+$input-size: 40px;
+
 @include govuk-media-query($media-type: screen) {
   .page-title + .search {
     margin-top: govuk-spacing(6);
   }
-
-  .js .search__label {
-    position: absolute;
-    left: -9999em;
-    top: auto;
-    width: 1px;
-    height: 1px;
-    overflow: hidden;
-  }
 }
 
 @include govuk-media-query($media-type: print) {
@@ -19,6 +12,46 @@
   }
 }
 
+.js .search__label {
+  @extend .govuk-visually-hidden;
+}
+
+.search__form {
+  position: relative;
+}
+
+.search__input {
+  width: 230px;
+  width: calc(100% - #{$input-size});
+}
+
+.search__button {
+  position: absolute;
+  bottom: 0;
+  right: 0;
+  border: 0;
+  background-color: govuk-colour('blue');
+  color: #fff;
+  cursor: pointer;
+  padding: 0;
+  width: $input-size;
+  height: 100%;
+  background-image: url('/images/search-button.png');
+  background-repeat: no-repeat;
+  background-position: 2px 50%;
+  text-indent: -5000px;
+  overflow: hidden;
+  &:focus {
+    outline: $govuk-focus-width solid $govuk-focus-colour;
+    outline-offset: 0;
+    box-shadow: inset 0 0 0 $govuk-border-width-form-element * 2 govuk-colour("black");
+
+    @include govuk-if-ie8 {
+      border-width: $govuk-border-width-form-element * 2;
+    }
+  }
+}
+
 html.has-search-results-open {
   overflow: hidden;
   .app-pane__content {
@@ -47,6 +80,7 @@ html.has-search-results-open {
       top: 0;
       // The width of the sidebar
       left: 330px;
+      min-height: auto;
     }
 
     a:link, a:visited {