Cookie overlay
The cookie overlay is an alert dialog that asks for consent for the cookies on a site.
Usage
Place the cookie overlay at the bottom of the page, just below the footer, the cookie overlay will display a dialog to the user to read the cookie settings or accept them and then disappear.
The cookie overlay is displayed when the JavaScript support class slb-show is added to the container, removing the JavaScript support class will hide the overlay.
As a default slb-bounce is used to create a bounce animation, removing this class will make the cookie overlay display without transition.
JavaScript Support
JavaScript Support class name | Description |
---|---|
slb-show |
Add or remove this class to show and hide the cookie policy dynamically. |
slb-bounce |
Add a bounce animation when the element is displayed. |
Standard Life websites use cookies to ensure you get the best experience. Read more or update your settings.
cookies\cookie-overlay.hbs
<div class="slb-cookie-overlay slb-bounce slb-show">
<p class="slb-cookie-overlay__text">Standard Life websites use cookies to ensure you get the best experience. <a href="#" class="slb-cta slb-cta--regular slb-cookie-overlay__cta" title="Read our Cookie Policy">Read more or update your settings.</a></p>
<button class="slb-cookie-overlay__button">OK</button>
</div>
Source:
components/_cookies.scss