Redesign cookie consent as centered glass modal

This commit is contained in:
2026-05-14 00:48:23 +02:00
parent 1ddc7b10f6
commit e33b5f8757
3 changed files with 251 additions and 39 deletions

View File

@@ -15,6 +15,7 @@
{{ block.super }}
{# Ensure Carbasa webshop styling is present so responsive header/footer render correctly. #}
<link rel="stylesheet" type="text/x-scss" href="{% static 'carbasa/webshop_base.scss' %}">
<link rel="stylesheet" type="text/x-scss" href="{% static 'mandelstudio/scss/layout_overrides.scss' %}">
{% endblock %}
{% block extrahead %}
@@ -25,43 +26,7 @@
<link rel="preconnect" href="https://www.google-analytics.com/">
{% endif %}
{{ block.super }}
<style>
header .header-right { display: flex; align-items: center; gap: .5rem; }
header .header-right .language-dropdown,
header .header-right .basket-dropdown,
header .header-right > a.user-button.menu-circle {
flex: 0 0 40px;
width: 40px;
height: 40px;
min-width: 40px;
min-height: 40px;
margin: 0 !important;
padding: 0 !important;
display: flex;
align-items: center;
justify-content: center;
box-sizing: border-box;
}
header .header-right .menu-circle {
width: 40px;
height: 40px;
min-width: 40px;
min-height: 40px;
padding: 0;
display: flex;
align-items: center;
justify-content: center;
}
header .header-right .menu-circle i,
header .header-right .menu-circle svg { display: block; line-height: 1; }
header .language-dropdown .dropdown-toggle::after { display: none; }
header .language-dropdown .dropdown-toggle { width: 40px; height: 40px; padding: 0; display: inline-flex; align-items: center; justify-content: center; }
header .language-dropdown .language-icon,
header .basket-dropdown .dropdown-toggle svg { width: 18px; height: 18px; font-size: 18px; line-height: 18px; }
header .language-dropdown .language-icon { color: #fff; }
header .language-dropdown .language-chevron { display: none !important; }
</style>
{% if cookie_jar.needs_approval %}
{% if cookie_jar.needs_approval or cookie_jar.site_settings.strict_cookies %}
<link rel="stylesheet" type="text/css" href="{% static 'cookie_jar/css/cookie_jar.css' %}">
{% endif %}
{% for header_snippet in cookie_jar.activated_snippet_header_templates %}
@@ -97,7 +62,7 @@ header .language-dropdown .language-chevron { display: none !important; }
{% block extrascripts %}
{% include "oscar/partials/extrascripts.html" %}
{{ block.super }}
{% if cookie_jar.needs_approval %}
{% if cookie_jar.needs_approval or cookie_jar.site_settings.strict_cookies %}
<script src="{% static 'cookie_jar/js/cookie_jar.js' %}"></script>
{% endif %}
{% endblock %}
@@ -129,8 +94,11 @@ oxyan.initImageZoom()
{% for footer_snippet in cookie_jar.activated_snippet_footer_templates %}
{% include footer_snippet %}
{% endfor %}
{% if cookie_jar.needs_approval or cookie_jar.site_settings.strict_cookies %}
<script src="{% static 'cookie_jar/js/cookie_jar.js' %}"></script>
{% endif %}
{% include "cookie_jar/cookie_banner.html" %}
{% if cookie_jar.needs_approval %}
{% if cookie_jar.needs_approval or cookie_jar.site_settings.strict_cookies %}
{% include "cookie_jar/partials/preferences_saved_toast.html" %}
{% endif %}
{% endblock %}