govuk-components 4.0.0 → 4.1.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +22 -22
- data/app/components/govuk_component/accordion_component/section_component.html.erb +5 -5
- data/app/components/govuk_component/accordion_component/section_component.rb +1 -1
- data/app/components/govuk_component/accordion_component.rb +1 -1
- data/app/components/govuk_component/back_link_component.rb +9 -3
- data/app/components/govuk_component/base.rb +4 -0
- data/app/components/govuk_component/breadcrumbs_component.html.erb +1 -1
- data/app/components/govuk_component/breadcrumbs_component.rb +9 -6
- data/app/components/govuk_component/cookie_banner_component/message_component.rb +7 -7
- data/app/components/govuk_component/cookie_banner_component.rb +1 -1
- data/app/components/govuk_component/details_component.rb +5 -5
- data/app/components/govuk_component/exit_this_page_component.rb +56 -0
- data/app/components/govuk_component/footer_component.html.erb +11 -11
- data/app/components/govuk_component/footer_component.rb +7 -7
- data/app/components/govuk_component/header_component.html.erb +10 -10
- data/app/components/govuk_component/header_component.rb +8 -8
- data/app/components/govuk_component/inset_text_component.rb +1 -1
- data/app/components/govuk_component/notification_banner_component.html.erb +3 -3
- data/app/components/govuk_component/notification_banner_component.rb +5 -5
- data/app/components/govuk_component/pagination_component/adjacent_page.rb +6 -6
- data/app/components/govuk_component/pagination_component/item.rb +4 -4
- data/app/components/govuk_component/pagination_component/next_page.rb +1 -1
- data/app/components/govuk_component/pagination_component/previous_page.rb +1 -1
- data/app/components/govuk_component/pagination_component.rb +4 -4
- data/app/components/govuk_component/panel_component.rb +3 -3
- data/app/components/govuk_component/phase_banner_component.html.erb +2 -2
- data/app/components/govuk_component/phase_banner_component.rb +2 -2
- data/app/components/govuk_component/section_break_component.rb +3 -3
- data/app/components/govuk_component/start_button_component.rb +8 -10
- data/app/components/govuk_component/summary_list_component/action_component.rb +1 -1
- data/app/components/govuk_component/summary_list_component/card_component.html.erb +5 -5
- data/app/components/govuk_component/summary_list_component/card_component.rb +1 -1
- data/app/components/govuk_component/summary_list_component/key_component.rb +1 -1
- data/app/components/govuk_component/summary_list_component/row_component.rb +5 -5
- data/app/components/govuk_component/summary_list_component/value_component.rb +1 -1
- data/app/components/govuk_component/summary_list_component.rb +2 -2
- data/app/components/govuk_component/tab_component.html.erb +2 -2
- data/app/components/govuk_component/tab_component.rb +5 -5
- data/app/components/govuk_component/table_component/body_component.rb +1 -1
- data/app/components/govuk_component/table_component/caption_component.rb +2 -2
- data/app/components/govuk_component/table_component/cell_component.rb +12 -10
- data/app/components/govuk_component/table_component/foot_component.rb +1 -1
- data/app/components/govuk_component/table_component/head_component.rb +1 -1
- data/app/components/govuk_component/table_component/row_component.rb +1 -1
- data/app/components/govuk_component/table_component.rb +1 -1
- data/app/components/govuk_component/tag_component.rb +2 -2
- data/app/components/govuk_component/warning_text_component.rb +4 -4
- data/app/helpers/govuk_back_to_top_link_helper.rb +7 -1
- data/app/helpers/govuk_components_helper.rb +1 -0
- data/app/helpers/govuk_exit_this_page_link_helper.rb +23 -0
- data/app/helpers/govuk_link_helper.rb +38 -26
- data/app/helpers/govuk_skip_link_helper.rb +2 -2
- data/app/helpers/title_with_error_prefix_helper.rb +7 -0
- data/lib/govuk/components/engine.rb +16 -2
- data/lib/govuk/components/version.rb +1 -1
- metadata +21 -12
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 9c2c1a327331508f3762590e9f79d7c75f2acc04b94effdc6149bae3c5f3131e
|
4
|
+
data.tar.gz: 4c97e4c60c086848d13c369c5d20af75429fffa7b1ebb8c8da0e2167a0c0fa35
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 70b6e520d20d8e0c560312e959e7066d73482c95d1d43936fada0260f4c8d79cf85ffba3f6116fed1c0b8147f3a1651ceb380565d1cdc0c971a6311ed07a9ed0
|
7
|
+
data.tar.gz: cbca842a48e2ecf6e35801067a3d1583563231a281711ace6169b60182ba6b432e61303df84f900dd0748fe55ac8a11c64405b6fd077fa32dd9371786e5dbbea
|
data/README.md
CHANGED
@@ -1,14 +1,15 @@
|
|
1
|
-
# GOV.UK Components
|
1
|
+
# GOV.UK Components for Ruby on Rails
|
2
2
|
|
3
|
-
[![Tests](https://github.com/
|
4
|
-
[![Maintainability](https://api.codeclimate.com/v1/badges/cbcbc140f300b920d833/maintainability)](https://codeclimate.com/github/
|
5
|
-
[![Gem
|
3
|
+
[![Tests](https://github.com/x-govuk/govuk-components/workflows/Tests/badge.svg)](https://github.com/x-govuk/govuk-components/actions?query=workflow%3ATests)
|
4
|
+
[![Maintainability](https://api.codeclimate.com/v1/badges/cbcbc140f300b920d833/maintainability)](https://codeclimate.com/github/x-govuk/govuk-components/maintainability)
|
5
|
+
[![Gem version](https://badge.fury.io/rb/govuk-components.svg)](https://badge.fury.io/rb/govuk-components)
|
6
6
|
[![Gem](https://img.shields.io/gem/dt/govuk-components?logo=rubygems)](https://rubygems.org/gems/govuk-components)
|
7
|
-
[![Test
|
8
|
-
[![
|
9
|
-
[![GOV.UK Design System
|
10
|
-
[![
|
11
|
-
[![
|
7
|
+
[![Test coverage](https://api.codeclimate.com/v1/badges/cbcbc140f300b920d833/test_coverage)](https://codeclimate.com/github/x-govuk/govuk-components/test_coverage)
|
8
|
+
[![Licence](https://img.shields.io/github/license/x-govuk/govuk-components)](https://github.com/x-govuk/govuk-components/blob/main/LICENSE.txt)
|
9
|
+
[![GOV.UK Design System version](https://img.shields.io/badge/GOV.UK%20Design%20System-4.7.0-brightgreen)](https://design-system.service.gov.uk)
|
10
|
+
[![ViewComponent](https://img.shields.io/badge/ViewComponent-3.3.0-brightgreen)](https://viewcomponent.org/)
|
11
|
+
[![Rails](https://img.shields.io/badge/Rails-6.1.7%20%E2%95%B1%207.0.6-E16D6D)](https://weblog.rubyonrails.org/releases/)
|
12
|
+
[![Ruby](https://img.shields.io/badge/Ruby-3.0.6%20%20%E2%95%B1%203.1.4%20%20%E2%95%B1%203.2.2-E16D6D)](https://www.ruby-lang.org/en/downloads/)
|
12
13
|
|
13
14
|
This gem provides a suite of reusable components for the [GOV.UK Design System](https://design-system.service.gov.uk/). It is intended to provide a lightweight alternative to the [GOV.UK Publishing Components](https://github.com/alphagov/govuk_publishing_components) library and is built with GitHub’s [ViewComponent](https://github.com/github/view_component) framework.
|
14
15
|
|
@@ -16,10 +17,7 @@ It aims to implement the functionality from the original Nunjucks macros in a wa
|
|
16
17
|
|
17
18
|
## Documentation
|
18
19
|
|
19
|
-
The gem comes with [a full guide](https://govuk-components.netlify.app/) that
|
20
|
-
covers most aspects of day-to-day use, along with code and output examples. The
|
21
|
-
examples in the guide (and the guide itself) are built using the components,
|
22
|
-
so it will always be up to date.
|
20
|
+
The gem comes with [a full guide](https://govuk-components.netlify.app/) that covers most aspects of day-to-day use, along with code and output examples. The examples in the guide (and the guide itself) are built using the components, so it will always be up to date.
|
23
21
|
|
24
22
|
[![Netlify Status](https://api.netlify.com/api/v1/badges/d40a5a0a-b086-4c35-b046-97fbcbf9f219/deploy-status)](https://app.netlify.com/sites/govuk-components/deploys)
|
25
23
|
|
@@ -34,6 +32,7 @@ The provided components are:
|
|
34
32
|
* [Breadcrumbs](https://govuk-components.netlify.app/components/breadcrumbs)
|
35
33
|
* [Cookie banner](https://govuk-components.netlify.app/components/cookie-banner)
|
36
34
|
* [Details](https://govuk-components.netlify.app/components/details)
|
35
|
+
* [Exit this page](https://govuk-components.netlify.app/components/exit-this-page)
|
37
36
|
* [Footer](https://govuk-components.netlify.app/components/footer)
|
38
37
|
* [Header](https://govuk-components.netlify.app/components/header)
|
39
38
|
* [Inset text](https://govuk-components.netlify.app/components/inset-text)
|
@@ -81,15 +80,15 @@ This library allows components to be rendered with Rails’ `render` method or v
|
|
81
80
|
|
82
81
|
```erb
|
83
82
|
<%= govuk_tabs(title: 'Days of the week') do |component| %>
|
84
|
-
<% component.
|
83
|
+
<% component.with_tab(label: 'Monday') do %>
|
85
84
|
<p>Monday’s child is fair of face</p>
|
86
85
|
<% end %>
|
87
86
|
|
88
|
-
<% component.
|
87
|
+
<% component.with_tab(label: 'Tuesday') do %>
|
89
88
|
<p>Tuesday’s child is full of grace</p>
|
90
89
|
<% end %>
|
91
90
|
|
92
|
-
<% component.
|
91
|
+
<% component.with_tab(label: 'Wednesday') do %>
|
93
92
|
<p>Wednesday’s child is full of woe</p>
|
94
93
|
<% end %>
|
95
94
|
<% end %>
|
@@ -118,6 +117,10 @@ require "govuk/components"
|
|
118
117
|
* [Register trainee teachers](https://github.com/DFE-Digital/register-trainee-teachers)
|
119
118
|
* [Teaching Vacancies](https://github.com/DFE-Digital/teaching-vacancies)
|
120
119
|
|
120
|
+
## Forks
|
121
|
+
|
122
|
+
* [Betagouv Système de Design de l'État view components](https://betagouv.github.io/dsfr-view-components/)
|
123
|
+
|
121
124
|
## Installation
|
122
125
|
|
123
126
|
Add this line to your application’s Gemfile:
|
@@ -140,12 +143,9 @@ gem install govuk-components
|
|
140
143
|
|
141
144
|
## Contributing
|
142
145
|
|
143
|
-
Bug reports and feature requests are most welcome, please raise an issue or
|
144
|
-
submit a pull request.
|
146
|
+
Bug reports and feature requests are most welcome, please raise an issue or submit a pull request.
|
145
147
|
|
146
|
-
Currently we're using [GOVUK Lint](https://github.com/alphagov/govuk-lint) to
|
147
|
-
ensure code meets the GOV.UK guidelines. Please ensure that any PRs also adhere
|
148
|
-
to this standard.
|
148
|
+
Currently we're using [GOVUK Lint](https://github.com/alphagov/govuk-lint) to ensure code meets the GOV.UK guidelines. Please ensure that any PRs also adhere to this standard.
|
149
149
|
|
150
150
|
To help keep the logs clean and tidy, please configure git to use your full name:
|
151
151
|
|
@@ -153,6 +153,6 @@ To help keep the logs clean and tidy, please configure git to use your full name
|
|
153
153
|
git config --global user.name "Julius Hibbert"
|
154
154
|
```
|
155
155
|
|
156
|
-
##
|
156
|
+
## Licence
|
157
157
|
|
158
158
|
The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
|
@@ -1,11 +1,11 @@
|
|
1
1
|
<%= tag.div(id: id(suffix: 'section'), **html_attributes) do %>
|
2
|
-
<div class="
|
3
|
-
<%= content_tag(heading_level, class: "
|
4
|
-
<%= tag.span(heading_content, id: id, class: "
|
2
|
+
<div class="<%= brand %>-accordion__section-header">
|
3
|
+
<%= content_tag(heading_level, class: "#{brand}-accordion__section-heading") do %>
|
4
|
+
<%= tag.span(heading_content, id: id, class: "#{brand}-accordion__section-button", aria: { expanded: expanded?, controls: id(suffix: 'content') }) %>
|
5
5
|
<% end %>
|
6
6
|
<% if summary_content.present? %>
|
7
|
-
<%= tag.div(summary_content, id: id(suffix: 'summary'), class:
|
7
|
+
<%= tag.div(summary_content, id: id(suffix: 'summary'), class: "#{brand}-accordion__section-summary #{brand}-body") %>
|
8
8
|
<% end %>
|
9
9
|
</div>
|
10
|
-
<%= tag.div(content, id: id(suffix: 'content'), class:
|
10
|
+
<%= tag.div(content, id: id(suffix: 'content'), class: "#{brand}-accordion__section-content", aria: { labelledby: id }) %>
|
11
11
|
<% end %>
|
@@ -37,6 +37,6 @@ class GovukComponent::AccordionComponent::SectionComponent < GovukComponent::Bas
|
|
37
37
|
private
|
38
38
|
|
39
39
|
def default_attributes
|
40
|
-
{ class: class_names("
|
40
|
+
{ class: class_names("#{brand}-accordion__section", "#{brand}-accordion__section--expanded" => expanded?).split }
|
41
41
|
end
|
42
42
|
end
|
@@ -24,7 +24,7 @@ class GovukComponent::AccordionComponent < GovukComponent::Base
|
|
24
24
|
private
|
25
25
|
|
26
26
|
def default_attributes
|
27
|
-
{ class:
|
27
|
+
{ class: "#{brand}-accordion", data: { module: "#{brand}-accordion" } }.compact
|
28
28
|
end
|
29
29
|
|
30
30
|
def heading_tag(level)
|
@@ -1,9 +1,10 @@
|
|
1
1
|
class GovukComponent::BackLinkComponent < GovukComponent::Base
|
2
|
-
attr_reader :text, :href
|
2
|
+
attr_reader :text, :href, :inverse
|
3
3
|
|
4
|
-
def initialize(href:, text: config.default_back_link_text, classes: [], html_attributes: {})
|
4
|
+
def initialize(href:, inverse: false, text: config.default_back_link_text, classes: [], html_attributes: {})
|
5
5
|
@text = text
|
6
6
|
@href = href
|
7
|
+
@inverse = inverse
|
7
8
|
|
8
9
|
super(classes: classes, html_attributes: html_attributes)
|
9
10
|
end
|
@@ -19,6 +20,11 @@ private
|
|
19
20
|
end
|
20
21
|
|
21
22
|
def default_attributes
|
22
|
-
{
|
23
|
+
{
|
24
|
+
class: class_names(
|
25
|
+
"#{brand}-back-link",
|
26
|
+
"#{brand}-back-link--inverse" => inverse
|
27
|
+
).split
|
28
|
+
}
|
23
29
|
end
|
24
30
|
end
|
@@ -1,15 +1,17 @@
|
|
1
1
|
class GovukComponent::BreadcrumbsComponent < GovukComponent::Base
|
2
|
-
attr_reader :breadcrumbs, :hide_in_print, :collapse_on_mobile
|
2
|
+
attr_reader :breadcrumbs, :hide_in_print, :collapse_on_mobile, :inverse
|
3
3
|
|
4
4
|
def initialize(breadcrumbs:,
|
5
5
|
hide_in_print: config.default_breadcrumbs_hide_in_print,
|
6
6
|
collapse_on_mobile: config.default_breadcrumbs_collapse_on_mobile,
|
7
|
+
inverse: false,
|
7
8
|
classes: [],
|
8
9
|
html_attributes: {})
|
9
10
|
|
10
11
|
@breadcrumbs = build_list(breadcrumbs)
|
11
12
|
@hide_in_print = hide_in_print
|
12
13
|
@collapse_on_mobile = collapse_on_mobile
|
14
|
+
@inverse = inverse
|
13
15
|
|
14
16
|
super(classes: classes, html_attributes: html_attributes)
|
15
17
|
end
|
@@ -19,9 +21,10 @@ private
|
|
19
21
|
def default_attributes
|
20
22
|
{
|
21
23
|
class: class_names(
|
22
|
-
"
|
23
|
-
"
|
24
|
-
"
|
24
|
+
"#{brand}-breadcrumbs",
|
25
|
+
"#{brand}-!-display-none-print" => hide_in_print,
|
26
|
+
"#{brand}-breadcrumbs--collapse-on-mobile" => collapse_on_mobile,
|
27
|
+
"#{brand}-breadcrumbs--inverse" => inverse
|
25
28
|
).split
|
26
29
|
}
|
27
30
|
end
|
@@ -39,13 +42,13 @@ private
|
|
39
42
|
|
40
43
|
def build_list_item(text, link = nil)
|
41
44
|
if link.present?
|
42
|
-
list_item { link_to(text, link, class: "
|
45
|
+
list_item { link_to(text, link, class: "#{brand}-breadcrumbs__link") }
|
43
46
|
else
|
44
47
|
list_item(aria: { current: "page" }) { text.to_s }
|
45
48
|
end
|
46
49
|
end
|
47
50
|
|
48
51
|
def list_item(html_attributes = {}, &block)
|
49
|
-
tag.li(class: "
|
52
|
+
tag.li(class: "#{brand}-breadcrumbs__list-item", **html_attributes, &block)
|
50
53
|
end
|
51
54
|
end
|
@@ -16,8 +16,8 @@ class GovukComponent::CookieBannerComponent::MessageComponent < GovukComponent::
|
|
16
16
|
def call
|
17
17
|
tag.div(role: role, hidden: hidden, **html_attributes) do
|
18
18
|
safe_join([
|
19
|
-
tag.div(class: "
|
20
|
-
tag.div(class: "
|
19
|
+
tag.div(class: "#{brand}-grid-row") do
|
20
|
+
tag.div(class: "#{brand}-grid-column-two-thirds") { safe_join([heading_element, message_element]) }
|
21
21
|
end,
|
22
22
|
actions_element
|
23
23
|
])
|
@@ -27,13 +27,13 @@ class GovukComponent::CookieBannerComponent::MessageComponent < GovukComponent::
|
|
27
27
|
private
|
28
28
|
|
29
29
|
def default_attributes
|
30
|
-
{ class:
|
30
|
+
{ class: "#{brand}-cookie-banner__message #{brand}-width-container" }
|
31
31
|
end
|
32
32
|
|
33
33
|
def heading_element
|
34
34
|
return if heading_content.blank?
|
35
35
|
|
36
|
-
tag.h2(heading_content, class:
|
36
|
+
tag.h2(heading_content, class: "#{brand}-cookie-banner__heading #{brand}-heading-m")
|
37
37
|
end
|
38
38
|
|
39
39
|
def heading_content
|
@@ -41,7 +41,7 @@ private
|
|
41
41
|
end
|
42
42
|
|
43
43
|
def message_element
|
44
|
-
tag.div(message_content, class: "
|
44
|
+
tag.div(message_content, class: "#{brand}-cookie-banner__content")
|
45
45
|
end
|
46
46
|
|
47
47
|
def message_content
|
@@ -51,12 +51,12 @@ private
|
|
51
51
|
def wrap_in_p(message_text)
|
52
52
|
return if message_text.blank?
|
53
53
|
|
54
|
-
tag.p(message_text, class: "
|
54
|
+
tag.p(message_text, class: "#{brand}-body")
|
55
55
|
end
|
56
56
|
|
57
57
|
def actions_element
|
58
58
|
return if actions.none?
|
59
59
|
|
60
|
-
tag.div(class: "
|
60
|
+
tag.div(class: "#{brand}-button-group") { safe_join(actions) }
|
61
61
|
end
|
62
62
|
end
|
@@ -28,7 +28,7 @@ module GovukComponent
|
|
28
28
|
|
29
29
|
def default_attributes
|
30
30
|
{
|
31
|
-
class: class_names("
|
31
|
+
class: class_names("#{brand}-cookie-banner", "#{brand}-!-display-none-print" => hide_in_print).split
|
32
32
|
}
|
33
33
|
end
|
34
34
|
end
|
@@ -13,7 +13,7 @@ class GovukComponent::DetailsComponent < GovukComponent::Base
|
|
13
13
|
end
|
14
14
|
|
15
15
|
def call
|
16
|
-
tag.details(data: { module: "
|
16
|
+
tag.details(data: { module: "#{brand}-details" }, id: id, open: open, **html_attributes) do
|
17
17
|
safe_join([summary, description])
|
18
18
|
end
|
19
19
|
end
|
@@ -21,8 +21,8 @@ class GovukComponent::DetailsComponent < GovukComponent::Base
|
|
21
21
|
private
|
22
22
|
|
23
23
|
def summary
|
24
|
-
tag.summary(class: "
|
25
|
-
tag.span(summary_content, class: "
|
24
|
+
tag.summary(class: "#{brand}-details__summary") do
|
25
|
+
tag.span(summary_content, class: "#{brand}-details__summary-text")
|
26
26
|
end
|
27
27
|
end
|
28
28
|
|
@@ -31,12 +31,12 @@ private
|
|
31
31
|
end
|
32
32
|
|
33
33
|
def description
|
34
|
-
tag.div(class: "
|
34
|
+
tag.div(class: "#{brand}-details__text") do
|
35
35
|
content.presence || text
|
36
36
|
end
|
37
37
|
end
|
38
38
|
|
39
39
|
def default_attributes
|
40
|
-
{ class:
|
40
|
+
{ class: "#{brand}-details" }
|
41
41
|
end
|
42
42
|
end
|
@@ -0,0 +1,56 @@
|
|
1
|
+
class GovukComponent::ExitThisPageComponent < GovukComponent::Base
|
2
|
+
attr_reader :text, :redirect_url, :activated_text, :timed_out_text, :press_two_more_times_text, :press_one_more_time_text
|
3
|
+
|
4
|
+
def initialize(
|
5
|
+
redirect_url: nil,
|
6
|
+
href: nil,
|
7
|
+
text: config.default_exit_this_page_text,
|
8
|
+
activated_text: config.default_exit_this_page_activated_text,
|
9
|
+
timed_out_text: config.default_exit_this_page_timed_out_text,
|
10
|
+
press_two_more_times_text: config.default_exit_this_page_press_two_more_times_text,
|
11
|
+
press_one_more_time_text: config.default_exit_this_page_press_one_more_time_text,
|
12
|
+
classes: [],
|
13
|
+
html_attributes: {}
|
14
|
+
)
|
15
|
+
fail(ArgumentError, "provide either redirect_url or href, not both") if redirect_url.present? && href.present?
|
16
|
+
|
17
|
+
@text = text
|
18
|
+
@redirect_url = href || redirect_url || config.default_exit_this_page_redirect_url || fail(ArgumentError, "no redirect_url provided")
|
19
|
+
@activated_text = activated_text
|
20
|
+
@timed_out_text = timed_out_text
|
21
|
+
@press_two_more_times_text = press_two_more_times_text
|
22
|
+
@press_one_more_time_text = press_one_more_time_text
|
23
|
+
|
24
|
+
super(classes: classes, html_attributes: html_attributes)
|
25
|
+
end
|
26
|
+
|
27
|
+
def call
|
28
|
+
tag.div(exit_this_page_content, **html_attributes)
|
29
|
+
end
|
30
|
+
|
31
|
+
private
|
32
|
+
|
33
|
+
def exit_this_page_content
|
34
|
+
govuk_button_link_to((content.presence || text), redirect_url, **link_attributes)
|
35
|
+
end
|
36
|
+
|
37
|
+
def default_attributes
|
38
|
+
{
|
39
|
+
class: "#{brand}-exit-this-page",
|
40
|
+
data: {
|
41
|
+
module: "#{brand}-exit-this-page",
|
42
|
+
"i18n.activated" => activated_text,
|
43
|
+
"i18n.timed-out" => timed_out_text,
|
44
|
+
"i18n.press-two-more-times" => press_two_more_times_text,
|
45
|
+
"i18n.press-one-more-time" => press_one_more_time_text,
|
46
|
+
}.compact
|
47
|
+
}
|
48
|
+
end
|
49
|
+
|
50
|
+
def link_attributes
|
51
|
+
{
|
52
|
+
warning: true,
|
53
|
+
class: "#{brand}-exit-this-page__button #{brand}-js-exit-this-page-button"
|
54
|
+
}
|
55
|
+
end
|
56
|
+
end
|
@@ -1,24 +1,24 @@
|
|
1
1
|
<%= tag.footer(role: 'contentinfo', **html_attributes) do %>
|
2
2
|
<%= tag.div(**container_html_attributes) do %>
|
3
3
|
<% if navigation.present? %>
|
4
|
-
<div class="
|
4
|
+
<div class="<%= brand %>-footer__navigation">
|
5
5
|
<%= navigation %>
|
6
6
|
</div>
|
7
7
|
|
8
|
-
<hr class="
|
8
|
+
<hr class="<% brand %>-footer__section-break">
|
9
9
|
<% end %>
|
10
10
|
|
11
11
|
<%= tag.div(class: meta_classes, **meta_html_attributes) do %>
|
12
12
|
<% if meta.present? %>
|
13
13
|
<%= meta %>
|
14
14
|
<% else %>
|
15
|
-
<div class="
|
15
|
+
<div class="<%= brand %>-footer__meta-item <%= brand %>-footer__meta-item--grow">
|
16
16
|
<% if meta_items.any? %>
|
17
|
-
<h2 class="
|
17
|
+
<h2 class="<%= brand %>-visually-hidden"><%= meta_items_title %></h2>
|
18
18
|
|
19
|
-
<ul class="
|
19
|
+
<ul class="<%= brand %>-footer__inline-list">
|
20
20
|
<% @meta_items.each do |hyperlink| %>
|
21
|
-
<li class="
|
21
|
+
<li class="<%= brand %>-footer__inline-list-item">
|
22
22
|
<%= hyperlink %>
|
23
23
|
</li>
|
24
24
|
<% end %>
|
@@ -26,23 +26,23 @@
|
|
26
26
|
<% end %>
|
27
27
|
|
28
28
|
<% if meta_licence.nil? %>
|
29
|
-
<svg aria-hidden="true" focusable="false" class="
|
29
|
+
<svg aria-hidden="true" focusable="false" class="<%= brand %>-footer__licence-logo" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 483.2 195.7" height="17" width="41">
|
30
30
|
<path fill="currentColor" d="M421.5 142.8V.1l-50.7 32.3v161.1h112.4v-50.7zm-122.3-9.6A47.12 47.12 0 0 1 221 97.8c0-26 21.1-47.1 47.1-47.1 16.7 0 31.4 8.7 39.7 21.8l42.7-27.2A97.63 97.63 0 0 0 268.1 0c-36.5 0-68.3 20.1-85.1 49.7A98 98 0 0 0 97.8 0C43.9 0 0 43.9 0 97.8s43.9 97.8 97.8 97.8c36.5 0 68.3-20.1 85.1-49.7a97.76 97.76 0 0 0 149.6 25.4l19.4 22.2h3v-87.8h-80l24.3 27.5zM97.8 145c-26 0-47.1-21.1-47.1-47.1s21.1-47.1 47.1-47.1 47.2 21 47.2 47S123.8 145 97.8 145" />
|
31
31
|
</svg>
|
32
32
|
|
33
|
-
<%= tag.span(default_licence, class: "
|
33
|
+
<%= tag.span(default_licence, class: "#{brand}-footer__licence-description") %>
|
34
34
|
<% elsif meta_licence.present? %>
|
35
|
-
<%= tag.span(meta_licence, class: "
|
35
|
+
<%= tag.span(meta_licence, class: "#{brand}-footer__licence-description") %>
|
36
36
|
<% end %>
|
37
37
|
|
38
38
|
<% if meta_content.present? %>
|
39
|
-
<div class="
|
39
|
+
<div class="<%= brand %>-footer__meta-custom">
|
40
40
|
<%= meta_content %>
|
41
41
|
</div>
|
42
42
|
<% end %>
|
43
43
|
</div>
|
44
44
|
|
45
|
-
<%= tag.div(copyright, class: "
|
45
|
+
<%= tag.div(copyright, class: "#{brand}-footer__meta-item") %>
|
46
46
|
<% end %>
|
47
47
|
<% end %>
|
48
48
|
<% end %>
|
@@ -37,7 +37,7 @@ class GovukComponent::FooterComponent < GovukComponent::Base
|
|
37
37
|
private
|
38
38
|
|
39
39
|
def default_attributes
|
40
|
-
{ class:
|
40
|
+
{ class: "#{brand}-footer" }
|
41
41
|
end
|
42
42
|
|
43
43
|
def meta_content
|
@@ -45,7 +45,7 @@ private
|
|
45
45
|
end
|
46
46
|
|
47
47
|
def meta_classes
|
48
|
-
|
48
|
+
["#{brand}-footer__meta"].append(@custom_meta_classes)
|
49
49
|
end
|
50
50
|
|
51
51
|
def meta_html_attributes
|
@@ -57,7 +57,7 @@ private
|
|
57
57
|
#
|
58
58
|
# Once we drop classes this extra merging can be dropped along with the
|
59
59
|
# container_classes and meta_classes args
|
60
|
-
{ class:
|
60
|
+
{ class: "#{brand}-width-container" }.deep_merge_html_attributes(
|
61
61
|
@custom_container_html_attributes.merge(class: custom_container_classes)
|
62
62
|
)
|
63
63
|
end
|
@@ -67,21 +67,21 @@ private
|
|
67
67
|
|
68
68
|
case links
|
69
69
|
when Array
|
70
|
-
links.map { |link| raw(link_to(link[:text], link[:href], class:
|
70
|
+
links.map { |link| raw(link_to(link[:text], link[:href], class: "#{brand}-footer__link", **link.fetch(:attr, {}))) }
|
71
71
|
when Hash
|
72
|
-
links.map { |text, href| raw(link_to(text, href, class:
|
72
|
+
links.map { |text, href| raw(link_to(text, href, class: "#{brand}-footer__link")) }
|
73
73
|
else
|
74
74
|
fail(ArgumentError, 'meta links must be a hash or array of hashes') unless links.is_a?(Hash)
|
75
75
|
end
|
76
76
|
end
|
77
77
|
|
78
78
|
def default_licence
|
79
|
-
link = link_to("Open Government Licence v3.0", "https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/", class:
|
79
|
+
link = link_to("Open Government Licence v3.0", "https://www.nationalarchives.gov.uk/doc/open-government-licence/version/3/", class: "#{brand}-footer__link")
|
80
80
|
|
81
81
|
raw(%(All content is available under the #{link}, except where otherwise stated))
|
82
82
|
end
|
83
83
|
|
84
84
|
def build_copyright(text, url)
|
85
|
-
link_to(text, url, class:
|
85
|
+
link_to(text, url, class: "#{brand}-footer__link #{brand}-footer__copyright-logo")
|
86
86
|
end
|
87
87
|
end
|
@@ -1,14 +1,14 @@
|
|
1
|
-
<%= tag.header(role: 'banner', data: { module:
|
1
|
+
<%= tag.header(role: 'banner', data: { module: "#{brand}-header" }, **html_attributes) do %>
|
2
2
|
<%= tag.div(**container_html_attributes) do %>
|
3
|
-
<div class="
|
4
|
-
<%= link_to(homepage_url, class:
|
5
|
-
<span class="
|
3
|
+
<div class="<%= brand %>-header__logo">
|
4
|
+
<%= link_to(homepage_url, class: ["#{brand}-header__link", "#{brand}-header__link--homepage"]) do %>
|
5
|
+
<span class="<%= brand %>-header__logotype">
|
6
6
|
<% if custom_logo.present? %>
|
7
7
|
<%= custom_logo %>
|
8
8
|
<% else %>
|
9
9
|
<% if crown %>
|
10
10
|
<!--[if gt IE 8]><!-->
|
11
|
-
|
11
|
+
<svg aria-hidden="true" focusable="false" class="<%= brand %>-header__logotype-crown" xmlns="http://www.w3.org/2000/svg" viewbox="0 0 132 97" height="30" width="36">
|
12
12
|
<path 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>
|
13
13
|
</svg>
|
14
14
|
<!--<![endif]-->
|
@@ -20,7 +20,7 @@
|
|
20
20
|
<![endif]-->
|
21
21
|
<% end %>
|
22
22
|
|
23
|
-
<%= tag.span(logotype, class: "
|
23
|
+
<%= tag.span(logotype, class: "#{brand}-header__logotype-text") %>
|
24
24
|
<% end %>
|
25
25
|
</span>
|
26
26
|
<% if product_name.present? %>
|
@@ -30,15 +30,15 @@
|
|
30
30
|
</div>
|
31
31
|
|
32
32
|
<% if service_name.present? || navigation_items.present? %>
|
33
|
-
<div class="
|
33
|
+
<div class="<%= brand %>-header__content">
|
34
34
|
<% if service_name.present? %>
|
35
|
-
<%= link_to(service_name, service_url, class:
|
35
|
+
<%= link_to(service_name, service_url, class: ["#{brand}-header__link", "#{brand}-header__service-name"]) %>
|
36
36
|
<% end %>
|
37
37
|
|
38
38
|
<% if navigation_items.any? %>
|
39
39
|
<%= tag.nav(**navigation_html_attributes) do %>
|
40
|
-
<%= tag.button("Menu", type: "button", class:
|
41
|
-
<ul id="navigation" class="
|
40
|
+
<%= tag.button("Menu", type: "button", class: ["#{brand}-header__menu-button", "#{brand}-js-header-toggle"], hidden: true, aria: { controls: "navigation", label: menu_button_label }) %>
|
41
|
+
<ul id="navigation" class="<%= brand %>-header__navigation-list">
|
42
42
|
<% navigation_items.each do |item| %>
|
43
43
|
<%= item %>
|
44
44
|
<% end %>
|
@@ -44,22 +44,22 @@ class GovukComponent::HeaderComponent < GovukComponent::Base
|
|
44
44
|
private
|
45
45
|
|
46
46
|
def default_attributes
|
47
|
-
{ class:
|
47
|
+
{ class: ["#{brand}-header"] }
|
48
48
|
end
|
49
49
|
|
50
50
|
def navigation_html_attributes
|
51
|
-
nc =
|
51
|
+
nc = ["#{brand}-header__navigation"].append(custom_navigation_classes).compact
|
52
52
|
|
53
53
|
{ class: nc, aria: { label: navigation_label } }
|
54
54
|
end
|
55
55
|
|
56
56
|
def container_html_attributes
|
57
|
-
{ class:
|
57
|
+
{ class: ["#{brand}-header__container", "#{brand}-width-container"].append(custom_container_classes).compact }
|
58
58
|
end
|
59
59
|
|
60
60
|
def crown_fallback_image_attributes
|
61
61
|
{
|
62
|
-
class: "
|
62
|
+
class: "#{brand}-header__logotype-crown-fallback-image",
|
63
63
|
width: "36",
|
64
64
|
height: "32",
|
65
65
|
}
|
@@ -84,7 +84,7 @@ private
|
|
84
84
|
end
|
85
85
|
|
86
86
|
def active_class
|
87
|
-
|
87
|
+
["#{brand}-header__navigation-item--active"] if active?
|
88
88
|
end
|
89
89
|
|
90
90
|
def link?
|
@@ -94,7 +94,7 @@ private
|
|
94
94
|
def call
|
95
95
|
tag.li(**html_attributes) do
|
96
96
|
if link?
|
97
|
-
link_to(text, href, class: "
|
97
|
+
link_to(text, href, class: "#{brand}-header__link", **options)
|
98
98
|
else
|
99
99
|
text
|
100
100
|
end
|
@@ -111,7 +111,7 @@ private
|
|
111
111
|
end
|
112
112
|
|
113
113
|
def default_attributes
|
114
|
-
{ class:
|
114
|
+
{ class: ["#{brand}-header__navigation-item"] }
|
115
115
|
end
|
116
116
|
end
|
117
117
|
|
@@ -139,7 +139,7 @@ private
|
|
139
139
|
private
|
140
140
|
|
141
141
|
def default_attributes
|
142
|
-
{ class:
|
142
|
+
{ class: ["#{brand}-header__product-name"] }
|
143
143
|
end
|
144
144
|
end
|
145
145
|
end
|