diff --git a/app/assets/javascripts/modules/sticky-element-container.js b/app/assets/javascripts/modules/sticky-element-container.js index 697ad9be2..090a6a463 100644 --- a/app/assets/javascripts/modules/sticky-element-container.js +++ b/app/assets/javascripts/modules/sticky-element-container.js @@ -46,7 +46,7 @@ setInterval(checkScroll, _interval); checkResize(); checkScroll(); - $element.addClass('govuk-sticky-element'); + $element.addClass('govuk-sticky-element--enabled'); } function onResize () { @@ -99,11 +99,9 @@ function stickToWindow () { $element.addClass('govuk-sticky-element--stuck-to-window'); - $element.removeClass('govuk-sticky-element--stuck-to-parent'); } function stickToParent () { - $element.addClass('govuk-sticky-element--stuck-to-parent'); $element.removeClass('govuk-sticky-element--stuck-to-window'); } diff --git a/app/assets/stylesheets/govuk-component/_govspeak-html-publication-print.scss b/app/assets/stylesheets/govuk-component/_govspeak-html-publication-print.scss index 77eab6dc6..156a072b0 100644 --- a/app/assets/stylesheets/govuk-component/_govspeak-html-publication-print.scss +++ b/app/assets/stylesheets/govuk-component/_govspeak-html-publication-print.scss @@ -1,5 +1,5 @@ .govuk-govspeak-html-publication { - .sticky-element { + .govuk-sticky-element { display: none; } } diff --git a/app/assets/stylesheets/govuk-component/_govspeak-html-publication.scss b/app/assets/stylesheets/govuk-component/_govspeak-html-publication.scss index cf72009db..3f7cccf9d 100644 --- a/app/assets/stylesheets/govuk-component/_govspeak-html-publication.scss +++ b/app/assets/stylesheets/govuk-component/_govspeak-html-publication.scss @@ -195,7 +195,7 @@ // scss-lint:enable QualifyingElement } - .sticky-element { + .govuk-sticky-element { clear: both; } } diff --git a/app/assets/stylesheets/modules/_sticky-element-container.scss b/app/assets/stylesheets/modules/_sticky-element-container.scss index c85dfef28..c2bb022ed 100644 --- a/app/assets/stylesheets/modules/_sticky-element-container.scss +++ b/app/assets/stylesheets/modules/_sticky-element-container.scss @@ -1,6 +1,20 @@ -.govuk-sticky-element { - @include transition (opacity, .3s, ease); - opacity: 1; +.js-enabled .govuk-sticky-element { + position: absolute; + bottom: 0; + + &--stuck-to-window { + bottom: 0; + position: fixed; + } + + &--enabled { + @include transition (opacity, .3s, ease); + opacity: 1; + + @include media(mobile) { + position: static; + } + } &--hidden { opacity: 0; @@ -13,17 +27,4 @@ } } - &--stuck-to-parent { - bottom: 0; - position: absolute; - } - - &--stuck-to-window { - bottom: 0; - position: fixed; - } - - @include media(mobile) { - position: static; - } } diff --git a/app/views/govuk_component/govspeak_html_publication.raw.html.erb b/app/views/govuk_component/govspeak_html_publication.raw.html.erb index 7be675944..8dc346411 100644 --- a/app/views/govuk_component/govspeak_html_publication.raw.html.erb +++ b/app/views/govuk_component/govspeak_html_publication.raw.html.erb @@ -14,7 +14,7 @@ > <%= render file: 'govuk_component/govspeak.raw', locals: govspeak_locals %> <% if sticky_footer_html %> -
+
<%= raw sticky_footer_html %>
<% end %> diff --git a/spec/javascripts/modules/sticky-element-container.spec.js b/spec/javascripts/modules/sticky-element-container.spec.js index 4621fd0e8..5e9191afa 100644 --- a/spec/javascripts/modules/sticky-element-container.spec.js +++ b/spec/javascripts/modules/sticky-element-container.spec.js @@ -48,7 +48,6 @@ describe('A sticky-element-container module', function () { expect($footer.hasClass('govuk-sticky-element--hidden')).toBe(false); expect($footer.hasClass('govuk-sticky-element--stuck-to-window')).toBe(true); - expect($footer.hasClass('govuk-sticky-element--stuck-to-parent')).toBe(false); }); it('shows the element, stuck to the parent, when scrolled at the bottom', function () { @@ -61,7 +60,6 @@ describe('A sticky-element-container module', function () { expect($footer.hasClass('govuk-sticky-element--hidden')).toBe(false); expect($footer.hasClass('govuk-sticky-element--stuck-to-window')).toBe(false); - expect($footer.hasClass('govuk-sticky-element--stuck-to-parent')).toBe(true); }); }); });