Skip to content

Commit ecc36f5

Browse files
tim-s-ccstim-s-ccs
committed
Updated CCS Frontend to v2.5.0
1 parent 95431f3 commit ecc36f5

File tree

12 files changed

+491
-17
lines changed

12 files changed

+491
-17
lines changed

‎CHANGELOG.md‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
77

88
## [Unreleased]
99

10+
### Added
11+
12+
- Updated CCS Frontend to v2.5.0
13+
1014
## [3.4.0] - 2026-01-19
1115

1216
### Added

‎lib/ccs/components/ccs/header.rb‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -19,20 +19,21 @@ class Header < Base
1919

2020
public
2121

22+
# @param use_gca_branding [Boolean] flag to use GCA branding in logo
2223
# @param options [Hash] options that will be used in customising the HTML
2324
#
2425
# @option options [String] :classes additional CSS classes for the header HTML
2526
# @option options [String] :container_classes classes for the container
2627
# @option options [String] :homepage_url URL of the homepage. Defaults to +/https://www.crowncommercial.gov.uk+
2728
# @option options [Hash] :attributes additional attributes that will added as part of the header HTML
2829

29-
def initialize(**)
30+
def initialize(use_gca_branding: nil, **)
3031
super
3132

3233
@options[:container_classes] ||= 'govuk-width-container'
33-
@options[:homepage_url] ||= 'https://www.crowncommercial.gov.uk'
34+
@options[:homepage_url] ||= (use_gca_branding ? 'https://www.gca.gov.uk' : 'https://www.crowncommercial.gov.uk')
3435

35-
@logo = Logo.new(context: @context)
36+
@logo = Logo.new(context: @context, use_gca_branding: use_gca_branding)
3637
end
3738

3839
# Generates the HTML for the CCS Header component

‎lib/ccs/components/ccs/logo.rb‎

Lines changed: 73 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,30 @@ module CCS
77
#
88
# This is used for generating the logo component from the
99
# {https://github.com/Crown-Commercial-Service/ccs-frontend-project/tree/main/packages/ccs-frontend/src/ccs/components/logo CCS - Components - Logo}
10+
#
11+
# @!attribute [r] show_only_crown
12+
# @return [Boolean] Flag to show only the crown part of the logo
13+
# @!attribute [r] use_gca_branding
14+
# @return [Boolean] Flag to use GCA branding in logo
1015

1116
class Logo < Base
12-
# rubocop:disable Metrics/AbcSize
17+
private
18+
19+
attr_reader :show_only_crown, :use_gca_branding
20+
21+
public
22+
23+
# @param show_only_crown [Boolean] flag to show only the crown part of the logo
24+
# @param use_gca_branding [Boolean] flag to use GCA branding in logo
25+
26+
def initialize(show_only_crown: nil, use_gca_branding: nil, **)
27+
super
28+
29+
@show_only_crown = show_only_crown
30+
@use_gca_branding = use_gca_branding
31+
end
32+
33+
# rubocop:disable Metrics/AbcSize, Metrics/CyclomaticComplexity, Metrics/PerceivedComplexity
1334

1435
# Generates the HTML for the CCS Logo.
1536
# Used in {CCS::Components::CCS::Header Header} and {CCS::Components::CCS::Footer Footer}
@@ -18,7 +39,7 @@ class Logo < Base
1839

