govuk_tech_docs 2.2.2 → 2.4.2

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 4ebb7068421c3f7bc160f08cc145763a4d85df044700f794193403de1774bde5
-  data.tar.gz: 2ac84d99205129b273d153bfba9223bfb03933f4ca0a9202f0074e68869e267d
+  metadata.gz: b52d6e8aa198588eb1483b68997af30d2ead1179addc62110cfdab7d1d117920
+  data.tar.gz: ae9fb52fb1ca0929cc5be15f74ca32d6acd159eb248f397b976f963d8a00ca76
 SHA512:
-  metadata.gz: a8893b47757fcd32d00e863c58a0ca96d1dbc96d6eb139db9d7a6c56a852322040a737b56c64e0b6871a25bfdc84bfcd217e3786cd7d21afc66dbae24c770617
-  data.tar.gz: 05e1d0c02f4cf4a912afdb86e560e1cb31c5f74f67962baf392002e26c78d8567df5c51396b1546a71ae7e2476c30df5175f2e6aeea4ec0b9214ed3ff0695a67
+  metadata.gz: f0b288f32a3adf1c974d525186efd8839b71372eed7425a1e31dc13f6a27b840e00536d481dca6218d303bdfea281299672b409080a53ab40c7b483968cfda84
+  data.tar.gz: 18de4113f809ff2c8ef69f399d20e0781241242eaf0660cd2668d023d3e136114abada7e783087b4bf8e19149c4d1ba570fe161fb7798ec33ff49e8bbc1de6dc

data/.gitignore

@@ -29,6 +29,7 @@
 .rvmrc
 
 /example/build
+/example/.bundle
 /example/.sass-cache
 
 Gemfile.lock

data/.nvmrc

@@ -1 +1 @@
-10.16.0
+10

data/.travis.yml

@@ -3,6 +3,8 @@ cache:
   bundler: true
   npm: true
 before_install:
+  - nvm install
+  - nvm use
   - gem update --system
   - gem install bundler
 before_script:

data/CHANGELOG.md

@@ -1,5 +1,29 @@
 # Changelog
 
