govuk_publishing_components 18.1.2 → 18.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/components/checkboxes.js +1 -1
- data/app/assets/stylesheets/govuk_publishing_components/_all_components.scss +1 -0
- data/app/assets/stylesheets/govuk_publishing_components/components/_image-card.scss +14 -10
- data/app/assets/stylesheets/govuk_publishing_components/components/_layout-header.scss +11 -2
- data/app/assets/stylesheets/govuk_publishing_components/components/_summary-list.scss +27 -0
- data/app/views/govuk_publishing_components/components/_layout_header.html.erb +5 -5
- data/app/views/govuk_publishing_components/components/_summary_list.html.erb +67 -0
- data/app/views/govuk_publishing_components/components/_title.html.erb +3 -1
- data/app/views/govuk_publishing_components/components/docs/summary_list.yml +66 -0
- data/app/views/govuk_publishing_components/components/docs/title.yml +10 -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: 9ac6e954b1c78501866e17af77d1a1ccbe4bdc265a8775a6e9546ab9791f00ab
|
4
|
+
data.tar.gz: 6069d12624e6ad77aa88b817ea746ee21058b315057f65a184ec94621def5215
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: f57d71f018e862dc34d6a3c2a25fb36901443d6463238de63632bd8bca9c02916372a18e4f45338338177de1fe181f10ce73f6fff073b1939ccbea72191863e3
|
7
|
+
data.tar.gz: fed6631e756f445a51f5af976375b250c435067646bb479d6c4224874930fa03d9485422977ec54e7357311f37c16ab2f47cb00a17228c482ee92992058281c3
|
@@ -6,7 +6,7 @@ window.GOVUK.Modules = window.GOVUK.Modules || {};
|
|
6
6
|
(function (Modules) {
|
7
7
|
'use strict'
|
8
8
|
|
9
|
-
Modules.
|
9
|
+
Modules.GovukCheckboxes = function () {
|
10
10
|
this.start = function (scope) {
|
11
11
|
var _this = this
|
12
12
|
this.applyAriaControlsAttributes(scope)
|
@@ -75,6 +75,7 @@
|
|
75
75
|
@import "components/step-by-step-nav";
|
76
76
|
@import "components/subscription-links";
|
77
77
|
@import "components/success-alert";
|
78
|
+
@import "components/summary-list";
|
78
79
|
@import "components/tabs";
|
79
80
|
@import "components/table";
|
80
81
|
@import "components/taxonomy-list";
|
@@ -1,15 +1,10 @@
|
|
1
1
|
.gem-c-image-card {
|
2
2
|
@include govuk-clearfix;
|
3
3
|
@include govuk-text-colour;
|
4
|
-
|
5
|
-
margin: 0 (- govuk-spacing(3)) govuk-spacing(6) (- govuk-spacing(3));
|
6
4
|
position: relative;
|
7
5
|
}
|
8
6
|
|
9
7
|
.gem-c-image-card__image-wrapper {
|
10
|
-
@include govuk-grid-column($width: one-third, $at: mobile);
|
11
|
-
@include govuk-grid-column($width: full, $at: tablet);
|
12
|
-
|
13
8
|
margin: 0;
|
14
9
|
|
15
10
|
@include govuk-media-query($from: tablet) {
|
@@ -23,16 +18,25 @@
|
|
23
18
|
}
|
24
19
|
}
|
25
20
|
|
21
|
+
@include govuk-media-query($from: mobile, $until: tablet) {
|
22
|
+
.gem-c-image-card {
|
23
|
+
margin: 0 (- govuk-spacing(3)) govuk-spacing(6) (- govuk-spacing(3));
|
24
|
+
}
|
25
|
+
|
26
|
+
.gem-c-image-card__image-wrapper {
|
27
|
+
@include govuk-grid-column($width: one-third, $at: mobile);
|
28
|
+
}
|
29
|
+
|
30
|
+
.gem-c-image-card__text-wrapper {
|
31
|
+
@include govuk-grid-column($width: two-thirds, $at: mobile);
|
32
|
+
}
|
33
|
+
}
|
34
|
+
|
26
35
|
.gem-c-image-card__image {
|
27
36
|
display: block;
|
28
37
|
max-width: 100%;
|
29
38
|
}
|
30
39
|
|
31
|
-
.gem-c-image-card__text-wrapper {
|
32
|
-
@include govuk-grid-column($width: two-thirds, $at: mobile);
|
33
|
-
@include govuk-grid-column($width: full, $at: tablet);
|
34
|
-
}
|
35
|
-
|
36
40
|
.gem-c-image-card__title {
|
37
41
|
@include govuk-font(19, $weight: bold);
|
38
42
|
margin: 0;
|
@@ -18,11 +18,20 @@
|
|
18
18
|
border-bottom-color: govuk-colour("dark-grey", $legacy: "grey-1");
|
19
19
|
}
|
20
20
|
|
21
|
-
.
|
21
|
+
.gem-c-header__logo {
|
22
22
|
white-space: nowrap;
|
23
|
+
width: auto;
|
23
24
|
}
|
24
25
|
|
25
|
-
.
|
26
|
+
.gem-c-header__content {
|
27
|
+
width: auto;
|
28
|
+
|
29
|
+
@include govuk-media-query($from: desktop) {
|
30
|
+
float: right;
|
31
|
+
}
|
32
|
+
}
|
33
|
+
|
34
|
+
.gem-c-header__product-name {
|
26
35
|
display: none;
|
27
36
|
|
28
37
|
@include govuk-media-query($from: tablet) {
|
@@ -0,0 +1,27 @@
|
|
1
|
+
@import "govuk/components/summary-list/summary-list";
|
2
|
+
|
3
|
+
.gem-c-summary-list {
|
4
|
+
position: relative;
|
5
|
+
border-bottom: 1px solid $govuk-border-colour;
|
6
|
+
|
7
|
+
@include govuk-font(19);
|
8
|
+
@include govuk-responsive-margin(6, "top");
|
9
|
+
|
10
|
+
&:nth-of-type(1) {
|
11
|
+
margin-top: govuk-spacing(0);
|
12
|
+
}
|
13
|
+
|
14
|
+
&:nth-last-of-type(1) {
|
15
|
+
border-bottom: 0;
|
16
|
+
}
|
17
|
+
}
|
18
|
+
|
19
|
+
.gem-c-summary-list__edit-section-link {
|
20
|
+
position: absolute;
|
21
|
+
top: 0;
|
22
|
+
right: 0;
|
23
|
+
}
|
24
|
+
|
25
|
+
.gem-c-summary__block {
|
26
|
+
@include govuk-responsive-margin(6, "bottom");
|
27
|
+
}
|
@@ -10,7 +10,7 @@
|
|
10
10
|
%>
|
11
11
|
<header class="gem-c-layout-header govuk-header gem-c-layout-header--<%= environment %>" role="banner" data-module="govuk-header">
|
12
12
|
<div class="govuk-header__container <%= width_class %>">
|
13
|
-
<div class="govuk-header__logo">
|
13
|
+
<div class="govuk-header__logo gem-c-header__logo">
|
14
14
|
<a href="/" class="govuk-header__link govuk-header__link--homepage">
|
15
15
|
<span class="govuk-header__logotype">
|
16
16
|
<svg role="presentation" focusable="false" class="govuk-header__logotype-crown" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 132 97" height="32" width="36">
|
@@ -24,7 +24,7 @@
|
|
24
24
|
</span>
|
25
25
|
</span>
|
26
26
|
|
27
|
-
<span class="govuk-header__product-name">
|
27
|
+
<span class="govuk-header__product-name gem-c-header__product-name">
|
28
28
|
<%= product_name %>
|
29
29
|
</span>
|
30
30
|
|
@@ -33,11 +33,11 @@
|
|
33
33
|
</span>
|
34
34
|
</a>
|
35
35
|
|
36
|
-
</div><div class="govuk-header__content">
|
36
|
+
</div><div class="govuk-header__content gem-c-header__content">
|
37
37
|
|
38
38
|
<% if navigation_items.any? %>
|
39
|
-
<button role="button" class="govuk-header__menu-button govuk-js-header-toggle" aria-controls="navigation" aria-label="Show or hide Top Level Navigation">Menu</button>
|
40
|
-
<nav>
|
39
|
+
<button role="button" class="govuk-header__menu-button gem-c-header__menu-button govuk-js-header-toggle" aria-controls="navigation" aria-label="Show or hide Top Level Navigation">Menu</button>
|
40
|
+
<nav class="gem-c-header__nav">
|
41
41
|
<ul id="navigation" class="govuk-header__navigation govuk-header__navigation--end" aria-label="Top Level Navigation">
|
42
42
|
<% navigation_items.each_with_index do |item, index| %>
|
43
43
|
<li class="govuk-header__navigation-item <%= "govuk-header__navigation-item--active" if item[:active] %>
|
@@ -0,0 +1,67 @@
|
|
1
|
+
<%
|
2
|
+
id ||= nil
|
3
|
+
title ||= nil
|
4
|
+
edit ||= {}
|
5
|
+
items ||= []
|
6
|
+
block ||= yield
|
7
|
+
%>
|
8
|
+
<% if title || items.any? %>
|
9
|
+
<%= tag.div class: "gem-c-summary-list", id: id do %>
|
10
|
+
<% if title %>
|
11
|
+
<%= tag.h3 title, class: "govuk-heading-m" %>
|
12
|
+
<% if edit.any? %>
|
13
|
+
<%= tag.ul class: "govuk-summary-list__actions-list" do %>
|
14
|
+
<%= tag.li class: "govuk-summary-list__actions-list-item" do %>
|
15
|
+
<%= link_to edit.fetch(:href),
|
16
|
+
class: "govuk-link gem-c-summary-list__edit-section-link",
|
17
|
+
title: "Edit #{title}",
|
18
|
+
data: edit.fetch(:data_attributes, {}) do %>
|
19
|
+
Edit <%= tag.span title, class: "govuk-visually-hidden" %>
|
20
|
+
<% end %>
|
21
|
+
<% end %>
|
22
|
+
<% end %>
|
23
|
+
<% end %>
|
24
|
+
<% end %>
|
25
|
+
|
26
|
+
<% if items.any? %>
|
27
|
+
<%= tag.dl class: "govuk-summary-list" do %>
|
28
|
+
<% items.each do |item| %>
|
29
|
+
<%= tag.div class: "govuk-summary-list__row" do %>
|
30
|
+
|
31
|
+
<%= tag.dt item[:field], class: "govuk-summary-list__key" %>
|
32
|
+
<%= tag.dd item[:value], class: "govuk-summary-list__value" %>
|
33
|
+
|
34
|
+
<% if item.fetch(:edit, {}).any? || item.fetch(:delete, {}).any? %>
|
35
|
+
<%= tag.dd class: "govuk-summary-list__actions" do %>
|
36
|
+
<%= tag.ul class: "govuk-summary-list__actions-list" do %>
|
37
|
+
<% if item.fetch(:edit, {}).any? %>
|
38
|
+
<%= tag.li class: "govuk-summary-list__actions-list-item" do %>
|
39
|
+
<%= link_to item[:edit].fetch(:href),
|
40
|
+
class: "govuk-link",
|
41
|
+
title: "Edit #{item[:field]}",
|
42
|
+
data: item[:edit].fetch(:data_attributes, {}) do %>
|
43
|
+
Edit <%= tag.span item[:field], class: "govuk-visually-hidden" %>
|
44
|
+
<% end %>
|
45
|
+
<% end %>
|
46
|
+
<% end %>
|
47
|
+
<% if item.fetch(:delete, {}).any? %>
|
48
|
+
<%= tag.li class: "govuk-summary-list__actions-list-item" do %>
|
49
|
+
<%= link_to item[:delete].fetch(:href),
|
50
|
+
class: "govuk-link",
|
51
|
+
title: "Delete #{item[:field]}",
|
52
|
+
data: item[:edit].fetch(:data_attributes, {}) do %>
|
53
|
+
Delete <%= tag.span item[:field], class: "govuk-visually-hidden" %>
|
54
|
+
<% end %>
|
55
|
+
<% end %>
|
56
|
+
<% end %>
|
57
|
+
<% end %>
|
58
|
+
<% end %>
|
59
|
+
<% end %>
|
60
|
+
<% end %>
|
61
|
+
<% end %>
|
62
|
+
<% end %>
|
63
|
+
<% end %>
|
64
|
+
|
65
|
+
<%= tag.div block, class: "gem-c-summary__block" if block %>
|
66
|
+
<% end %>
|
67
|
+
<% end %>
|
@@ -1,6 +1,7 @@
|
|
1
1
|
<%
|
2
2
|
average_title_length ||= false
|
3
3
|
context ||= false
|
4
|
+
context_locale ||= false
|
4
5
|
context_text = context.is_a?(Hash) ? context[:text] : context
|
5
6
|
context_href = context.is_a?(Hash) ? context[:href] : false
|
6
7
|
context_data = context.is_a?(Hash) ? context[:data] : false
|
@@ -13,10 +14,11 @@
|
|
13
14
|
classes = %w(gem-c-title govuk-!-margin-top-8)
|
14
15
|
classes << "gem-c-title--inverse" if inverse
|
15
16
|
classes << (shared_helper.get_margin_bottom)
|
17
|
+
|
16
18
|
%>
|
17
19
|
<%= content_tag(:div, class: classes) do %>
|
18
20
|
<% if context %>
|
19
|
-
<p class="gem-c-title__context"
|
21
|
+
<p class="gem-c-title__context" <%= "lang=#{context_locale}" if context_locale.present? %>>
|
20
22
|
<%= context_href ? link_to(context_text, context_href, class: 'gem-c-title__context-link govuk-link', data: context_data) : context_text %>
|
21
23
|
</p>
|
22
24
|
<% end %>
|
@@ -0,0 +1,66 @@
|
|
1
|
+
name: Summary list
|
2
|
+
description: Use the summary list to summarise information, for example, a user’s responses at the end of a form.
|
3
|
+
accessibility_criteria: |
|
4
|
+
Action links in the component must:
|
5
|
+
|
6
|
+
* indicate what the action refers to (e.g. Change _name_)
|
7
|
+
shared_accessibility_criteria:
|
8
|
+
- link
|
9
|
+
govuk_frontend_components:
|
10
|
+
- summary-list
|
11
|
+
examples:
|
12
|
+
default:
|
13
|
+
data:
|
14
|
+
title: "Title, summary and body"
|
15
|
+
items:
|
16
|
+
- field: "Title"
|
17
|
+
value: "Ethical standards for public service providers"
|
18
|
+
- field: "Summary"
|
19
|
+
value: "Find out more about our reviews on the subject of ethical standards for public service providers, including our 2014 report, 2015 guidance and 2018 follow-up publication."
|
20
|
+
- field: "Body"
|
21
|
+
value: "After the government decided in 2013 to expand the remit of the Committee to include public service providers, the Committee on Standards in Public Life produced our first report on the issue: Ethical Standards for Providers of Public Services in 2014."
|
22
|
+
|
23
|
+
with_edit_on_section:
|
24
|
+
data:
|
25
|
+
title: "Title, summary and body"
|
26
|
+
edit:
|
27
|
+
href: "edit-title-summary-body"
|
28
|
+
data_attributes:
|
29
|
+
gtm: "edit-title-summary-body"
|
30
|
+
items:
|
31
|
+
- field: "Title"
|
32
|
+
value: "Ethical standards for public service providers"
|
33
|
+
- field: "Summary"
|
34
|
+
value: "Find out more about our reviews on the subject of ethical standards for public service providers, including our 2014 report, 2015 guidance and 2018 follow-up publication."
|
35
|
+
- field: "Body"
|
36
|
+
value: "After the government decided in 2013 to expand the remit of the Committee to include public service providers, the Committee on Standards in Public Life produced our first report on the issue: Ethical Standards for Providers of Public Services in 2014."
|
37
|
+
|
38
|
+
with_edit_on_individual_items:
|
39
|
+
data:
|
40
|
+
title: "Title, summary and body"
|
41
|
+
items:
|
42
|
+
- field: "Title"
|
43
|
+
value: "Ethical standards for public service providers"
|
44
|
+
edit:
|
45
|
+
href: "edit-title"
|
46
|
+
data_attributes:
|
47
|
+
gtm: "edit-title"
|
48
|
+
- field: "Summary"
|
49
|
+
value: "Find out more about our reviews on the subject of ethical standards for public service providers, including our 2014 report, 2015 guidance and 2018 follow-up publication."
|
50
|
+
edit:
|
51
|
+
href: "edit-summary"
|
52
|
+
delete:
|
53
|
+
href: "delete-summary"
|
54
|
+
- field: "Body"
|
55
|
+
value: "After the government decided in 2013 to expand the remit of the Committee to include public service providers, the Committee on Standards in Public Life produced our first report on the issue: Ethical Standards for Providers of Public Services in 2014."
|
56
|
+
edit:
|
57
|
+
href: "edit-body"
|
58
|
+
delete:
|
59
|
+
href: "delete-body"
|
60
|
+
|
61
|
+
with_block:
|
62
|
+
description: Use the summary list with a block when you need to show an empty state message or load another component.
|
63
|
+
data:
|
64
|
+
title: "Topics"
|
65
|
+
block: |
|
66
|
+
<p class="govuk-body">No topics specified for this document.</p>
|
@@ -24,6 +24,15 @@ examples:
|
|
24
24
|
data:
|
25
25
|
context: Publication
|
26
26
|
title: My page title
|
27
|
+
with_context_language_labelled:
|
28
|
+
description: |
|
29
|
+
Sometimes this component appears on a page that has been translated. The title will naturally be supplied in the required language but the context string may fall back to the default. In these instances we need to label the language so the page remains semantic and screenreaders can handle the switch.
|
30
|
+
|
31
|
+
The `lang` attribute **must** be set to a [valid BCP47 string](https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/lang#Language_tag_syntax). A valid code can be the two or three letter language code - for example, English is `en` or `eng`, Korean is `ko` or `kor` - but if in doubt please check.
|
32
|
+
data:
|
33
|
+
context: Publication
|
34
|
+
context_locale: en
|
35
|
+
title: My page title
|
27
36
|
with_context_link:
|
28
37
|
description: |
|
29
38
|
It’s unclear if links in the context of a title are useful and are being clicked by users. Data attributes are included to track this behaviour.
|
@@ -69,3 +78,4 @@ examples:
|
|
69
78
|
margin_bottom: 0
|
70
79
|
context:
|
71
80
|
dark_background: true
|
81
|
+
|
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: 18.
|
4
|
+
version: 18.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: 2019-08-
|
11
|
+
date: 2019-08-22 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: gds-api-adapters
|
@@ -410,6 +410,7 @@ files:
|
|
410
410
|
- app/assets/stylesheets/govuk_publishing_components/components/_step-by-step-nav.scss
|
411
411
|
- app/assets/stylesheets/govuk_publishing_components/components/_subscription-links.scss
|
412
412
|
- app/assets/stylesheets/govuk_publishing_components/components/_success-alert.scss
|
413
|
+
- app/assets/stylesheets/govuk_publishing_components/components/_summary-list.scss
|
413
414
|
- app/assets/stylesheets/govuk_publishing_components/components/_table.scss
|
414
415
|
- app/assets/stylesheets/govuk_publishing_components/components/_tabs.scss
|
415
416
|
- app/assets/stylesheets/govuk_publishing_components/components/_taxonomy-list.scss
|
@@ -534,6 +535,7 @@ files:
|
|
534
535
|
- app/views/govuk_publishing_components/components/_step_by_step_nav_related.html.erb
|
535
536
|
- app/views/govuk_publishing_components/components/_subscription-links.html.erb
|
536
537
|
- app/views/govuk_publishing_components/components/_success_alert.html.erb
|
538
|
+
- app/views/govuk_publishing_components/components/_summary_list.html.erb
|
537
539
|
- app/views/govuk_publishing_components/components/_table.html.erb
|
538
540
|
- app/views/govuk_publishing_components/components/_tabs.html.erb
|
539
541
|
- app/views/govuk_publishing_components/components/_taxonomy_list.html.erb
|
@@ -604,6 +606,7 @@ files:
|
|
604
606
|
- app/views/govuk_publishing_components/components/docs/step_by_step_nav_related.yml
|
605
607
|
- app/views/govuk_publishing_components/components/docs/subscription-links.yml
|
606
608
|
- app/views/govuk_publishing_components/components/docs/success_alert.yml
|
609
|
+
- app/views/govuk_publishing_components/components/docs/summary_list.yml
|
607
610
|
- app/views/govuk_publishing_components/components/docs/table.yml
|
608
611
|
- app/views/govuk_publishing_components/components/docs/tabs.yml
|
609
612
|
- app/views/govuk_publishing_components/components/docs/taxonomy_list.yml
|