<div class="m-cookie-disclaimer js-cookie-disclaimer">
<div role="alert" class="m-cookie-disclaimer__wrapper m-alert m-alert--info m-alert--dismissable js-dismiss-alert">
<div class="m-cookie-disclaimer__inner">
<div class="m-cookie-disclaimer__inner-first">
<p class="m-cookie-disclaimer__text">På internetstiftelsen.se använder vi kakor (cookies) för att löpande förbättra webbplatsen. <a href="https://internetstiftelsen.se/om-webbplatsen/cookies/">Läs mer om hur Internetstiftelsen använder kakor</a>.</p>
</div>
<div class="m-cookie-disclaimer__inner-second">
<button id="js-accept-cookies" class="a-button a-button--is-static">
<span class="a-button__text">Jag förstår</span>
</button>
</div>
</div>
</div>
</div>
<div class="m-cookie-disclaimer js-cookie-disclaimer">
<div{{#if role}} role="{{role}}"{{/if}} class="m-cookie-disclaimer__wrapper m-alert m-alert--{{type}}{{#if is_dismissable}} m-alert--dismissable{{/if}}{{#if js_class}} {{js_class}}{{/if}}">
<div class="m-cookie-disclaimer__inner">
<div class="m-cookie-disclaimer__inner-first">
<p class="m-cookie-disclaimer__text">{{{text}}}</p>
</div>
{{#if is_dismissable}}
<div class="m-cookie-disclaimer__inner-second">
{{> @button el="button" modifiers="is-static" text="Jag förstår" id="js-accept-cookies"}}
</div>
{{/if}}
</div>
</div>
</div>
{
"name": "Cookies",
"type": "info",
"role": "alert",
"text": "På internetstiftelsen.se använder vi kakor (cookies) för att löpande förbättra webbplatsen. <a href=\"https://internetstiftelsen.se/om-webbplatsen/cookies/\">Läs mer om hur Internetstiftelsen använder kakor</a>.",
"js_class": "js-dismiss-alert",
"is_dismissable": true
}
const cookieBar = document.querySelector('.js-cookie-disclaimer');
const visibleClass = 'is-visible';
const cookieName = 'internetstiftelsen-cookie-consent';
// const testCookieSupport = 'Cookies are enabled';
const acceptButton = document.getElementById('js-accept-cookies');
const currentProtocol = document.location.protocol;
// const { cookieEnabled } = navigator.cookieEnabled;
// Cookies are disabled
// function showCookieFail() {
// console.warn('Cookies are disabled.');
// }
// Check for cookie support
// (function checkCookieSupport() {
// if (!cookieEnabled) {
// if (currentProtocol === 'https:') {
// document.cookie = `${testCookieSupport}=Yes;path=/;SameSite=Strict;Secure;`;
// } else {
// document.cookie = `${testCookieSupport}=Yes;path=/;SameSite=Strict;`;
// }
//
// cookieEnabled = document.cookie.indexOf(testCookieSupport) !== -1;
// }
// return cookieEnabled || showCookieFail();
// }());
// Set cookie
function setCookie(name, value, days) {
const d = new Date();
d.setTime(d.getTime() + 24 * 60 * 60 * 1000 * days);
if (currentProtocol === 'https:') {
document.cookie = `${name}=${value};path=/;SameSite=Strict;Secure;expires=${d.toGMTString()}`;
} else {
document.cookie = `${name}=${value};path=/;SameSite=Strict;expires=${d.toGMTString()}`;
}
}
// Get cookie
function getCookie(name) {
const v = document.cookie.match(`(^|;) ?${name}=([^;]*)(;|$)`);
return v ? v[2] : null;
}
// No cookie set? Show cookie disclaimer bar
// if (!getCookie(cookieName) && cookieEnabled) {
if (!getCookie(cookieName)) {
if (cookieBar) {
cookieBar.classList.add(visibleClass);
}
}
// Cookies accepted
function acceptCookies() {
setCookie(cookieName, 'YES', 365);
if (cookieBar) {
cookieBar.classList.remove(visibleClass);
}
}
// Button click
if (acceptButton) {
acceptButton.addEventListener('click', acceptCookies);
}
@charset 'UTF-8';
@include molecule(cookie-disclaimer) {
display: none;
position: relative;
z-index: z_index(foreground);
&.is-visible {
display: block;
}
@include bp-up(lg) {
position: fixed;
right: 0;
bottom: 0;
left: 0;
}
@include e(wrapper) {
width: 100%;
margin-bottom: 0 !important;
padding: rhythm(2) 0;
}
@include e(inner) {
display: flex;
flex-wrap: wrap;
margin-right: auto;
margin-left: auto;
@include make-container-max-widths();
@include bp-down(xl) {
padding-right: $grid-gutter-width;
padding-left: $grid-gutter-width;
}
}
@include e(inner-first) {
display: flex;
align-items: center;
width: 100%;
a {
padding: 0 0.25rem;
border-bottom: 0.11111rem solid $color-peacock;
color: $color-black;
text-decoration: none;
&:hover,
&:focus {
text-decoration: none;
}
}
@include bp-up(md) {
@include make-col(12);
padding-right: rhythm(3);
}
}
@include e(inner-second) {
display: flex;
align-items: center;
justify-content: flex-end;
width: 100%;
padding-top: rhythm(2);
button {
font-size: 18px;
}
@include bp-up(md) {
@include make-col(6);
padding-top: 0;
}
}
@include e(text) {
margin-bottom: 0;
}
}
No notes defined.