+## Unreleased
+
+## 2.4.2
+
+- [#251 Fix missing `<ul>` in single page navigation](https://github.com/alphagov/tech-docs-gem/pull/251)
+
+## 2.4.1
+
+- [#248: Remove IE8 fallback PNG with broken image reference](https://github.com/alphagov/tech-docs-gem/pull/248)
+
+## 2.4.0
+
+- [Bump redcarpet to 3.5.1 to fix CVE-2020-26298](https://github.com/alphagov/tech-docs-gem/pull/226)
+- [#238: Move the aria-expanded attribute to the correct element](https://github.com/alphagov/tech-docs-gem/pull/238)
+- [#240: Update menu html structure so it's one single hierarchical list](https://github.com/alphagov/tech-docs-gem/pull/240)
+- [#244: Don't change the focus of the page on initial load](https://github.com/alphagov/tech-docs-gem/pull/244)
+- [#243: Fix focus state for links containing inline code](https://github.com/alphagov/tech-docs-gem/pull/243)
+- [#245: Fix focus state for search results ‘Close’ button](https://github.com/alphagov/tech-docs-gem/pull/245)
+- [#246: Update GOV.UK Frontend to v3.13.0](https://github.com/alphagov/tech-docs-gem/pull/246)
+
+## 2.3.0
+
+- [#232: Update GOV.UK Frontend and use new link styles](https://github.com/alphagov/tech-docs-gem/pull/232)
+
 ## 2.2.2
 
 - [#223: Remove unnecessary CSS class on the search submit button](https://github.com/alphagov/tech-docs-gem/pull/223)

data/example/config/tech-docs.yml

@@ -13,6 +13,7 @@ header_links:
   Expired page: /expired-page.html
   Expired with owner: /expired-page-with-owner.html
   Not expired page: /not-expired-page.html
+  Single page nav: /single-page-nav.html
 
 footer_links:
   Accessibility: /hidden-page.html

data/example/source/single-page-nav.html.md

@@ -0,0 +1,13 @@
+---
+layout: layout
+multipage_nav: false
+hide_in_navigation: true
+---
+
+# A page that does not use multi-page navigation
+
+## A subheader
+
+### A h3 subheader
+
+## Another subheader

data/govuk_tech_docs.gemspec

@@ -32,6 +32,7 @@ Gem::Specification.new do |spec|
   spec.executables   = spec.files.grep(%r{^exe/}) { |f| File.basename(f) }
   spec.require_paths = ["lib"]
 
+  spec.add_dependency "autoprefixer-rails", "~> 10.2"
   spec.add_dependency "chronic", "~> 0.10.2"
   spec.add_dependency "middleman", "~> 4.0"
   spec.add_dependency "middleman-autoprefixer", "~> 2.10.0"
@@ -42,7 +43,7 @@ Gem::Specification.new do |spec|
   spec.add_dependency "middleman-syntax", "~> 3.2.0"
   spec.add_dependency "nokogiri"
   spec.add_dependency "openapi3_parser", "~> 0.9.0"
-  spec.add_dependency "redcarpet", "~> 3.5.0"
+  spec.add_dependency "redcarpet", "~> 3.5.1"
 
   spec.add_development_dependency "byebug"
   spec.add_development_dependency "capybara", "~> 3.32"

data/lib/assets/javascripts/_modules/collapsible-navigation.js

@@ -34,10 +34,9 @@
           arrayOfIds.push(uniqueId)
           $(this).addClass('collapsible__body')
             .attr('id', uniqueId)
-            .attr('aria-expanded', 'false')
         })
         $heading.addClass('collapsible__heading')
-          .after('<button class="collapsible__toggle" aria-controls="' + arrayOfIds.join(' ') + '"><span class="collapsible__toggle-label">Expand ' + $heading.text() + '</span><span class="collapsible__toggle-icon" aria-hidden="true"></button>')
+          .after('<button class="collapsible__toggle" aria-expanded="false" aria-controls="' + arrayOfIds.join(' ') + '"><span class="collapsible__toggle-label">Expand ' + $heading.text() + '</span><span class="collapsible__toggle-icon" aria-hidden="true"></button>')
         $topLevelItem.on('click', '.collapsible__toggle', function (e) {
           e.preventDefault()
           var $parent = $(this).parent()
@@ -47,14 +46,15 @@
     }
 
     function toggleHeading ($topLevelItem) {
-      var isOpen = $topLevelItem.hasClass('is-open')
+      var setOpen = !$topLevelItem.hasClass('is-open')
+
       var $heading = $topLevelItem.find('> a')
-      var $body = $topLevelItem.find('.collapsible__body')
+      var $button = $topLevelItem.find('.collapsible__toggle')
       var $toggleLabel = $topLevelItem.find('.collapsible__toggle-label')
 
-      $topLevelItem.toggleClass('is-open', !isOpen)
-      $body.attr('aria-expanded', isOpen ? 'false' : 'true')
-      $toggleLabel.text(isOpen ? 'Expand ' + $heading.text() : 'Collapse ' + $heading.text())
+      $topLevelItem.toggleClass('is-open', setOpen)
+      $button.attr('aria-expanded', setOpen ? 'true' : 'false')
+      $toggleLabel.text(setOpen ? 'Collapse ' + $heading.text() : 'Expand ' + $heading.text())
     }
 
     function openActiveHeading () {

data/lib/assets/javascripts/_modules/in-page-navigation.js

@@ -47,14 +47,12 @@
         fragment = fragmentForFirstElementInView()
       }
 
-      handleChangeInActiveItem(fragment)
+      highlightActiveItemInToc(fragment)
     }
 
     function handleScrollEvent () {
-      handleChangeInActiveItem(fragmentForFirstElementInView())
-    }
+      var fragment = fragmentForFirstElementInView()
 
-    function handleChangeInActiveItem (fragment) {
       storeCurrentPositionInHistoryApi(fragment)
       highlightActiveItemInToc(fragment)
     }

data/lib/assets/stylesheets/_govuk_tech_docs.scss

@@ -1,20 +1,19 @@
 $govuk-assets-path: "/assets/govuk/assets/";
 
 // Include only the bits of GOV.UK Frontend we need
-@import "govuk/settings/all";
-@import "govuk/tools/all";
-@import "govuk/helpers/all";
+$govuk-new-link-styles: true;
+@import "govuk/base";
 
 @import "govuk/core/all";
 @import "govuk/objects/all";
 
-@import "govuk/components/footer/footer";
-@import "govuk/components/header/header";
-@import "govuk/components/inset-text/inset-text";
-@import "govuk/components/input/input";
-@import "govuk/components/tag/tag";
-@import "govuk/components/skip-link/skip-link";
-@import "govuk/components/warning-text/warning-text";
+@import "govuk/components/footer/index";
+@import "govuk/components/header/index";
+@import "govuk/components/inset-text/index";
+@import "govuk/components/input/index";
+@import "govuk/components/tag/index";
+@import "govuk/components/skip-link/index";
+@import "govuk/components/warning-text/index";
 
 @import "govuk/utilities/all";
 @import "govuk/overrides/all";

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

@@ -87,21 +87,9 @@ html.has-search-results-open {
       min-height: auto;
     }
 
-    a:link, a:visited {
-      text-decoration: none;
-      color: $govuk-link-colour;
-    }
-
-    a:hover {
-      text-decoration: underline;
-
-      &:focus {
-        text-decoration: none;
-      }
-    }
-    a:focus {
-      outline: none;
-      @include govuk-focused-text;
+    a {
+      @include govuk-link-common;
+      @include govuk-link-style-no-visited-state;
     }
   }
 .search-results__inner {
@@ -142,16 +130,7 @@ html.has-search-results-open {
   cursor: pointer;
 
   &:focus {
-    background-color: $govuk-focus-colour;
-    outline: $govuk-focus-width solid transparent;
-    box-shadow: inset 0 0 0 1px $govuk-focus-colour;
-  }
-
-  &:focus:not(:active):not(:hover) {
-    border-color: $govuk-focus-colour;
-    color: $govuk-focus-text-colour;
-    background-color: $govuk-focus-colour;
-    box-shadow: 0 2px 0 $govuk-focus-text-colour;
+    @include govuk-focused-text;
   }
 
   &::after {

data/lib/assets/stylesheets/modules/_technical-documentation.scss

@@ -185,7 +185,7 @@
   }
 
   a:focus code {
-    background: inherit;
+    background: transparent;
     color: inherit;
   }
 

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

@@ -15,14 +15,18 @@
 
     &__list {
       li {
+        a {
+          @include govuk-link-decoration;
+          @include govuk-link-style-no-visited-state;
+          @include govuk-link-style-no-underline;
+        }
+
         a:link, a:visited {
           display: block;
           position: relative;
           padding: 8px govuk-spacing(6) 8px govuk-spacing(2);
           margin: 0 -1 * govuk-spacing(3);
           border-left: 5px solid transparent;
-          text-decoration: none;
-          color: $govuk-link-colour;
 
           @include govuk-media-query(tablet) {
             &.toc-link--in-view  {
@@ -33,21 +37,17 @@
           }
         }
 
+        a:hover {
+          @include govuk-link-hover-decoration;
+        }
+
         a:focus {
-          outline: none;
+          text-decoration: none;
 
           span {
             @include govuk-focused-text;
           }
         }
-
-        a:hover {
-          text-decoration: underline;
-
-          &:focus {
-            text-decoration: none;
-          }
-        }
       }
 
       // Top level

data/lib/govuk_tech_docs/table_of_contents/heading.rb

@@ -13,7 +13,11 @@ module GovukTechDocs
       end
 
       def href
-        @page_url + "#" + @attributes["id"]
+        if @page_url != "" && size == 1
+          @page_url
+        else
+          @page_url + "#" + @attributes["id"]
+        end
       end
 
       def title

data/lib/govuk_tech_docs/table_of_contents/heading_tree_renderer.rb

@@ -24,7 +24,7 @@ module GovukTechDocs
         end
 
         if tree.children.any? && level < @max_level
-          output += indentation + "<ul>\n"
+          output += indentation + "<ul>\n" unless level.zero?
 
           tree.children.each do |child|
             output += indentation + INDENTATION_INCREMENT + "<li>\n"
@@ -36,7 +36,7 @@ module GovukTechDocs
             output += indentation + INDENTATION_INCREMENT + "</li>\n"
           end
 
-          output += indentation + "</ul>\n"
+          output += indentation + "</ul>\n" unless level.zero?
         end
 
         output

data/lib/govuk_tech_docs/table_of_contents/helpers.rb

@@ -8,14 +8,11 @@ module GovukTechDocs
   module TableOfContents
     module Helpers
       def single_page_table_of_contents(html, url: "", max_level: nil)
-        headings = HeadingsBuilder.new(html, url).headings
-
-        if headings.none? { |heading| heading.size == 1 }
-          raise "No H1 tag found. You have to at least add one H1 heading to the page: " + url
-        end
+        output = "<ul>\n"
+        output += list_items_from_headings(html, url: url, max_level: max_level)
+        output += "</ul>\n"
 
-        tree = HeadingTreeBuilder.new(headings).tree
-        HeadingTreeRenderer.new(tree, max_level: max_level).html
+        output
       end
 
       def multi_page_table_of_contents(resources, current_page, config, current_page_html = nil)
@@ -28,11 +25,23 @@ module GovukTechDocs
         render_page_tree(resources, current_page, config, current_page_html)
       end
 
+      def list_items_from_headings(html, url: "", max_level: nil)
+        headings = HeadingsBuilder.new(html, url).headings
+
+        if headings.none? { |heading| heading.size == 1 }
+          raise "No H1 tag found. You have to at least add one H1 heading to the page: " + url
+        end
+
+        tree = HeadingTreeBuilder.new(headings).tree
+        HeadingTreeRenderer.new(tree, max_level: max_level).html
+      end
+
       def render_page_tree(resources, current_page, config, current_page_html)
         # Sort by weight frontmatter
         resources = resources
         .sort_by { |r| [r.data.weight ? 0 : 1, r.data.weight || 0] }
-        output = "";
+
+        output = "<ul>\n"
         resources.each do |resource|
           # Skip from page tree if hide_in_navigation:true frontmatter
           next if resource.data.hide_in_navigation
@@ -63,18 +72,20 @@ module GovukTechDocs
             end
 
           if resource.children.any? && resource.url != home_url
-            output += %{<ul><li><a href="#{resource.url}"><span>#{resource.data.title}</span></a>\n}
+            output += %{<li><a href="#{resource.url}"><span>#{resource.data.title}</span></a>\n}
             output += render_page_tree(resource.children, current_page, config, current_page_html)
-            output += "</li></ul>"
+            output += "</li>\n"
           else
             output +=
-              single_page_table_of_contents(
+              list_items_from_headings(
                 content,
                 url: resource.url,
                 max_level: config[:tech_docs][:max_toc_heading_level],
               )
           end
         end
+        output += "</ul>\n"
+
         output
       end
     end

data/lib/govuk_tech_docs/tech_docs_html_renderer.rb

@@ -16,7 +16,7 @@ module GovukTechDocs
 
     def header(text, level)
       anchor = UniqueIdentifierGenerator.instance.create(text, level)
-      %(<h#{level} id="#{anchor}">#{text}</h#{level}>)
+      %(<h#{level} id="#{anchor}">#{text}</h#{level}>\n)
     end
 
     def image(link, *args)

data/lib/govuk_tech_docs/version.rb

@@ -1,3 +1,3 @@
 module GovukTechDocs
-  VERSION = "2.2.2".freeze
+  VERSION = "2.4.2".freeze
 end

data/lib/source/layouts/_header.erb

@@ -13,7 +13,7 @@
             focusable="false"
             class="govuk-header__logotype-crown"
             xmlns="http://www.w3.org/2000/svg"
-            viewbox="0 0 132 97"
+            viewBox="0 0 132 97"
             height="30"
             width="36"
           >
@@ -21,7 +21,6 @@
               fill="currentColor" fill-rule="evenodd"
               d="M25 30.2c3.5 1.5 7.7-.2 9.1-3.7 1.5-3.6-.2-7.8-3.9-9.2-3.6-1.4-7.6.3-9.1 3.9-1.4 3.5.3 7.5 3.9 9zM9 39.5c3.6 1.5 7.8-.2 9.2-3.7 1.5-3.6-.2-7.8-3.9-9.1-3.6-1.5-7.6.2-9.1 3.8-1.4 3.5.3 7.5 3.8 9zM4.4 57.2c3.5 1.5 7.7-.2 9.1-3.8 1.5-3.6-.2-7.7-3.9-9.1-3.5-1.5-7.6.3-9.1 3.8-1.4 3.5.3 7.6 3.9 9.1zm38.3-21.4c3.5 1.5 7.7-.2 9.1-3.8 1.5-3.6-.2-7.7-3.9-9.1-3.6-1.5-7.6.3-9.1 3.8-1.3 3.6.4 7.7 3.9 9.1zm64.4-5.6c-3.6 1.5-7.8-.2-9.1-3.7-1.5-3.6.2-7.8 3.8-9.2 3.6-1.4 7.7.3 9.2 3.9 1.3 3.5-.4 7.5-3.9 9zm15.9 9.3c-3.6 1.5-7.7-.2-9.1-3.7-1.5-3.6.2-7.8 3.7-9.1 3.6-1.5 7.7.2 9.2 3.8 1.5 3.5-.3 7.5-3.8 9zm4.7 17.7c-3.6 1.5-7.8-.2-9.2-3.8-1.5-3.6.2-7.7 3.9-9.1 3.6-1.5 7.7.3 9.2 3.8 1.3 3.5-.4 7.6-3.9 9.1zM89.3 35.8c-3.6 1.5-7.8-.2-9.2-3.8-1.4-3.6.2-7.7 3.9-9.1 3.6-1.5 7.7.3 9.2 3.8 1.4 3.6-.3 7.7-3.9 9.1zM69.7 17.7l8.9 4.7V9.3l-8.9 2.8c-.2-.3-.5-.6-.9-.9L72.4 0H59.6l3.5 11.2c-.3.3-.6.5-.9.9l-8.8-2.8v13.1l8.8-4.7c.3.3.6.7.9.9l-5 15.4v.1c-.2.8-.4 1.6-.4 2.4 0 4.1 3.1 7.5 7 8.1h.2c.3 0 .7.1 1 .1.4 0 .7 0 1-.1h.2c4-.6 7.1-4.1 7.1-8.1 0-.8-.1-1.7-.4-2.4V34l-5.1-15.4c.4-.2.7-.6 1-.9zM66 92.8c16.9 0 32.8 1.1 47.1 3.2 4-16.9 8.9-26.7 14-33.5l-9.6-3.4c1 4.9 1.1 7.2 0 10.2-1.5-1.4-3-4.3-4.2-8.7L108.6 76c2.8-2 5-3.2 7.5-3.3-4.4 9.4-10 11.9-13.6 11.2-4.3-.8-6.3-4.6-5.6-7.9 1-4.7 5.7-5.9 8-.5 4.3-8.7-3-11.4-7.6-8.8 7.1-7.2 7.9-13.5 2.1-21.1-8 6.1-8.1 12.3-4.5 20.8-4.7-5.4-12.1-2.5-9.5 6.2 3.4-5.2 7.9-2 7.2 3.1-.6 4.3-6.4 7.8-13.5 7.2-10.3-.9-10.9-8-11.2-13.8 2.5-.5 7.1 1.8 11 7.3L80.2 60c-4.1 4.4-8 5.3-12.3 5.4 1.4-4.4 8-11.6 8-11.6H55.5s6.4 7.2 7.9 11.6c-4.2-.1-8-1-12.3-5.4l1.4 16.4c3.9-5.5 8.5-7.7 10.9-7.3-.3 5.8-.9 12.8-11.1 13.8-7.2.6-12.9-2.9-13.5-7.2-.7-5 3.8-8.3 7.1-3.1 2.7-8.7-4.6-11.6-9.4-6.2 3.7-8.5 3.6-14.7-4.6-20.8-5.8 7.6-5 13.9 2.2 21.1-4.7-2.6-11.9.1-7.7 8.8 2.3-5.5 7.1-4.2 8.1.5.7 3.3-1.3 7.1-5.7 7.9-3.5.7-9-1.8-13.5-11.2 2.5.1 4.7 1.3 7.5 3.3l-4.7-15.4c-1.2 4.4-2.7 7.2-4.3 8.7-1.1-3-.9-5.3 0-10.2l-9.5 3.4c5 6.9 9.9 16.7 14 33.5 14.8-2.1 30.8-3.2 47.7-3.2z"
             ></path>
-            <image src="/assets/images/govuk-logotype-crown.png" xlink:href="" class="govuk-header__logotype-crown-fallback-image" width="36" height="32"></image>
           </svg>
           <span class="govuk-header__logotype-text">
             GOV.UK

data/lib/source/layouts/layout.erb

@@ -4,8 +4,10 @@ wrap_layout :core do
 
   content_for(:toc_module, "in-page-navigation")
 
+  use_multipage_nav = current_page.data.fetch(:multipage_nav, config[:tech_docs][:multipage_nav])
+
   content_for :sidebar do
-    if config[:tech_docs][:multipage_nav] %>
+    if use_multipage_nav %>
       <%= multi_page_table_of_contents(sitemap.resources, current_page, config, html) %>
     <% else %>
       <%= single_page_table_of_contents(html, max_level: config[:tech_docs][:max_toc_heading_level]) %>

data/node_modules/govuk-frontend/govuk/_base.scss

@@ -0,0 +1,3 @@
+@import "settings/all";
+@import "tools/all";
+@import "helpers/all";