1940
def render
2041
tag.span(class: 'ccs-logo') do
21-
if @options[:show_only_crown]
42+
if show_only_crown
2243
concat(tag.svg(class: 'ccs-logo__svg', xmlns: 'http://www.w3.org/2000/svg', width: '132.22', height: '121', aria: { hidden: 'true' }, focusable: 'false', viewBox: '0 0 371.06668 339.57333') do
2344
concat(tag.g(transform: 'matrix(1.3333333,0,0,-1.3333333,0,339.57333)') do
2445
tag.g(transform: 'scale(0.34)') do
@@ -31,24 +52,36 @@ def render
3152
concat(tag.g(transform: 'matrix(1.3333333,0,0,-1.3333333,0,339.57333)') do
3253
tag.g(transform: 'scale(0.1)') do
3354
CCS_STACKED_LOGO_PATHS.each { |ccs_logo_path_attributes| concat(tag.path(**ccs_logo_path_attributes)) }
34-
concat(logo_stacked_text_graphic)
55+
concat(use_gca_branding ? logo_stacked_text_graphic_gca : logo_stacked_text_graphic_ccs)
3556
end
3657
end)
3758
end)
38-
concat(tag.svg(class: 'ccs-logo__svg ccs-logo__svg--linear', xmlns: 'http://www.w3.org/2000/svg', width: '320', height: '48.5', aria: { hidden: 'true' }, focusable: 'false', viewBox: '0 0 899 137') do
39-
concat(tag.g(transform: 'matrix(1.3333333,0,0,-1.3333333,0,137)') do
40-
tag.g(transform: 'scale(0.1)') do
41-
CCS_LINEAR_LOGO_PATHS.each { |ccs_logo_path_attributes| concat(tag.path(**ccs_logo_path_attributes)) }
42-
concat(logo_linear_text_graphic)
43-
end
59+
if use_gca_branding
60+
concat(tag.svg(class: 'ccs-logo__svg ccs-logo__svg--linear', xmlns: 'http://www.w3.org/2000/svg', width: '378', height: '48.5', aria: { hidden: 'true' }, focusable: 'false', viewBox: '0 0 1061 137') do
61+
concat(tag.g(transform: 'matrix(1.3333333,0,0,-1.3333333,0,137)') do
62+
tag.g(transform: 'scale(0.1)') do
63+
CCS_LINEAR_LOGO_PATHS.each { |ccs_logo_path_attributes| concat(tag.path(**ccs_logo_path_attributes)) }
64+
concat(logo_linear_text_graphic_gca)
65+
end
66+
end)
4467
end)
45-
end)
46-
concat(tag.span('Crown Commercial Service', class: 'ccs-logo__text', hidden: true))
68+
concat(tag.span('Government Commercial Agency', class: 'ccs-logo__text', hidden: true))
69+
else
70+
concat(tag.svg(class: 'ccs-logo__svg ccs-logo__svg--linear', xmlns: 'http://www.w3.org/2000/svg', width: '320', height: '48.5', aria: { hidden: 'true' }, focusable: 'false', viewBox: '0 0 899 137') do
71+
concat(tag.g(transform: 'matrix(1.3333333,0,0,-1.3333333,0,137)') do
72+
tag.g(transform: 'scale(0.1)') do
73+
CCS_LINEAR_LOGO_PATHS.each { |ccs_logo_path_attributes| concat(tag.path(**ccs_logo_path_attributes)) }
74+
concat(logo_linear_text_graphic_ccs)
75+
end
76+
end)
77+
end)
78+
concat(tag.span('Crown Commercial Service', class: 'ccs-logo__text', hidden: true))
79+
end
4780
end
4881
end
4982
end
5083

51-
# rubocop:enable Metrics/AbcSize
84+
# rubocop:enable Metrics/AbcSize, Metrics/CyclomaticComplexity, Metrics/PerceivedComplexity
5285

5386
# Array of the SVG paths for the CCS Logo
5487

@@ -526,7 +559,7 @@ def render
526559

527560
private
528561

529-
def logo_stacked_text_graphic
562+
def logo_stacked_text_graphic_ccs
530563
tag.g(transform: 'scale(10)') do
531564
tag.text(
532565
'xml:space': 'preserve',
@@ -540,7 +573,21 @@ def logo_stacked_text_graphic
540573
end
541574
end
542575

543-
def logo_linear_text_graphic
576+
def logo_stacked_text_graphic_gca
577+
tag.g(transform: 'scale(10)') do
578+
tag.text(
579+
'xml:space': 'preserve',
580+
transform: 'matrix(1,0,0,-1,20.3102,129.569)',
581+
class: 'ccs-logo__text-graphic'
582+
) do
583+
concat(tag.tspan('Government ', x: '0 35 62 85 110 125 149 188 212 237 250', y: '0', 'sodipodi:role': 'line'))
584+
concat(tag.tspan('Commercial ', x: '0 33.314499 59.416096 99.105995 138.7959 163.4126 177.5981 201.77882 210.5835 234.9653 244.37253', y: '53', 'sodipodi:role': 'line'))
585+
concat(tag.tspan('Agency ', x: '0 31.5 58 82.5 108 133.5', y: '106', 'sodipodi:role': 'line'))
586+
end
587+
end
588+
end
589+
590+
def logo_linear_text_graphic_ccs
544591
tag.g(transform: 'scale(10)') do
545592
tag.text(
546593
'xml:space': 'preserve',
@@ -551,6 +598,18 @@ def logo_linear_text_graphic
551598
end
552599
end
553600
end
601+
602+
def logo_linear_text_graphic_gca
603+
tag.g(transform: 'scale(10)') do
604+
tag.text(
605+
'xml:space': 'preserve',
606+
transform: 'matrix(1,0,0,-1,120,30)',
607+
class: 'ccs-logo__text-graphic'
608+
) do
609+
concat(tag.tspan('Government Commercial Agency', x: '0 35 62 85 110 125 149 188 212 237 250 260 293.314499 319.416096 359.105995 398.7959 423.4126 437.5981 461.77882 470.5835 494.9653 504.37253 515 546.5 573 597.5 623 648.5', y: '0', 'sodipodi:role': 'line'))
610+
end
611+
end
612+
end
554613
end
555614
end
556615
end

‎spec/ccs/components/ccs/header_spec.rb‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -78,5 +78,23 @@
7878
expect(header_container_element[:class]).to eq('ccs-header__container ccs-header__container--full-width')
7979
end
8080
end
81+
82+
context 'when using the GCA branding' do
83+
let(:ccs_header) { described_class.new(context: view_context, use_gca_branding: true) }
84+
85+
it 'correctly formats the HTML for the logo' do
86+
expect(header_element.to_html).to eq("
87+
<header class=\"ccs-header\" data-module=\"ccs-header\">
88+
<div class=\"ccs-header__container govuk-width-container\">
89+
<div class=\"ccs-header__logo\">
90+
<a class=\"ccs-header__link ccs-header__link--homepage\" aria-label=\"Crown Commercial Service\" href=\"https://www.gca.gov.uk\">
91+
#{gca_logo_html}
92+
</a>
93+
</div>
94+
</div>
95+
</header>
96+
".to_one_line)
97+
end
98+
end
8199
end
82100
end

‎spec/ccs/components/ccs/logo_spec.rb‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,5 +26,13 @@
2626
expect(logo_element.to_html).to eq(ccs_logo_crown_html)
2727
end
2828
end
29+
30+
context 'when using the GCA branding' do
31+
let(:ccs_logo) { described_class.new(context: view_context, use_gca_branding: true) }
32+
33+
it 'correctly formats the HTML for the logo' do
34+
expect(logo_element.to_html).to eq(gca_logo_html)
35+
end
36+
end
2937
end
3038
end

‎spec/ccs/frontend_helpers/ccs_frontend/header/fixtures_spec.rb‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -55,5 +55,14 @@
5555
expect(result.to_one_line).to eq_html(fixture_html)
5656
end
5757
end
58+
59+
context "when the fixture is 'with GCA branding'" do
60+
let(:fixture_name) { 'with GCA branding' }
61+
let(:result) { ccs_header(use_gca_branding: fixture_options[:useGcaBranding]) }
62+
63+
it 'has HTML matching the fixture' do
64+
expect(result.to_one_line).to eq_html(fixture_html)
65+
end
66+
end
5867
end
5968
end

‎spec/ccs/frontend_helpers/ccs_frontend/header/helpers_spec.rb‎

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -51,5 +51,23 @@
5151
".to_one_line)
5252
end
5353
end
54+
55+
context 'when using the GCA branding' do
56+
let(:result) { ccs_header(use_gca_branding: true) }
57+
58+
it 'correctly formats the HTML for the logo' do
59+
expect(header_element.to_html).to eq("
60+
<header class=\"ccs-header\" data-module=\"ccs-header\">
61+
<div class=\"ccs-header__container govuk-width-container\">
62+
<div class=\"ccs-header__logo\">
63+
<a class=\"ccs-header__link ccs-header__link--homepage\" aria-label=\"Crown Commercial Service\" href=\"https://www.gca.gov.uk\">
64+
#{gca_logo_html}
65+
</a>
66+
</div>
67+
</div>
68+
</header>
69+
".to_one_line)
70+
end
71+
end
5472
end
5573
end

‎spec/ccs/frontend_helpers/ccs_frontend/header/validate_fixtures_spec.rb‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@
88
'attributes' => true,
99
'classes' => true,
1010
'custom homepage url' => true,
11+
'with GCA branding' => true,
1112
}
1213

1314
tested_fixtures = FixturesLoader.get_tested_fixtures(:ccs_frontend, component_name)

‎spec/ccs/frontend_helpers/ccs_frontend/logo/fixtures_spec.rb‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -27,5 +27,14 @@
2727
expect(result.to_one_line).to eq_html(fixture_html)
2828
end
2929
end
30+
31+
context "when the fixture is 'use GCA branding'" do
32+
let(:fixture_name) { 'use GCA branding' }
33+
let(:result) { ccs_logo(use_gca_branding: fixture_options[:useGcaBranding]) }
34+
35+
it 'has HTML matching the fixture' do
36+
expect(result.to_one_line).to eq_html(fixture_html)
37+
end
38+
end
3039
end
3140
end

‎spec/ccs/frontend_helpers/ccs_frontend/logo/helpers_spec.rb‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -25,5 +25,13 @@
2525
expect(logo_element.to_html).to eq(ccs_logo_crown_html)
2626
end
2727
end
28+
29+
context 'when using the GCA branding' do
30+
let(:result) { ccs_logo(use_gca_branding: true) }
31+
32+
it 'correctly formats the HTML for the logo' do
33+
expect(logo_element.to_html).to eq(gca_logo_html)
34+
end
35+
end
2836
end
2937
end

0 commit comments

Comments
 (0)