Upgrade cookie notice

This commit is contained in:
Jérémy Munsch 2021-05-01 14:16:41 +02:00
parent 5ccea964ba
commit b951dfb77d
11 changed files with 198 additions and 169 deletions

View file

@ -1,5 +0,0 @@
<?php
return [
'apiKey' => env('GOOGLE_MAP_API_KEY')
];

6
config/google.php Normal file
View file

@ -0,0 +1,6 @@
<?php
return [
'apiKey' => env('GOOGLE_MAP_API_KEY'),
'analyticsKey' => env('ANALYTICS_GOOGLE_ID')
];

View file

@ -13,11 +13,12 @@ export class LdcwebCn {
this.modalCloseBtn = document.getElementById('close-link'); this.modalCloseBtn = document.getElementById('close-link');
this.acceptAllBtnBanner = document.getElementById('ldcweb-cn-accept-banner'); this.acceptAllBtnBanner = document.getElementById('ldcweb-cn-accept-banner');
this.acceptAllBtn = document.getElementById('ldcweb-cn-accept'); this.acceptAllBtn = document.getElementById('ldcweb-cn-accept');
this.denyAllBtnBanner = document.getElementById('ldcweb-cn-deny-banner');
this.denyAllBtn = document.getElementById('ldcweb-cn-deny'); this.denyAllBtn = document.getElementById('ldcweb-cn-deny');
this.personalizeBtn = document.getElementsByClassName('ldcweb-cn-personalize'); this.personalizeBtn = document.getElementsByClassName('ldcweb-cn-personalize');
this.changeBtn = document.getElementsByClassName('ldcweb-cn-change'); this.changeBtn = document.getElementsByClassName('ldcweb-cn-change');
this.cookiesList = document.getElementById('ldcweb-cn-list'); this.cookiesList = document.getElementById('ldcweb-cn-list');
this.cookieLink = document.getElementById('cookieNotice') this.cookieLink = document.getElementsByClassName('ldcweb-cn-cookie-link');
this.template = document.getElementById('template').cloneNode(true); this.template = document.getElementById('template').cloneNode(true);
document.getElementById('template').remove(); document.getElementById('template').remove();
@ -72,40 +73,40 @@ export class LdcwebCn {
for (let denyLabel of this.cookieContainer.querySelectorAll('.deny > label')) { for (let denyLabel of this.cookieContainer.querySelectorAll('.deny > label')) {
denyLabel.classList.remove('active'); denyLabel.classList.remove('active');
} }
this.updateAllCookiesButtonsActiveStatus() this.updateAllCookiesButtonsActiveStatus();
this.cookieContainer.classList.remove('open-modal'); this.cookieContainer.classList.remove('open-modal');
this.cookieContainer.classList.remove('open-banner'); this.cookieContainer.classList.remove('open-banner');
}.bind(this); }.bind(this);
this.acceptAllBtnBanner.addEventListener('click', accept); this.acceptAllBtnBanner.addEventListener('click', accept);
this.acceptAllBtn.addEventListener('click', accept); this.acceptAllBtn.addEventListener('click', accept);
this.denyAllBtn.addEventListener( let deny = function (e) {
'click', e.preventDefault();
function (e) { for (const [key, value] of Object.entries(this.config)) {
e.preventDefault(); this.removeCookie(key, value);
for (const [key, value] of Object.entries(this.config)) { }
this.removeCookie(key, value); for (let acceptLabel of this.cookieContainer.querySelectorAll('.accept > label')) {
} acceptLabel.classList.remove('active');
for (let acceptLabel of this.cookieContainer.querySelectorAll('.accept > label')) { }
acceptLabel.classList.remove('active'); for (let denyLabel of this.cookieContainer.querySelectorAll('.deny > label')) {
} denyLabel.classList.add('active');
for (let denyLabel of this.cookieContainer.querySelectorAll('.deny > label')) { }
denyLabel.classList.add('active'); this.updateAllCookiesButtonsActiveStatus();
} this.cookieContainer.classList.remove('open-modal');
this.updateAllCookiesButtonsActiveStatus() this.cookieContainer.classList.remove('open-banner');
this.cookieContainer.classList.remove('open-modal'); }.bind(this);
this.cookieContainer.classList.remove('open-banner'); this.denyAllBtnBanner.addEventListener('click', deny);
}.bind(this) this.denyAllBtn.addEventListener('click', deny);
);
this.cookieLink.addEventListener( for (let item of this.cookieLink) {
'click', item.addEventListener(
function (e) { 'click',
e.preventDefault(); function (e) {
this.setCookieList(); e.preventDefault();
this.updateAllCookiesButtonsActiveStatus() this.openModal();
}.bind(this) }.bind(this)
); );
}
for (let item of this.personalizeBtn) { for (let item of this.personalizeBtn) {
this.addEvent( this.addEvent(
@ -125,10 +126,14 @@ export class LdcwebCn {
let test = elm.split('='); let test = elm.split('=');
if (test[1] === 'true') { if (test[1] === 'true') {
this.config[test[0]].script(); this.config[test[0]].script();
} else {
if (this.config[test[0]].fallback !== undefined) {
this.config[test[0]].fallback();
}
} }
}); });
this.updateAllCookiesButtonsActiveStatus() this.updateAllCookiesButtonsActiveStatus();
} }
setCookieList() { setCookieList() {
@ -148,7 +153,7 @@ export class LdcwebCn {
name.textContent = value.name; name.textContent = value.name;
description.textContent = value.description; description.textContent = value.description;
link.textContent = "En savoir plus"; link.textContent = "Politique de confidentialité";
link.setAttribute("href", value.link); link.setAttribute("href", value.link);
acceptInput.id = key + '1'; acceptInput.id = key + '1';
acceptInput.name = key; acceptInput.name = key;
@ -163,13 +168,13 @@ export class LdcwebCn {
acceptLabel.classList.add('active'); acceptLabel.classList.add('active');
denyLabel.classList.remove('active'); denyLabel.classList.remove('active');
this.updateAllCookiesButtonsActiveStatus(); this.updateAllCookiesButtonsActiveStatus();
this.addCookie(key, value) this.addCookie(key, value);
}.bind(this)); }.bind(this));
denyInput.addEventListener('click', function (e) { denyInput.addEventListener('click', function (e) {
acceptLabel.classList.remove('active'); acceptLabel.classList.remove('active');
denyLabel.classList.add('active'); denyLabel.classList.add('active');
this.updateAllCookiesButtonsActiveStatus(); this.updateAllCookiesButtonsActiveStatus();
this.removeCookie(key, value) this.removeCookie(key, value);
}.bind(this)); }.bind(this));
this.cookiesList.append(cookie); this.cookiesList.append(cookie);
@ -295,10 +300,15 @@ export class LdcwebCn {
} }
saveLDCWebCookie(content) { saveLDCWebCookie(content) {
document.cookie = "ldcwebcn-init=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;"; // document.cookie = "ldcwebcn-init=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
let date = new Date(); let date = new Date();
let newDate = new Date(date.setMonth(date.getMonth() + 13)); let newDate = new Date(date.setMonth(date.getMonth() + 13));
document.cookie = "ldcwebcn-init=" + content + "; expires=" + newDate.toUTCString() + ";"; document.cookie = "ldcwebcn-init=" + content + "; expires=" + newDate.toUTCString() + "; path=/;";
}
openModal() {
this.setCookieList();
this.updateAllCookiesButtonsActiveStatus();
} }
} }

