Skip to content

Commit

Permalink
link fix
Browse files Browse the repository at this point in the history
  • Loading branch information
AshGDS committed Sep 4, 2024
1 parent a6258f1 commit 430ba9d
Show file tree
Hide file tree
Showing 5 changed files with 20 additions and 54 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -83,3 +83,7 @@ $column-width: 9.5em;
display: block;
}
}

.gem-c-share-links--black {
color: govuk-colour("black");
}
Original file line number Diff line number Diff line change
@@ -1,21 +1,6 @@
@mixin organisation-brand-colour {
@each $organisation in map-keys($govuk-colours-organisations) {
.brand--#{$organisation} {
.brand__color {
color: govuk-organisation-colour($organisation);

&:link,
&:visited,
&:active {
color: govuk-organisation-colour($organisation);
}

&:hover,
&:focus {
color: $govuk-focus-text-colour;
}
}

// the & declaration allows border-color to also be applied to the parent
// element as required by the heading component, adds 2KB to the CSS
&.brand__border-color,
Expand All @@ -32,21 +17,6 @@
// the "the" prefix was dropped, this is maintained here for backwards
// compatibility
.brand--the-office-of-the-leader-of-the-house-of-commons {
.brand__color {
color: govuk-organisation-colour("office-of-the-leader-of-the-house-of-commons");

&:link,
&:visited,
&:active {
color: govuk-organisation-colour("office-of-the-leader-of-the-house-of-commons");
}

&:hover,
&:focus {
color: $govuk-focus-text-colour;
}
}

&.brand__border-color,
.brand__border-color {
border-color: govuk-organisation-colour("office-of-the-leader-of-the-house-of-commons", $contrast-safe: false);
Expand All @@ -56,21 +26,6 @@
// so are written out here for our use

.brand--prime-ministers-office-10-downing-street {
.brand__color {
color: govuk-colour("black");

&:link,
&:visited,
&:active {
color: govuk-colour("black");
}

&:hover,
&:focus {
color: $govuk-focus-text-colour;
}
}

&.brand__border-color,
.brand__border-color {
border-color: govuk-colour("black");
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -10,12 +10,14 @@
columns ||= false

brand ||= false
brand_helper = GovukPublishingComponents::AppHelpers::BrandHelper.new(brand)

if brand
brand_class = 'gem-c-share-links--black'
end

classes = %w(gem-c-share-links govuk-!-display-none-print)
classes << "gem-c-share-links--stacked" if stacked
classes << "gem-c-share-links--columns" if columns
classes << brand_helper.brand_class

data_attributes ||= {}
((data_attributes[:module] ||= "") << " " << "ga4-link-tracker").strip! if track_as_sharing || track_as_follow
Expand Down Expand Up @@ -71,8 +73,8 @@
target: "_blank",
rel: "noopener noreferrer external",
data: data_attributes,
class: "govuk-link govuk-link--no-underline gem-c-share-links__link #{brand_helper.color_class}" do %>
<span class="gem-c-share-links__link-icon">
class: "govuk-link govuk-link--no-underline gem-c-share-links__link" do %>
<span class="gem-c-share-links__link-icon <%= brand_class %>">
<% if link[:icon] == 'facebook' %>
<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false" width="0" height="0" class="gem-c-share-links__svg">
<path fill="currentColor" d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -81,9 +81,9 @@ examples:
}
]
with_branding:
description: Organisation [colour branding](https://github.com/alphagov/govuk_publishing_components/blob/main/docs/component_branding.md) can be added to the component as shown.
description: Black branding can be added to the component icons as shown.
data:
brand: 'attorney-generals-office'
brand: true
links: [
{
href: 'share',
Expand Down Expand Up @@ -208,7 +208,7 @@ examples:
with_all_icons:
data:
stacked: true
brand: 'hm-treasury'
brand: true
links: [
{
href: '/facebook-share-link',
Expand Down
9 changes: 7 additions & 2 deletions spec/components/share_links_spec.rb
Original file line number Diff line number Diff line change
Expand Up @@ -101,8 +101,13 @@ def links
end

it "adds branding correctly" do
render_component(links: [links[0]], brand: "attorney-generals-office")
assert_select ".gem-c-share-links.brand--attorney-generals-office .gem-c-share-links__link.brand__color"
render_component(links: [links[0]], brand: true)
assert_select ".gem-c-share-links span.gem-c-share-links__link-icon.gem-c-share-links--black"
end

it "has no branding by default" do
render_component(links: [links[0]])
assert_select ".gem-c-share-links span.gem-c-share-links__link-icon.gem-c-share-links--black", false
end

it "arranges in columns" do
Expand Down

0 comments on commit 430ba9d

Please sign in to comment.