<div id="cookie-consent" class="vgr-cookie-consent vgr-cookie-consent--dark">
<div class="vgr-container">
<div class="vgr-row">
<div class="col-sm-8 middle-sm">
<p class="vgr-cookie-consent__description">Vi använder cookies för att ge dig en bättre upplevelse av vår webbplats. <a href="/" class="vgr-cookie-consent__description-link">Läs mer om cookies</a>.</p>
</div>
<div class="col-sm-4 middle-sm end-sm">
<button class="vgr-button vgr-button--">Jag förstår</button>
</div>
</div>
</div>
</div>
<div id="{{ id }}" class="vgr-cookie-consent vgr-cookie-consent--{{ modifier }}">
<div class="vgr-container">
<div class="vgr-row">
<div class="col-sm-8 middle-sm">
<p class="vgr-cookie-consent__description">{{ description }} <a href="{{ url }}" class="vgr-cookie-consent__description-link">{{ linkText }}</a>.</p>
</div>
<div class="col-sm-4 middle-sm end-sm">
{% render "@button--secondary", button %}
</div>
</div>
</div>
</div>
{
"id": "cookie-consent",
"modifier": "dark",
"description": "Vi använder cookies för att ge dig en bättre upplevelse av vår webbplats.",
"url": "/",
"linkText": "Läs mer om cookies",
"button": {
"buttonText": "Jag förstår"
}
}
.vgr-cookie-consent {
$cookie-consent-dark-background: $color-gray-700;
$cookie-consent-dark-color: $color-white;
$cookie-consent-light-background: $color-gray-100;
$cookie-consent-light-color: $color-gray-700;
padding-top: $gutter-width;
padding-bottom: $gutter-width;
font-size: $small-font-size;
font-family: $secondary-font-stack;
&__description {
margin-top: 0;
margin-bottom: 0;
@media screen and (max-width: $small) {
margin-bottom: $gutter-width;
}
}
&__description-link {
color: inherit;
}
&--dark {
background-color: $cookie-consent-dark-background;
color: $cookie-consent-dark-color;
}
&--light {
background-color: $cookie-consent-light-background;
color: $cookie-consent-light-color;
}
@media print {
display: none;
}
}
There are no notes for this item.