View file

@ -1,24 +1,26 @@
let header = document.querySelector('#app > header'); (function () {
let links = document.querySelectorAll('#app > header > nav > ul > li > a'); let header = document.querySelector('#app > header');
let inputs = document.querySelectorAll('#app > header input[type="checkbox"]'); let links = document.querySelectorAll('#app > header > nav > ul > li > a');
let inputs = document.querySelectorAll('#app > header input[type="checkbox"]');
document.body.addEventListener('click', function (e) { document.body.addEventListener('click', function (e) {
if (!__Gaul.isDescendant(header, e.target)) { if (!__Gaul.isDescendant(header, e.target)) {
for (let checkbox of inputs) { for (let checkbox of inputs) {
checkbox.checked = false; checkbox.checked = false;
}
} }
} }, false);
}, false);
header.addEventListener('click', function (e) { header.addEventListener('click', function (e) {
let headerStatus = document.getElementById('menu-checkbox'); let headerStatus = document.getElementById('menu-checkbox');
if (headerStatus.checked === true) { if (headerStatus.checked === true) {
for (let checkbox of inputs) { for (let checkbox of inputs) {
checkbox.checked = false; checkbox.checked = false;
}
} else {
for (let checkbox of inputs) {
checkbox.checked = true;
}
} }
} else { });
for (let checkbox of inputs) { })();
checkbox.checked = true;
}
}
});

View file

@ -55,6 +55,8 @@ $color10: #999595;
$color11: #ab9d8e; $color11: #ab9d8e;
$color12: #ffc400; $color12: #ffc400;
$orange: #ffb400; $orange: #ffb400;
$primary-color: $primary;
$secondary-color: $secondary;
$vegetal: #a2e48b; $vegetal: #a2e48b;
$vegetalBodyBG: #8dd175; $vegetalBodyBG: #8dd175;

View file

