Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

WIP: Add cookie banner #227

Closed
wants to merge 5 commits into from
Closed

WIP: Add cookie banner #227

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
91f2895
Import cookie banner and button styles
kr8n3r May 18, 2021
26f86c4
REMOVE: Example config test
kr8n3r May 5, 2021
6f95f5b
Add cookie banner component partial
kr8n3r May 10, 2021
32c4889
Import cookie banner partial into core layout
kr8n3r May 5, 2021
b7a1892
Add more js hooks
kr8n3r May 21, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
9 changes: 9 additions & 0 deletions example/config/tech-docs.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,3 +52,12 @@ api_path: source/pets.yml
# Optional global settings for the page review process
owner_slack_workspace: gds
default_owner_slack: '#2nd-line'

cookie_banner:
enable: true
cookie_types: ['essential','analytics', 'additional']
cookie_message_text: |
This is my custom text
This adds a line break.

This adds a new paragraph.
2 changes: 2 additions & 0 deletions lib/assets/stylesheets/_govuk_tech_docs.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,8 @@ $govuk-new-link-styles: true;
@import "govuk/core/all";
@import "govuk/objects/all";

@import "govuk/components/button/index";
@import "govuk/components/cookie-banner/index";
@import "govuk/components/footer/index";
@import "govuk/components/header/index";
@import "govuk/components/inset-text/index";
Expand Down
90 changes: 90 additions & 0 deletions lib/source/layouts/_cookie_banner.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,90 @@
<%
is_enabled ||= config.tech_docs.dig(:cookie_banner, :enable)

essential_cookies = config.tech_docs.dig(:cookie_banner, :cookie_types) ? config[:tech_docs][:cookie_banner][:cookie_types].include?('essential') : false
analytics_cookies = config.tech_docs.dig(:cookie_banner, :cookie_types) ? config[:tech_docs][:cookie_banner][:cookie_types].include?('analytics') : false
additional_cookies = config.tech_docs.dig(:cookie_banner, :cookie_types) ? config[:tech_docs][:cookie_banner][:cookie_types].include?('additional') : false

custom_cookie_message_text = config.tech_docs.dig(:cookie_banner, :cookie_message_text)

cookie_page_path = config.tech_docs.dig(:cookie_banner, :cookie_page_path) ?
config[:tech_docs][:cookie_banner][:cookie_page_path] : '/cookies'

nonessential_cookie_type_text = additional_cookies ? 'additional' : 'analytics'
%>

<% cookie_message_text = capture do %>
<% if essential_cookies %>
<p>We use some essential cookies to make this service work.</p>
<% end %>
<% if additional_cookies %>
<p>We’d like to set additional cookies so we can remember your settings, understand how people use the service and make improvements.</p>
<% elsif analytics_cookies %>
<p>We’d also like to use analytics cookies so we can understand how you use the service and make improvements.</p>
<% end %>
<% end %>

<% if is_enabled %>
<div class="govuk-cookie-banner" data-module="cookie-banner" role="region" aria-label="Cookies on <%= config[:tech_docs][:service_name] %>">
<div class="govuk-cookie-banner__message js-cookie-message govuk-width-container">
<div class="govuk-grid-row">
<div class="govuk-grid-column-two-thirds">
<h2 class="govuk-cookie-banner__heading govuk-heading-m">Cookies on <%= config[:tech_docs][:service_name] %></h2>
<div class="govuk-cookie-banner__content">
<% if custom_cookie_message_text || cookie_message_text %>
<%= custom_cookie_message_text ? simple_format(custom_cookie_message_text) : cookie_message_text %>
<% end %>
</div>
</div>
</div>
<div class="govuk-button-group">
<% if analytics_cookies || additional_cookies %>
<button value="accept" type="button" name="cookies" class="govuk-button" data-module="govuk-button" data-accept-cookies="true">
Accept <%= nonessential_cookie_type_text %> cookies
</button>
<button value="reject" type="button" name="cookies" class="govuk-button" data-module="govuk-button" data-accept-cookies="false">
Reject <%= nonessential_cookie_type_text %> cookies
</button>
<% end %>
<% if essential_cookies %>
<a class="govuk-link" href="<%= cookie_page_path %>">View cookies</a>
<% end %>
<% if essential_cookies && !(analytics_cookies || additional_cookies) %>
<button type="button" class="govuk-button" data-module="govuk-button" data-hide-cookie-banner="true">
Hide this message
</button>
<% end %>
</div>
</div>
<% if analytics_cookies || additional_cookies %>
<div class="govuk-cookie-banner__message js-accept-message govuk-width-container" role="alert" hidden>
<div class="govuk-grid-row">
<div class="govuk-grid-column-two-thirds">
<div class="govuk-cookie-banner__content">
<p>You’ve accepted <%= nonessential_cookie_type_text %> cookies. You can <a href="<%= cookie_page_path %>">change your cookie settings</a> at any time.</p>
</div>
</div>
</div>
<div class="govuk-button-group">
<button class="govuk-button" data-module="govuk-button" data-hide-cookie-banner="true">
Hide this message
</button>
</div>
</div>
<div class="govuk-cookie-banner__message js-reject-message govuk-width-container" role="alert" hidden>
<div class="govuk-grid-row">
<div class="govuk-grid-column-two-thirds">
<div class="govuk-cookie-banner__content">
<p>You’ve rejected <%= nonessential_cookie_type_text %> cookies. You can <a href="<%= cookie_page_path %>">change your cookie settings</a> at any time.</p>
</div>
</div>
</div>
<div class="govuk-button-group">
<button class="govuk-button" data-module="govuk-button" data-hide-cookie-banner="true">
Hide this message
</button>
</div>
</div>
<% end %>
</div>
<% end %>
1 change: 1 addition & 0 deletions lib/source/layouts/core.erb
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@

<body class="govuk-template__body">
<script>document.body.className = ((document.body.className) ? document.body.className + ' js-enabled' : 'js-enabled');</script>
<%= partial 'layouts/cookie_banner' %>

<div class="app-pane">
<div class="app-pane__header toc-open-disabled">
Expand Down