govuk_publishing_components 7.1.0 → 7.2.0
Sign up to get free protection for your applications and to get access to all the features.
- 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
|