@ -2,16 +2,17 @@
/* - Choix des FONTS */ /* - Choix des FONTS */
/* - Changement des couleurs et des polices */ /* - Changement des couleurs et des polices */
/* PARTIE A RENSEIGNER */ /* PARTIE A RENSEIGNER */
// $primary: #006633; // $primary-color #d4021d;
// $secondary: #e30613; // $secondary-color #707070;
// $background-color: #f5ecde; // $background-color #ffffff;
$background-color: $color1;
$title-font: "Veneer", Arial, Helvetica, sans-serif; $title-font: "Veneer", Arial, Helvetica, sans-serif;
$title-size: 4rem; $title-size: 4rem;
$text-font: "CreamyScriptRegular", Arial, Helvetica, sans-serif; $text-font: "CreamyScriptRegular", Arial, Helvetica, sans-serif;
$text-size: 2rem; $text-size: 2rem;
$accept-color: #33aa33;
$deny-color: #aa3333;
$background-color: $color1;
/* PARTIE A RENSEIGNER FACULTATIF */ /* PARTIE A RENSEIGNER FACULTATIF */
/* FENETRE D'ACCUEIL */ /* FENETRE D'ACCUEIL */
@ -25,12 +26,12 @@ $ck-w1-color-title: #000000;
/* Text settings */ /* Text settings */
$ck-w1-font-family-txt: $text-font; $ck-w1-font-family-txt: $text-font;
$ck-w1-font-size-txt: $text-size; $ck-w1-font-size-txt: $text-size;
$ck-w1-color-txt: $primary; $ck-w1-color-txt: $primary-color;
$ck-w1-color-href-hover: $secondary; $ck-w1-color-href-hover: $secondary-color;
/* Button settings */ /* Button settings */
$ck-w1-color-btn: $primary; $ck-w1-color-btn: $primary-color;
$ck-w1-color-btn-hover: $secondary; $ck-w1-color-btn-hover: $secondary-color;
$ck-w1-font-family-btn-txt: $text-font; $ck-w1-font-family-btn-txt: $text-font;
$ck-w1-font-size-btn-txt: $text-size; $ck-w1-font-size-btn-txt: $text-size;
$ck-w1-color-btn-txt: #ffffff; $ck-w1-color-btn-txt: #ffffff;
@ -41,7 +42,7 @@ $ck-w1-color-btn-border-hover: transparent;
/* FENETRE DE PERSONNALISATION */ /* FENETRE DE PERSONNALISATION */
$ck-bg-color-modal-wrapper: #ffffff; $ck-bg-color-modal-wrapper: #ffffff;
/* Title settings */ /* Title settings */
$ck-w2-bgcolor-title: $primary; $ck-w2-bgcolor-title: $primary-color;
$ck-w2-font-family-title: $title-font; $ck-w2-font-family-title: $title-font;
$ck-w2-font-size-title: $title-size; $ck-w2-font-size-title: $title-size;
$ck-w2-color-title: #ffffff; $ck-w2-color-title: #ffffff;
@ -54,9 +55,9 @@ $ck-w2-color-href-hover: #000000;
/* Accept/Deny btn settings */ /* Accept/Deny btn settings */
$ck-color-accept: #808080; $ck-color-accept: #808080;
$ck-color-accept-hover: $primary; $ck-color-accept-hover: $accept-color;
$ck-color-deny: #808080; $ck-color-deny: #808080;
$ck-color-deny-hover: $secondary; $ck-color-deny-hover: $deny-color;
$ck-color-txt: #ffffff; $ck-color-txt: #ffffff;
$ck-color-txt-hover: #ffffff; $ck-color-txt-hover: #ffffff;
@ -65,7 +66,6 @@ $ck-bgcolor-list: #e4e4e4;
$ck-font-family-list: $text-font; $ck-font-family-list: $text-font;
$ck-font-size-list: $text-size; $ck-font-size-list: $text-size;
$ck-color-list: #000000; $ck-color-list: #000000;
/* FIN DU PARAMETRAGE */ /* FIN DU PARAMETRAGE */
/* MOBILE FIRST */ /* MOBILE FIRST */
@ -87,17 +87,16 @@ $ck-color-list: #000000;
top: 0; bottom: 0; top: 0; bottom: 0;
width: 100%; height: 100%; width: 100%; height: 100%;
background: rgba(0, 0, 0, 0.7); background: rgba(0, 0, 0, 0.7);
z-index: 6000; z-index: 99999999999;
opacity: 1; opacity: 1;
line-height: initial;
} }
#ldcweb-cn p, #ldcweb-cn p,
#ldcweb-cn a{ #ldcweb-cn a{
font-family: $ck-w1-font-family-txt; font-family: $ck-w1-font-family-txt;
font-size: $ck-w1-font-size-txt; font-size: $ck-w1-font-size-txt;
line-height: 1.2;
color: $ck-w1-color-txt; color: $ck-w1-color-txt;
line-height: 1.3;
} }
#ldcweb-cn a{ #ldcweb-cn a{
text-decoration: underline; text-decoration: underline;
@ -128,7 +127,6 @@ $ck-color-list: #000000;
#ldcweb-cn .banner-title p{ #ldcweb-cn .banner-title p{
font-family: $ck-w1-font-family-title; font-family: $ck-w1-font-family-title;
font-size: $ck-w1-font-size-title; font-size: $ck-w1-font-size-title;
line-height: 1.2;
font-weight: bold; font-weight: bold;
color: $ck-w1-color-title; color: $ck-w1-color-title;
text-align: center; text-align: center;
@ -139,20 +137,19 @@ $ck-color-list: #000000;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
} }
#ldcweb-cn .btns .btn:first-child {margin-bottom: 2vw;}
#ldcweb-cn .btns .btn { #ldcweb-cn .btns .btn {
flex: 1; display: block;
/* flex: 1; */
padding: 1em; padding: 1em;
text-align: center; text-align: center;
min-width: 12em; min-width: 12em;
width: 100%;
background-color: $ck-w1-color-btn; background-color: $ck-w1-color-btn;
text-decoration: none; text-decoration: none;
font-family: $ck-w1-font-family-btn-txt; font-family: $ck-w1-font-family-btn-txt;
font-size: $ck-w1-font-size-btn-txt; font-size: $ck-w1-font-size-btn-txt;
line-height: 1.2;
color: $ck-w1-color-btn-txt; color: $ck-w1-color-btn-txt;
/* font-weight: bold; */
transition: all .5s; transition: all .5s;
} }
#ldcweb-cn .btns .btn:hover { #ldcweb-cn .btns .btn:hover {
@ -178,6 +175,7 @@ $ck-color-list: #000000;
#ldcweb-cn-modal .modal-wrapper{ #ldcweb-cn-modal .modal-wrapper{
position: relative; position: relative;
background-color: $ck-bg-color-modal-wrapper; background-color: $ck-bg-color-modal-wrapper;
max-height: 100vh;
} }
#ldcweb-cn-modal .modal-wrapper > div:not(:first-of-type){width: 100%;} #ldcweb-cn-modal .modal-wrapper > div:not(:first-of-type){width: 100%;}
#ldcweb-cn-modal .modal-btn-close{ #ldcweb-cn-modal .modal-btn-close{
@ -198,7 +196,6 @@ $ck-color-list: #000000;
font-family: Arial, Helvetica, sans-serif; font-family: Arial, Helvetica, sans-serif;
font-size: medium; font-size: medium;
line-height: .85;
font-weight: bold; font-weight: bold;
color: $ck-w2-color-title; color: $ck-w2-color-title;
background-color: $ck-w2-bgcolor-title; background-color: $ck-w2-bgcolor-title;
@ -229,20 +226,18 @@ $ck-color-list: #000000;
font-size: $ck-w2-font-size-txt; font-size: $ck-w2-font-size-txt;
color: $ck-w2-color-txt; color: $ck-w2-color-txt;
text-align: center; text-align: center;
line-height: 1.2;
} }
#ldcweb-cn-modal .modal-title > div a:hover, #ldcweb-cn-modal .modal-title > div a:hover,
#ldcweb-cn-modal .modal-all a:hover #ldcweb-cn-modal .modal-all a:hover
{color: $ck-w2-color-href-hover;} {color: $ck-w2-color-href-hover;}
/* TITLE */ /* TITLE */
#ldcweb-cn-modal .modal-wrapper .modal-title{padding: 4vw 4vw 0;} #ldcweb-cn-modal .modal-wrapper .modal-title{padding: 4vw;}
#ldcweb-cn-modal .modal-title .title{ #ldcweb-cn-modal .modal-title .title{
font-family: $ck-w2-font-family-title; font-family: $ck-w2-font-family-title;
font-size: $ck-w2-font-size-title; font-size: $ck-w2-font-size-title;
font-weight: bold; font-weight: bold;
color: $ck-w2-color-title; color: $ck-w2-color-title;
text-align: center; text-align: center;
line-height: 1.2;
} }
#ldcweb-cn-modal .modal-title .title::after, #ldcweb-cn-modal .modal-title .title::after,
#ldcweb-cn-modal .modal-title > div::after{ #ldcweb-cn-modal .modal-title > div::after{
@ -315,15 +310,15 @@ $ck-color-list: #000000;
font-family: $ck-font-family-list; font-family: $ck-font-family-list;
font-size: $ck-font-size-list; font-size: $ck-font-size-list;
color: $ck-color-list; color: $ck-color-list;
line-height: 1.2;
} }
#ldcweb-cn-modal .modal-details li a:hover{color:$secondary;} #ldcweb-cn-modal .modal-details li a:hover{color:$secondary-color;}
#ldcweb-cn-modal .modal-details .ldcweb-cn-infos{ #ldcweb-cn-modal .modal-details .ldcweb-cn-infos{
display: flex; display: flex;
flex-direction: column; flex-direction: column;
flex: 1;
} }
#ldcweb-cn-modal .modal-details .ldcweb-cn-infos span:first-of-type{ #ldcweb-cn-modal .modal-details .ldcweb-cn-infos span:first-of-type{
font-size: calc(#{$ck-font-size-list} * 1.25); font-size: calc($ck-font-size-list * 1.25);
font-weight: bold; font-weight: bold;
} }
#ldcweb-cn-modal .modal-details .ldcweb-cn-infos a{width: fit-content;} #ldcweb-cn-modal .modal-details .ldcweb-cn-infos a{width: fit-content;}
@ -390,7 +385,10 @@ $ck-color-list: #000000;
padding-bottom: 4vw; padding-bottom: 4vw;
} }
#ldcweb-cn .btns {flex-direction: row;} #ldcweb-cn .btns {flex-direction: row;}
#ldcweb-cn .btns .btn:first-child {margin: 0 2vw 0 0;} #ldcweb-cn .btns > div:first-child,
#ldcweb-cn .btns > div:last-child
{margin-top: 0;}
#ldcweb-cn .btns > div:not(:last-child) {margin: 0 2vw 0 0;}
/* MODAL */ /* MODAL */
#ldcweb-cn-modal .modal-wrapper{width: 90vw;} #ldcweb-cn-modal .modal-wrapper{width: 90vw;}
@ -430,14 +428,26 @@ $ck-color-list: #000000;
@media only screen and (min-width:1024px) { @media only screen and (min-width:1024px) {
#ldcweb-cn .ldcweb-cn-banner{ #ldcweb-cn .ldcweb-cn-banner{
flex-direction: row; flex-direction: row;
align-items: flex-start;
justify-content: space-between; justify-content: space-between;
padding: 2vw 3vw; padding: 2vw 3vw;
} }
#ldcweb-cn .ldcweb-cn-banner div:not(:last-child){margin: 0 0 2vw 0;} #ldcweb-cn .ldcweb-cn-banner div:not(:last-child){margin: 0 0 .5em 0;}
#ldcweb-cn .ldcweb-cn-banner > div:not(:last-child){margin: 0 4vw 0 0;} #ldcweb-cn .ldcweb-cn-banner > div:not(:last-child){margin: 0 4vw 0 0;}
#ldcweb-cn .ldcweb-cn-banner .banner-img{
height: 100%;
display: flex;
align-items: center;
}
#ldcweb-cn .banner-img img{height: fit-content;}
#ldcweb-cn .banner-txt{text-align: start;} #ldcweb-cn .banner-txt{text-align: start;}
#ldcweb-cn .btns {flex-direction: column;} #ldcweb-cn .btns {
#ldcweb-cn .btns .btn:first-child {margin: 0 0 1vw;} height: 100%;
flex-direction: column;
justify-content: center;
}
#ldcweb-cn .btns > div:first-child .btn{margin: 0;}
/* MODAL */ /* MODAL */
#ldcweb-cn-modal .modal-wrapper{width: 80vw;} #ldcweb-cn-modal .modal-wrapper{width: 80vw;}
#ldcweb-cn-modal .modal-btn-close{ #ldcweb-cn-modal .modal-btn-close{
@ -445,7 +455,7 @@ $ck-color-list: #000000;
height: 3vw; height: 3vw;
} }
/* TITLE */ /* TITLE */
#ldcweb-cn-modal .modal-wrapper .modal-title{padding: 2vw 2vw 0;} #ldcweb-cn-modal .modal-wrapper .modal-title{padding: 2vw;}
#ldcweb-cn-modal .modal-title .title::after, #ldcweb-cn-modal .modal-title .title::after,
#ldcweb-cn-modal .modal-title > div::after{margin: 2vw auto;} #ldcweb-cn-modal .modal-title > div::after{margin: 2vw auto;}
/* ALL */ /* ALL */
@ -492,9 +502,7 @@ $ck-color-list: #000000;
/* * * */ /* * * */
/* ***************** */ /* ***************** */
@media only screen and (min-width: 1440px) { @media only screen and (min-width: 1440px) {
#ldcweb-cn .banner-img{flex: 1;}
#ldcweb-cn .col{flex: 4;} #ldcweb-cn .col{flex: 4;}
#ldcweb-cn .btns {flex: 1;}
/* MODAL */ /* MODAL */
#ldcweb-cn-modal .modal-wrapper{width: 60vw;} #ldcweb-cn-modal .modal-wrapper{width: 60vw;}
#ldcweb-cn-modal .modal-btn-close{ #ldcweb-cn-modal .modal-btn-close{
@ -528,9 +536,9 @@ $ck-color-list: #000000;
/* * *** */ /* * *** */
/* ************ */ /* ************ */
@media only screen and (min-width: 1920px) { @media only screen and (min-width: 1920px) {
#ldcweb-cn p{font-size: calc(#{$ck-w1-font-size-txt} * 1.25);} #ldcweb-cn p{font-size: calc($ck-w1-font-size-txt * 1.25);}
#ldcweb-cn .banner-title p{font-size: calc(#{$ck-w1-font-size-title} * 1.25);} #ldcweb-cn .banner-title p{font-size: calc($ck-w1-font-size-title * 1.25);}
#ldcweb-cn .btns .btn {font-size: calc(#{$ck-w1-font-size-btn-txt} * 1.25);} #ldcweb-cn .btns .btn {font-size: calc($ck-w1-font-size-btn-txt * 1.25);}
/* MODAL */ /* MODAL */
#ldcweb-cn-modal .modal-wrapper{width: 50vw;} #ldcweb-cn-modal .modal-wrapper{width: 50vw;}
@ -542,10 +550,10 @@ $ck-color-list: #000000;
#ldcweb-cn-modal .modal-title > div a, #ldcweb-cn-modal .modal-title > div a,
#ldcweb-cn-modal .modal-all p, #ldcweb-cn-modal .modal-all p,
#ldcweb-cn-modal .modal-all a #ldcweb-cn-modal .modal-all a
{font-size: calc(#{$ck-w2-font-size-txt} * 1.25);} {font-size: calc($ck-w2-font-size-txt * 1.25);}
/* TITLE */ /* TITLE */
#ldcweb-cn-modal .modal-wrapper .modal-title{padding: 1vw 1vw 0;} #ldcweb-cn-modal .modal-wrapper .modal-title{padding: 1vw;}
#ldcweb-cn-modal .modal-title .title{font-size: calc(#{$ck-w2-font-size-title} * 1.25);} #ldcweb-cn-modal .modal-title .title{font-size: calc($ck-w2-font-size-title * 1.25);}
#ldcweb-cn-modal .modal-title .title::after, #ldcweb-cn-modal .modal-title .title::after,
#ldcweb-cn-modal .modal-title > div::after{margin: 1vw auto;} #ldcweb-cn-modal .modal-title > div::after{margin: 1vw auto;}
/* ALL */ /* ALL */
@ -563,8 +571,8 @@ $ck-color-list: #000000;
#ldcweb-cn-modal .modal-details li span, #ldcweb-cn-modal .modal-details li span,
#ldcweb-cn-modal .modal-details li a, #ldcweb-cn-modal .modal-details li a,
#ldcweb-cn-modal .modal-details li label #ldcweb-cn-modal .modal-details li label
{font-size: calc(#{$ck-font-size-list} * 1.25);} {font-size: calc($ck-font-size-list * 1.25);}
#ldcweb-cn-modal .modal-details .ldcweb-cn-infos span:first-of-type{font-size: calc(#{$ck-font-size-list} * 1.5);} #ldcweb-cn-modal .modal-details .ldcweb-cn-infos span:first-of-type{font-size: calc($ck-font-size-list * 1.5);}
#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{ #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;

View file

@ -49,6 +49,6 @@
@endpush @endpush
@push('scripts') @push('scripts')
<script src="https://maps.googleapis.com/maps/api/js?key={{ config('gmap.apiKey') }}&callback=initMap"></script> <script src="https://maps.googleapis.com/maps/api/js?key={{ config('google.apiKey') }}&callback=initMap"></script>
<script src="{{ asset('js/oms-min.js') }}"></script> <script src="{{ asset('js/oms-min.js') }}"></script>
@endpush @endpush

View file

@ -56,6 +56,6 @@
@endpush @endpush
@push('scripts') @push('scripts')
<script src="https://maps.googleapis.com/maps/api/js?key={{ config('gmap.apiKey') }}&callback=initMap"></script> <script src="https://maps.googleapis.com/maps/api/js?key={{ config('google.apiKey') }}&callback=initMap"></script>
<script src="{{ asset('js/oms-min.js') }}"></script> <script src="{{ asset('js/oms-min.js') }}"></script>
@endpush @endpush

View file

@ -1,81 +1,87 @@
<div id="ldcweb-cn"> <div id="ldcweb-cn">
<div id="ldcweb-banner" class="ldcweb-cn-banner"> <div id="ldcweb-banner" class="ldcweb-cn-banner">
<div class="banner-img"> <div class="banner-img">
@desktop @desktop
<picture> <picture>
<source srcset="{{ asset('assets/images/logo-lgl_378.webp') }}" type="image/webp"> <source srcset="{{ asset('assets/images/logo-lgl_378.webp') }}" type="image/webp">
<img src="{{ asset('assets/images/logo-lgl_378.png') }}" alt="{{ __('Logo - Le Gaulois') }}"> <img src="{{ asset('assets/images/logo-lgl_378.png') }}" alt="{{ __('Logo - Le Gaulois') }}">
</picture> </picture>
@else @else
<picture> <picture>
<source srcset="{{ asset('assets/images/logo-lgl_289.webp') }}" type="image/webp"> <source srcset="{{ asset('assets/images/logo-lgl_289.webp') }}" type="image/webp">
<img src="{{ asset('assets/images/logo-lgl_289.png') }}" alt="{{ __('Logo - Le Gaulois') }}"> <img src="{{ asset('assets/images/logo-lgl_289.png') }}" alt="{{ __('Logo - Le Gaulois') }}">
</picture> </picture>
@enddesktop @enddesktop
</div> </div>
<div class="col"> <div class="col">
<div class="banner-title"> <div class="banner-title">
<p aria-level="h1">{{ __('Le respect de votre vie privée est notre priorité') }}</p> <p aria-level="h1">{{ __('Le respect de votre vie privée est notre priorité') }}</p>
</div> </div>
<div class="banner-txt"> <div class="banner-txt">
<p>{{__('Nous utilisons différentes technologies, telles que celle des cookies, et traitons vos données à caractère personnel, telles que les adresses IP et les identifiants de cookie, afin de personnaliser les contenus en fonction de vos centres d’intérêt, d’évaluer la performance de ce site et de recueillir des informations sur les publics qui l’ont visionné. Ces cookies sont nécessaires pour assurer le fonctionnement optimal du site et sont donc activés en permanence. Les cookies de Google Analytics permettent de stocker l\'adresse des pages consultées, les dates et heures des visites, tout ceci à des fins de mesure d’audience. Un cookie tiers est installé dans le cadre de l\'utilisation de ReCaptcha de Google lors de l\'envoi des formulaires de contact. Ce cookie sert à vérifier que le formulaire est bien complété par un internaute et non un robot. Cliquez sur "OK, TOUT ACCEPTER" si vous consentez à l’utilisation de cette technologie et au traitement de vos données à caractère personnel en vue de ces objectifs. Vous pouvez changer d’avis et modifier votre consentement à tout moment en revenant sur ce site.') }} <p>Ce site web stocke les cookies sur votre ordinateur. LDC utilise ces informations afin d’améliorer et de personnaliser votre expérience de navigation, ainsi que pour l'analyse et les indicateurs concernant nos visiteurs à la fois sur ce site web et sur d'autres supports.
<br> <br>Vous pouvez cliquer sur « Accepter » si vous consentez à l’utilisation de ces cookies.
{!! __('Vous pouvez cliquer sur ce lien pour accéder à notre politique de confidentialité.', [ <br>Si vous refusez l'utilisation des cookies, vos informations ne seront pas suivies lors de votre visite sur ce site. Un cookie sera utilisé dans votre navigateur afin de se souvenir de ne pas suivre vos préférences. Certaines fonctionnalités ne seront pas accessibles.
'a' => "<a href='{{ route('legal-notice') }}'>", <br>Vous pouvez changer d’avis et modifier votre consentement à tout moment en revenant sur ce site.
'enda' => "</a>" <br>Pour en savoir plus sur les cookies que nous utilisons, consultez notre <a href="/politique-de-confidentialite/">politique de confidentialité</a>.
]) !!} <br></p>
</div>
<br><a href="{{ route('legal-notice') }}"></a>
</p>
</div>
</div> </div>
<div class="btns"> <div class="btns">
<a href="#" id="ldcweb-cn-accept-banner" class="btn ldcweb-cn-accept">{{__('OK, TOUT ACCEPTER') }}</a> <div>
<a href="#" class="btn ldcweb-cn-personalize">{{__('Personnaliser') }}</a> <a href="#" id="ldcweb-cn-accept-banner" class="btn ldcweb-cn-accept">OK, TOUT ACCEPTER</a>
</div>
<div>
<a href="#" id="ldcweb-cn-deny-banner" class="btn ldcweb-cn-deny">TOUT REFUSER</a>
</div>
<div>
<a href="#" class="btn ldcweb-cn-personalize">Personnaliser</a>
</div>
</div> </div>
</div> </div>
<div id="ldcweb-cn-modal"> <div id="ldcweb-cn-modal">
<div class="modal-wrapper"> <div class="modal-wrapper">
<div class="modal-btn-close"><a href="#" id="close-link">X</a></div> <div class="modal-btn-close"><a href="#" id="close-link">X</a></div>
<div class="modal-title"> <div class="modal-title">
<p class="title" aria-level="h2">{{__('Panneau de gestion des cookies') }}</p> <p class="title" aria-level="h2">{{__('Panneau de gestion des cookies') }}</p>
<p class="description">{{__('En autorisant ces services tiers, vous acceptez le dépôt et la lecture de cookies et l\'utilisation de technologies de suivi nécessaires à leur bon fonctionnement.') }}</p> <p class="description">Les fonctionnalités de ce site s’appuient sur des services proposés par des tiers.
<div><a href="{{ route('legal-notice') }}">{{ __('Politique de confidentialité') }}</a></div> <br>Si vous acceptez, ces tiers déposeront des cookies qui vous permettront de visualiser sur le site du contenu hébergé par ces tiers.
</div> <br>Via ces cookies, ces tiers collecteront et utiliseront vos données de navigation pour des finalités qui leur sont propres, conformément à leur politique de confidentialité (lien ci-dessous). Cette page vous permet de donner ou de retirer votre consentement, soit globalement soit service par service.
<div class="modal-all"> </p>
<p>{{__('Préférence pour tous les services') }}</p> <div><a href="{{ route('legal-notice') }}">{{ __('Politique de confidentialité') }}</a></div>
<div class="all-buttons">
<div class="accept"><a href="#" id="ldcweb-cn-accept">{{__('Autoriser tous les cookies') }}</a></div>
<div class="deny"><a href="#" id="ldcweb-cn-deny">{{__('Interdire tous les cookies') }}</a></div>
</div> </div>
</div> <div class="modal-all">
<div class="modal-details"> <p>{{__('Préférence pour tous les services') }}</p>
<ul id="ldcweb-cn-list"> <div class="all-buttons">
</ul> <div class="accept"><a href="#" id="ldcweb-cn-accept">{{__('Autoriser tous les cookies') }}</a></div>
<div id="template"> <div class="deny"><a href="#" id="ldcweb-cn-deny">{{__('Interdire tous les cookies') }}</a></div>
<div> </div>
<div class="ldcweb-cn-infos"> </div>
<span class="ldcweb-cn-name"></span> <div class="modal-details">
<span class="ldcweb-cn-description"></span> <ul id="ldcweb-cn-list">
<a class="ldcweb-cn-link" href="#"></a> </ul>
</div> <div id="template">
<div class="ldcweb-cn-buttons"> <div>
<div class="accept"> <div class="ldcweb-cn-infos">
<input type="radio" id="analytics1" name="analytics" data-name="analytics" data-status="true"> <span class="ldcweb-cn-name"></span>
<label for="analytics1">{{ __('Autoriser') }}</label> <span class="ldcweb-cn-description"></span>
</div> <a class="ldcweb-cn-link" href="#"></a>
<div class="deny"> </div>
<input type="radio" id="analytics2" name="analytics" data-name="analytics" data-status="false"> <div class="ldcweb-cn-buttons">
<label for="analytics2">{{ __('Interdire') }}</label> <div class="accept" id="accept-btn">
</div> <input type="radio" id="analytics1" name="analytics" data-name="analytics" data-status="true">
<label for="analytics1">{{ __('Autoriser') }}</label>
</div>
<div class="deny" id="deny-btn">
<input type="radio" id="analytics2" name="analytics" data-name="analytics" data-status="false">
<label for="analytics2">{{ __('Interdire') }}</label>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div>
</div> </div>
</div> </div>
@push('scripts') @push('scripts')
<script> <script>
window.LDCWebCN = new LdcwebCn({ window.LDCWebCN = new LdcwebCn({
@ -83,17 +89,17 @@
'name': "Google Analytics", 'name': "Google Analytics",
'description': 'Service d\'analyse d\'audience', 'description': 'Service d\'analyse d\'audience',
'link': 'https://support.google.com/analytics/answer/6004245', 'link': 'https://support.google.com/analytics/answer/6004245',
'cookies': ['_ga', '_gat_gtag_{{ str_replace('-','_', env('ANALYTICS_GOOGLE_ID')) }}', '_gid'], 'cookies': ['_ga', '_gat_gtag_{{ str_replace('-','_', config('google.analyticsKey')) }}', '_gid'],
'script': function () { 'script': function () {
(function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0]; (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
g.src='https://www.googletagmanager.com/gtag/js?id={{ env('ANALYTICS_GOOGLE_ID') }}';g.id='analytics'; g.src='https://www.googletagmanager.com/gtag/js?id={{ config('google.analyticsKey') }}';g.id='analytics';
s.parentNode.insertBefore(g,s)}(document,'script')); s.parentNode.insertBefore(g,s)}(document,'script'));
window.dataLayer = window.dataLayer || []; window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);} function gtag(){dataLayer.push(arguments);}
gtag('js', new Date()); gtag('js', new Date());
gtag('config', '{{ env('ANALYTICS_GOOGLE_ID') }}'); gtag('config', '{{ config('google.analyticsKey') }}');
}, },
} }
}); });

View file

@ -55,7 +55,7 @@
<span>© Copyright Le Gaulois</span> <span>© Copyright Le Gaulois</span>
<a href="{{ route('legal-notice') }}">{{__('Mentions légales') }}</a> <a href="{{ route('legal-notice') }}">{{__('Mentions légales') }}</a>
<a href="{{ route('chart-conf') }}">{{__('Charte de Confidentialité') }}</a> <a href="{{ route('chart-conf') }}">{{__('Charte de Confidentialité') }}</a>
<a href="#" id="cookieNotice" rel="nofollow noindex">{{ __('Gestion des cookies') }}</a> <a href="#" class="ldcweb-cn-cookie-link" rel="nofollow noindex">{{ __('Gestion des cookies') }}</a>
</p> </p>
</div> </div>
</footer> </footer>

View file

@ -12,7 +12,7 @@
@yield('content') @yield('content')
@include('layouts.app-footer') @include('layouts.app-footer')
</div> </div>
@if(env('ANALYTICS_GOOGLE_ID')) @if(config('google.analyticsKey'))
@include('front.webldc-cn') @include('front.webldc-cn')
@endif @endif
@stack('scriptsConstants') @stack('scriptsConstants')