govuk_publishing_components 7.1.0 → 7.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/app/assets/javascripts/govuk_publishing_components/lib/toggle.js +69 -0
- data/app/assets/stylesheets/govuk_publishing_components/_all_components.scss +2 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/_subscription-links.scss +20 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/helpers/_organisation-colours.scss +20 -0
- data/app/views/govuk_publishing_components/components/_document_list.html.erb +6 -2
- data/app/views/govuk_publishing_components/components/_subscription-links.html.erb +35 -6
- data/app/views/govuk_publishing_components/components/docs/document_list.yml +17 -0
- data/app/views/govuk_publishing_components/components/docs/input.yml +7 -1
- data/app/views/govuk_publishing_components/components/docs/subscription-links.yml +22 -0
- data/config/locales/en.yml +4 -0
- data/lib/govuk_publishing_components.rb +1 -0
- data/lib/govuk_publishing_components/app_helpers/taxon_breadcrumbs.rb +3 -8
- data/lib/govuk_publishing_components/presenters/brand_helper.rb +17 -0
- data/lib/govuk_publishing_components/version.rb +1 -1
- metadata +5 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 291eb959433c164a7882c30018df0e83f79af74e48de424217ec6abacdebb280
|
|
4
|
+
data.tar.gz: a30ad7ff07625951cd0c41726a7c03cd7bda78d521740abd82e056243df67ec1
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 1f1bafdb22c4c0ca340d5562b777fe6aa88991a65888a21a38f91afafd3ffcb5e0b36d1ae3cfb6e9fe3eaa331df176a4041bfa78c68fbb43987cddd07c3f7aeb
|
|
7
|
+
data.tar.gz: 7cece34af16873b389b1105e24a6a71fdd2f0799d51b1639b26af462287836366d7533e4a72ec7a9cfce9b7e5963c8c3bf0b253071af77c91ef02379decdee72
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
/*
|
|
2
|
+
Toggle the display of elements
|
|
3
|
+
|
|
4
|
+
This is a straight copy of the same file from static.
|
|
5
|
+
|
|
6
|
+
Use `data-controls` and `data-expanded` to indicate the
|
|
7
|
+
starting state and the IDs of the elements that the toggle
|
|
8
|
+
controls. This is synonymous with ARIA attributes, which
|
|
9
|
+
get added when starting.
|
|
10
|
+
*/
|
|
11
|
+
|
|
12
|
+
window.GOVUK.Modules = window.GOVUK.Modules || {};
|
|
13
|
+
|
|
14
|
+
(function (Modules) {
|
|
15
|
+
'use strict'
|
|
16
|
+
|
|
17
|
+
Modules.GemToggle = function () {
|
|
18
|
+
this.start = function ($el) {
|
|
19
|
+
var toggleSelector = '[data-controls][data-expanded]'
|
|
20
|
+
|
|
21
|
+
$el.on('click', toggleSelector, toggle)
|
|
22
|
+
$el.find(toggleSelector).each(addAriaAttrs)
|
|
23
|
+
|
|
24
|
+
// Add the ARIA attributes with JavaScript
|
|
25
|
+
// If the JS fails and there's no interactive elements, having
|
|
26
|
+
// no aria attributes is an accurate representation.
|
|
27
|
+
function addAriaAttrs () {
|
|
28
|
+
var $toggle = $(this)
|
|
29
|
+
$toggle.attr('role', 'button')
|
|
30
|
+
$toggle.attr('aria-controls', $toggle.data('controls'))
|
|
31
|
+
$toggle.attr('aria-expanded', $toggle.data('expanded'))
|
|
32
|
+
|
|
33
|
+
var $targets = getTargetElements($toggle)
|
|
34
|
+
$targets.attr('aria-live', 'polite')
|
|
35
|
+
$targets.attr('role', 'region')
|
|
36
|
+
$toggle.data('$targets', $targets)
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
function toggle (event) {
|
|
40
|
+
var $toggle = $(event.target),
|
|
41
|
+
expanded = $toggle.attr('aria-expanded') === 'true',
|
|
42
|
+
$targets = $toggle.data('$targets')
|
|
43
|
+
|
|
44
|
+
if (expanded) {
|
|
45
|
+
$toggle.attr('aria-expanded', false)
|
|
46
|
+
$targets.addClass('js-hidden')
|
|
47
|
+
} else {
|
|
48
|
+
$toggle.attr('aria-expanded', true)
|
|
49
|
+
$targets.removeClass('js-hidden')
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
var toggledText = $toggle.data('toggled-text')
|
|
53
|
+
if (typeof toggledText === 'string') {
|
|
54
|
+
$toggle.data('toggled-text', $toggle.text())
|
|
55
|
+
$toggle.text(toggledText)
|
|
56
|
+
}
|
|
57
|
+
|
|
58
|
+
event.preventDefault()
|
|
59
|
+
}
|
|
60
|
+
|
|
61
|
+
function getTargetElements ($toggle) {
|
|
62
|
+
var ids = $toggle.attr('aria-controls').split(' '),
|
|
63
|
+
selector = '#' + ids.join(', #')
|
|
64
|
+
|
|
65
|
+
return $el.find(selector)
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
}
|
|
69
|
+
})(window.GOVUK.Modules)
|
|
@@ -27,6 +27,15 @@
|
|
|
27
27
|
|
|
28
28
|
.gem-c-subscription-links__link--feed {
|
|
29
29
|
background-image: image-url("govuk_publishing_components/feed-icon-black.png");
|
|
30
|
+
|
|
31
|
+
// if this is a toggle, only show if js is enabled
|
|
32
|
+
&[data-controls] {
|
|
33
|
+
display: none;
|
|
34
|
+
|
|
35
|
+
.js-enabled & {
|
|
36
|
+
display: block;
|
|
37
|
+
}
|
|
38
|
+
}
|
|
30
39
|
}
|
|
31
40
|
|
|
32
41
|
.gem-c-subscription-links__link--email-alerts {
|
|
@@ -37,4 +46,15 @@
|
|
|
37
46
|
background-size: 20px 14px;
|
|
38
47
|
}
|
|
39
48
|
}
|
|
49
|
+
|
|
50
|
+
.gem-c-subscription-links__feed-box {
|
|
51
|
+
padding: $gutter-half;
|
|
52
|
+
margin-bottom: $gutter-half;
|
|
53
|
+
background: $grey-3;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
.gem-c-subscription-links__feed-description {
|
|
57
|
+
font-weight: bold;
|
|
58
|
+
}
|
|
40
59
|
}
|
|
60
|
+
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
@import "colours/organisation";
|
|
2
|
+
|
|
3
|
+
// this uses the colours from govuk_frontend_toolkit
|
|
4
|
+
// https://github.com/alphagov/govuk_frontend_toolkit/blob/master/stylesheets/colours/_organisation.scss
|
|
5
|
+
|
|
6
|
+
@mixin organisation-brand-colour() {
|
|
7
|
+
@each $organisation in $all-organisation-brand-colours {
|
|
8
|
+
.brand--#{nth($organisation, 1)} {
|
|
9
|
+
.brand__color {
|
|
10
|
+
color: nth($organisation, 3);
|
|
11
|
+
}
|
|
12
|
+
|
|
13
|
+
.brand__border-color {
|
|
14
|
+
border-color: nth($organisation, 2);
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
@include organisation-brand-colour;
|
|
@@ -2,9 +2,12 @@
|
|
|
2
2
|
items ||= []
|
|
3
3
|
margin_top_class = " gem-c-document-list--top-margin" if local_assigns[:margin_top]
|
|
4
4
|
margin_bottom_class = " gem-c-document-list--bottom-margin" if local_assigns[:margin_bottom]
|
|
5
|
+
|
|
6
|
+
brand ||= false
|
|
7
|
+
brand_helper = GovukPublishingComponents::Presenters::BrandHelper.new(brand)
|
|
5
8
|
%>
|
|
6
9
|
<% if items.any? %>
|
|
7
|
-
<ol class="gem-c-document-list<%= margin_bottom_class %><%= margin_top_class %>">
|
|
10
|
+
<ol class="gem-c-document-list<%= margin_bottom_class %><%= margin_top_class %> <%= brand_helper.get_brand %>">
|
|
8
11
|
<% items.each do |item| %>
|
|
9
12
|
<li class="gem-c-document-list__item">
|
|
10
13
|
<h3 class="gem-c-document-list__item-title">
|
|
@@ -12,7 +15,8 @@
|
|
|
12
15
|
link_to(
|
|
13
16
|
item[:link][:text],
|
|
14
17
|
item[:link][:path],
|
|
15
|
-
data: item[:link][:data_attributes]
|
|
18
|
+
data: item[:link][:data_attributes],
|
|
19
|
+
class: brand_helper.get_brand_element("color")
|
|
16
20
|
)
|
|
17
21
|
%>
|
|
18
22
|
</h3>
|
|
@@ -1,21 +1,50 @@
|
|
|
1
1
|
<%
|
|
2
2
|
email_signup_link ||= false
|
|
3
|
+
email_signup_link_text ||= t("govuk_component.subscription_links.email_signup_link_text", default: "Get email alerts")
|
|
3
4
|
feed_link ||= false
|
|
5
|
+
feed_link_text ||= t("govuk_component.subscription_links.feed_link_text", default: "Subscribe to feed")
|
|
6
|
+
feed_link_box_value ||= false
|
|
7
|
+
feed_link_data = false
|
|
8
|
+
|
|
9
|
+
if feed_link_box_value
|
|
10
|
+
feed_link = "#"
|
|
11
|
+
feed_link_data = {
|
|
12
|
+
controls: "feed-reader",
|
|
13
|
+
expanded: "false"
|
|
14
|
+
}
|
|
15
|
+
end
|
|
4
16
|
%>
|
|
5
|
-
<% if email_signup_link || feed_link %>
|
|
6
|
-
<section class="gem-c-subscription-links">
|
|
7
|
-
<h2 class="visuallyhidden"
|
|
17
|
+
<% if email_signup_link || feed_link || feed_link_box_value %>
|
|
18
|
+
<section class="gem-c-subscription-links" data-module="gem-toggle">
|
|
19
|
+
<h2 class="visuallyhidden"><%= t("govuk_component.subscription_links.subscriptions", default: "Subscriptions") %></h2>
|
|
8
20
|
<ul class="gem-c-subscription-links__list">
|
|
9
21
|
<% if email_signup_link.present? %>
|
|
10
22
|
<li class="gem-c-subscription-links__list-item">
|
|
11
|
-
<%= link_to
|
|
23
|
+
<%= link_to email_signup_link_text, email_signup_link, class: "gem-c-subscription-links__link gem-c-subscription-links__link--email-alerts" %>
|
|
12
24
|
</li>
|
|
13
25
|
<% end %>
|
|
14
|
-
|
|
26
|
+
|
|
27
|
+
<% if feed_link_box_value || feed_link.present? %>
|
|
15
28
|
<li class="gem-c-subscription-links__list-item">
|
|
16
|
-
<%= link_to
|
|
29
|
+
<%= link_to feed_link_text, feed_link,
|
|
30
|
+
class: "gem-c-subscription-links__link gem-c-subscription-links__link--feed",
|
|
31
|
+
data: feed_link_data
|
|
32
|
+
%>
|
|
17
33
|
</li>
|
|
18
34
|
<% end %>
|
|
19
35
|
</ul>
|
|
36
|
+
|
|
37
|
+
<% if feed_link_box_value %>
|
|
38
|
+
<div class="gem-c-subscription-links__feed-box js-hidden" id="feed-reader">
|
|
39
|
+
<p class="gem-c-subscription-links__feed-description js-hidden"><%= feed_link_text %></p>
|
|
40
|
+
<%= render "govuk_publishing_components/components/input", {
|
|
41
|
+
label: {
|
|
42
|
+
text: "Copy and paste this URL into your feed reader"
|
|
43
|
+
},
|
|
44
|
+
name: "feed-reader-box",
|
|
45
|
+
value: feed_link_box_value
|
|
46
|
+
} %>
|
|
47
|
+
</div>
|
|
48
|
+
<% end %>
|
|
20
49
|
</section>
|
|
21
50
|
<% end %>
|
|
@@ -76,3 +76,20 @@ examples:
|
|
|
76
76
|
text: 'Become an apprentice'
|
|
77
77
|
path: '/become-an-apprentice'
|
|
78
78
|
description: 'Becoming an apprentice - what to expect, apprenticeship levels, pay and training, making an application, complaining about an apprenticeship.'
|
|
79
|
+
with_branding:
|
|
80
|
+
description: Where this component could be used on an organisation page (such as the [Attorney General's Office](https://www.gov.uk/government/organisations/attorney-generals-office)) branding can be applied for link colours and border colours. See the [branding documentation](https://github.com/alphagov/govuk_publishing_components/blob/master/docs/component_branding.md) for more details.
|
|
81
|
+
data:
|
|
82
|
+
brand: 'attorney-generals-office'
|
|
83
|
+
items:
|
|
84
|
+
- link:
|
|
85
|
+
text: 'School behaviour and attendance: parental responsibility measures'
|
|
86
|
+
path: '/government/publications/parental-responsibility-measures-for-behaviour-and-attendance'
|
|
87
|
+
metadata:
|
|
88
|
+
public_updated_at: 2017-01-05 14:50:33
|
|
89
|
+
document_type: 'Statutory guidance'
|
|
90
|
+
- link:
|
|
91
|
+
text: 'School exclusion'
|
|
92
|
+
path: '/government/publications/school-exclusion'
|
|
93
|
+
metadata:
|
|
94
|
+
public_updated_at: 2017-07-19 15:01:48
|
|
95
|
+
document_type: 'Statutory guidance'
|
|
@@ -37,10 +37,16 @@ examples:
|
|
|
37
37
|
label:
|
|
38
38
|
text: "This might not work"
|
|
39
39
|
name: "labelledby"
|
|
40
|
-
|
|
40
|
+
describedby: "skiplink-container"
|
|
41
41
|
with_error:
|
|
42
42
|
data:
|
|
43
43
|
label:
|
|
44
44
|
text: "What is your name?"
|
|
45
45
|
name: "name"
|
|
46
46
|
error_message: "Please could you provide your name"
|
|
47
|
+
with_value:
|
|
48
|
+
data:
|
|
49
|
+
label:
|
|
50
|
+
text: "Search for"
|
|
51
|
+
name: "name"
|
|
52
|
+
value: "moose"
|
|
@@ -2,6 +2,14 @@ name: Subscription links
|
|
|
2
2
|
description: Links to ‘Get email alerts’ and ‘Subscribe to feed’
|
|
3
3
|
accessibility_criteria: |
|
|
4
4
|
Icons in subscription links must be presentational and ignored by screen readers.
|
|
5
|
+
|
|
6
|
+
Toggle elements in the component must:
|
|
7
|
+
|
|
8
|
+
- be usable with a keyboard
|
|
9
|
+
- be usable with touch
|
|
10
|
+
- be recognised by screen readers as a button
|
|
11
|
+
- announce to screen readers whether they are expanded or collapsed
|
|
12
|
+
- show hidden elements by default when Javascript is disabled
|
|
5
13
|
shared_accessibility_criteria:
|
|
6
14
|
- link
|
|
7
15
|
examples:
|
|
@@ -15,3 +23,17 @@ examples:
|
|
|
15
23
|
with_only_feed_link:
|
|
16
24
|
data:
|
|
17
25
|
feed_link: '/foreign-travel-advice/singapore.atom'
|
|
26
|
+
with_custom_text:
|
|
27
|
+
data:
|
|
28
|
+
email_signup_link: '/foreign-travel-advice/singapore/email-signup'
|
|
29
|
+
email_signup_link_text: 'Get notifications'
|
|
30
|
+
feed_link: '/foreign-travel-advice/singapore.atom'
|
|
31
|
+
feed_link_text: 'View feed'
|
|
32
|
+
with_copyable_feed_link:
|
|
33
|
+
description: |
|
|
34
|
+
This option changes the feed link to a toggle control, which opens a hidden element containing an input prepopulated with the value passed to the component, usually a URL to an atom feed. This uses the [form input](/component-guide/input) component.
|
|
35
|
+
|
|
36
|
+
Note that this option overrides the feed_link option, so if both are passed feed_link is ignored. Note that a value for email_signup_link can also be passed as normal.
|
|
37
|
+
data:
|
|
38
|
+
email_signup_link: '/foreign-travel-advice/singapore/email-signup'
|
|
39
|
+
feed_link_box_value: 'https://www.gov.uk/government/organisations/attorney-generals-office.atom'
|
data/config/locales/en.yml
CHANGED
|
@@ -47,6 +47,10 @@ en:
|
|
|
47
47
|
hide_all: "Hide all"
|
|
48
48
|
step_by_step_nav_related:
|
|
49
49
|
part_of: "Part of"
|
|
50
|
+
subscription_links:
|
|
51
|
+
email_signup_link_text: "Get email alerts"
|
|
52
|
+
feed_link_text: "Subscribe to feed"
|
|
53
|
+
subscriptions: "Subscriptions"
|
|
50
54
|
taxonomy_navigation:
|
|
51
55
|
collections: "Collection"
|
|
52
56
|
policies: "Policy"
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
require "govuk_publishing_components/config"
|
|
2
2
|
require "govuk_publishing_components/engine"
|
|
3
|
+
require "govuk_publishing_components/presenters/brand_helper"
|
|
3
4
|
require "govuk_publishing_components/presenters/contextual_navigation"
|
|
4
5
|
require "govuk_publishing_components/presenters/related_navigation_helper"
|
|
5
6
|
require "govuk_publishing_components/presenters/step_by_step_nav_helper"
|
|
@@ -52,15 +52,10 @@ module GovukPublishingComponents
|
|
|
52
52
|
end
|
|
53
53
|
|
|
54
54
|
def parent_taxon
|
|
55
|
-
|
|
56
|
-
|
|
55
|
+
@_parent_taxon ||= begin
|
|
56
|
+
parent_content_item = content_item.dig("links", "parent_taxons", 0)
|
|
57
57
|
|
|
58
|
-
|
|
59
|
-
@_parent_taxons ||= begin
|
|
60
|
-
content_item.dig("links", "parent_taxons")
|
|
61
|
-
.to_a
|
|
62
|
-
.select { |t| phase_is_live?(t) }
|
|
63
|
-
.map { |taxon| ContentItem.new(taxon) }.sort_by(&:title)
|
|
58
|
+
ContentItem.new(parent_content_item) unless parent_content_item.nil?
|
|
64
59
|
end
|
|
65
60
|
end
|
|
66
61
|
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
module GovukPublishingComponents
|
|
2
|
+
module Presenters
|
|
3
|
+
class BrandHelper
|
|
4
|
+
def initialize(brand)
|
|
5
|
+
@brand = brand if brand
|
|
6
|
+
end
|
|
7
|
+
|
|
8
|
+
def get_brand
|
|
9
|
+
"brand--#{@brand}" if @brand
|
|
10
|
+
end
|
|
11
|
+
|
|
12
|
+
def get_brand_element(attribute)
|
|
13
|
+
"brand__#{attribute}" if @brand
|
|
14
|
+
end
|
|
15
|
+
end
|
|
16
|
+
end
|
|
17
|
+
end
|
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: govuk_publishing_components
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 7.
|
|
4
|
+
version: 7.2.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- GOV.UK Dev
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2018-05-
|
|
11
|
+
date: 2018-05-04 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: govuk_app_config
|
|
@@ -318,6 +318,7 @@ files:
|
|
|
318
318
|
- app/assets/javascripts/govuk_publishing_components/lib/current-location.js
|
|
319
319
|
- app/assets/javascripts/govuk_publishing_components/lib/history-support.js
|
|
320
320
|
- app/assets/javascripts/govuk_publishing_components/lib/toggle-input-class-on-focus.js
|
|
321
|
+
- app/assets/javascripts/govuk_publishing_components/lib/toggle.js
|
|
321
322
|
- app/assets/stylesheets/component_guide/all_components.scss
|
|
322
323
|
- app/assets/stylesheets/component_guide/all_components_print.scss
|
|
323
324
|
- app/assets/stylesheets/component_guide/application.scss
|
|
@@ -343,6 +344,7 @@ files:
|
|
|
343
344
|
- app/assets/stylesheets/govuk_publishing_components/components/_success-alert.scss
|
|
344
345
|
- app/assets/stylesheets/govuk_publishing_components/components/_taxonomy-navigation.scss
|
|
345
346
|
- app/assets/stylesheets/govuk_publishing_components/components/_translation-nav.scss
|
|
347
|
+
- app/assets/stylesheets/govuk_publishing_components/components/helpers/_organisation-colours.scss
|
|
346
348
|
- app/assets/stylesheets/govuk_publishing_components/components/helpers/_px-to-em.scss
|
|
347
349
|
- app/assets/stylesheets/govuk_publishing_components/components/helpers/_variables.scss
|
|
348
350
|
- app/assets/stylesheets/govuk_publishing_components/components/mixins/_clearfix.scss
|
|
@@ -427,6 +429,7 @@ files:
|
|
|
427
429
|
- lib/govuk_publishing_components/config.rb
|
|
428
430
|
- lib/govuk_publishing_components/engine.rb
|
|
429
431
|
- lib/govuk_publishing_components/minitest/component_guide_test.rb
|
|
432
|
+
- lib/govuk_publishing_components/presenters/brand_helper.rb
|
|
430
433
|
- lib/govuk_publishing_components/presenters/content_breadcrumbs_based_on_parent.rb
|
|
431
434
|
- lib/govuk_publishing_components/presenters/content_breadcrumbs_based_on_taxons.rb
|
|
432
435
|
- lib/govuk_publishing_components/presenters/content_item.rb
|