From 3f8903605452463ea1c1c6eb51e4b05b1674d89e Mon Sep 17 00:00:00 2001 From: Olivier Legat Date: Thu, 19 May 2022 14:45:40 +0000 Subject: [PATCH] T890 893 newcookies --- .env.example | 4 +- config/google.php | 5 + resources/js/frontend/ldcweb-cn.js | 240 +++--- resources/lang/en/rgpd.php | 11 +- resources/lang/es/rgpd.php | 13 +- resources/lang/fr/rgpd.php | 41 +- resources/sass/frontend/cookies-ldc.scss | 767 ++++++++---------- .../views/layouts/frontend/cookie.blade.php | 197 +++-- 8 files changed, 652 insertions(+), 626 deletions(-) create mode 100644 config/google.php diff --git a/.env.example b/.env.example index 12d4487..067166f 100644 --- a/.env.example +++ b/.env.example @@ -32,4 +32,6 @@ MAIL_FROM_ADDRESS=null MAIL_FROM_NAME="${APP_NAME}" MAIL_LIST_SERVICEWEB= -MAIL_LIST_CONTACTFORM= \ No newline at end of file +MAIL_LIST_CONTACTFORM= + +ANALYTICS_GOOGLE_ID= diff --git a/config/google.php b/config/google.php new file mode 100644 index 0000000..7575aec --- /dev/null +++ b/config/google.php @@ -0,0 +1,5 @@ + env('ANALYTICS_GOOGLE_ID') +]; diff --git a/resources/js/frontend/ldcweb-cn.js b/resources/js/frontend/ldcweb-cn.js index 155fc84..8d3a8f4 100644 --- a/resources/js/frontend/ldcweb-cn.js +++ b/resources/js/frontend/ldcweb-cn.js @@ -3,71 +3,68 @@ * Version 1.3 */ -export class LdcwebCn { + export class LdcwebCn { constructor(config) { this.config = config; this.cookieContainer = document.getElementById("ldcweb-cn"); - this.bannerContainer = document.getElementById("ldcweb-banner"); + this.bannerContainer = document.querySelector(".ldcweb-cn-banner"); + this.bannerBtn = document.querySelector(".ldcweb-banner-btnDetails-p"); + this.ldcwebBtn = document.querySelector(".ldcweb-btn"); + this.ldcwebBannerParaP = document.querySelector( + ".ldcweb-banner-para-p" + ); + this.ldcwebBannerContent = document.querySelector( + ".ldcweb-banner-content" + ); + this.ldcwebBannerDetails = document.querySelector( + ".ldcweb-banner-details" + ); + this.ldcwebBannerBtnDetails = document.querySelector( + ".ldcweb-banner-btnDetails" + ); this.modalContainer = document.getElementById("ldcweb-cn-modal"); - this.modalCloseBtn = document.getElementById("close-link"); this.acceptAllBtnBanner = document.getElementById( "ldcweb-cn-accept-banner" ); - this.denyAllBtnBanner = document.getElementById("ldcweb-cn-deny-banner"); - this.acceptAllBtn = document.getElementById("ldcweb-cn-accept"); - this.denyAllBtn = document.getElementById("ldcweb-cn-deny"); + this.denyAllBtnBanner = document.getElementById( + "ldcweb-cn-deny-banner" + ); this.personalizeBtn = document.getElementsByClassName( "ldcweb-cn-personalize" ); + this.personalizeBtnBanner = document.querySelector( + ".ldcweb-cn-personalize" + ); this.changeBtn = document.getElementsByClassName("ldcweb-cn-change"); this.cookiesList = document.getElementById("ldcweb-cn-list"); - this.cookieLink = document.getElementsByClassName("ldcweb-cn-cookie-link"); + this.cookieLink = document.querySelector(".ldcweb-cn-cookie-link"); + this.modalDetails = document.querySelector(".modal-details"); this.template = document.getElementById("template").cloneNode(true); + this.modalBtnBoolean = 0; + this.bannerBtnTextBoolean = 0; document.getElementById("template").remove(); let cookies = this.getLDCWebCookie("ldcwebcn-init"); if (cookies === undefined) { let newCookie = []; - for (const [key, value] of Object.entries(this.config)) { + for (const [key] of Object.entries(this.config)) { newCookie.push(key + "=wait"); } + this.bannerContainer.classList.add("ldcweb-cn-banner-open"); + this.saveLDCWebCookie(newCookie); - this.cookieContainer.classList.add("open-banner"); } else { let test = cookies.split(","); - test.forEach((elm) => { + test.forEach(elm => { let test = elm.split("="); if (test[1] === "wait") { - this.cookieContainer.classList.add("open-banner"); + this.bannerContainer.classList.add("ldcweb-cn-banner-open"); } }); } - this.modalCloseBtn.addEventListener( - "click", - function (e) { - e.preventDefault(); - let cookies = this.getLDCWebCookie("ldcwebcn-init"); - let test = cookies.split(","); - let bIsCompleted = true; - for (let item of test) { - if (item.indexOf("=wait") !== -1) { - bIsCompleted = false; - break; - } - } - if (bIsCompleted) { - this.cookieContainer.classList.remove("open-modal"); - this.cookieContainer.classList.remove("open-banner"); - } else { - alert( - "Vous devez renseigner votre choix pour tous les cookies, svp." - ); - } - }.bind(this) - ); - let accept = function (e) { + let accept = function(e) { e.preventDefault(); for (const [key, value] of Object.entries(this.config)) { this.addCookie(key, value); @@ -83,13 +80,11 @@ export class LdcwebCn { denyLabel.classList.remove("active"); } this.updateAllCookiesButtonsActiveStatus(); - this.cookieContainer.classList.remove("open-modal"); - this.cookieContainer.classList.remove("open-banner"); + this.bannerContainer.classList.remove("ldcweb-cn-banner-open"); }.bind(this); this.acceptAllBtnBanner.addEventListener("click", accept); - this.acceptAllBtn.addEventListener("click", accept); - let deny = function (e) { + let deny = function(e) { e.preventDefault(); for (const [key, value] of Object.entries(this.config)) { this.removeCookie(key, value); @@ -105,65 +100,126 @@ export class LdcwebCn { denyLabel.classList.add("active"); } this.updateAllCookiesButtonsActiveStatus(); - this.cookieContainer.classList.remove("open-modal"); - this.cookieContainer.classList.remove("open-banner"); + this.bannerContainer.classList.remove("ldcweb-cn-banner-open"); }.bind(this); this.denyAllBtnBanner.addEventListener("click", deny); - this.denyAllBtn.addEventListener("click", deny); - for (let item of this.cookieLink) { - this.addEvent( - item, - "click", - function (e) { - e.preventDefault(); - this.openModal(); - }.bind(this) + let openLdcwebCookies = function(e) { + e.preventDefault(); + this.bannerContainer.classList.add("ldcweb-cn-banner-open"); + this.ldcwebBannerContent.classList.add("visibility"); + this.ldcwebBannerDetails.classList.add("visibility"); + this.ldcwebBannerBtnDetails.classList.add("visibility"); + this.modalContainer.classList.remove("visibility"); + this.personalizeBtnBanner.innerHTML = this.personalizeBtnBanner.getAttribute( + "data-open-modal" ); - } + this.modalBtnBoolean = 1; + this.modalDetails.scrollTop = 0; + this.openModal(); + }.bind(this); + this.cookieLink.addEventListener("click", openLdcwebCookies); - for (let item of this.personalizeBtn) { - this.addEvent( - item, - "click", - function (e) { - e.preventDefault(); - this.setCookieList(); - }.bind(this) - ); - } + let hideModal = function(e) { + e.preventDefault(); + this.ldcwebBannerContent.classList.toggle("visibility"); + this.ldcwebBannerDetails.classList.toggle("visibility"); + this.ldcwebBannerBtnDetails.classList.toggle("visibility"); + this.modalContainer.classList.toggle("visibility"); + this.setCookieList(); + }.bind(this); + this.personalizeBtnBanner.addEventListener("click", hideModal); + + let changeBtnPersonalize = function(e) { + e.preventDefault(); + this.modalDetails.scrollTop = 0; + if (this.modalBtnBoolean === 0) { + this.personalizeBtnBanner.innerHTML = this.personalizeBtnBanner.getAttribute( + "data-open-modal" + ); + this.modalBtnBoolean = 1; + } else { + this.personalizeBtnBanner.innerHTML = this.personalizeBtnBanner.getAttribute( + "data-close-modal" + ); + this.modalBtnBoolean = 0; + } + }.bind(this); + this.personalizeBtnBanner.addEventListener( + "click", + changeBtnPersonalize + ); this.setListenerOnChange(); let cookie = this.getLDCWebCookie("ldcwebcn-init"); let test = cookie.split(","); - test.forEach((elm) => { + test.forEach(elm => { let test = elm.split("="); if (test[1] === "true") { this.config[test[0]].script(); - } else { - if (this.config[test[0]].fallback !== undefined) { - this.config[test[0]].fallback(); - } } }); this.updateAllCookiesButtonsActiveStatus(); + + let changePara = function(e) { + e.preventDefault(); + this.ldcwebBannerDetails.classList.toggle( + "ldcweb-banner-details-open" + ); + this.bannerBtn.classList.toggle("ldcweb-banner-btnDetails-p-open"); + if (this.bannerBtnTextBoolean === 0) { + e.target.innerHTML = e.target.getAttribute("data-open"); + this.ldcwebBannerParaP.innerHTML = this.ldcwebBannerParaP.getAttribute( + "data-open" + ); + this.ldcwebBannerDetails.style.height = + this.ldcwebBannerDetails.children[0].clientHeight + "px"; + this.bannerBtnTextBoolean = 1; + } else { + e.target.innerHTML = e.target.getAttribute("data-close"); + this.ldcwebBannerParaP.innerHTML = this.ldcwebBannerParaP.getAttribute( + "data-close" + ); + this.ldcwebBannerDetails.style.height = "0px"; + this.bannerBtnTextBoolean = 0; + } + }.bind(this); + this.bannerBtn.addEventListener("click", changePara); + + let resetVue = function(e) { + e.preventDefault(); + this.bannerContainer.classList.toggle("ldcweb-cn-banner-open"); + if ( + this.bannerContainer.classList.contains("ldcweb-cn-banner-open") + ) { + this.ldcwebBannerContent.classList.remove("visibility"), + this.ldcwebBannerDetails.classList.remove("visibility"), + this.ldcwebBannerBtnDetails.classList.remove("visibility"), + this.modalContainer.classList.add("visibility"); + this.personalizeBtnBanner.innerHTML = this.personalizeBtnBanner.getAttribute( + "data-close-modal" + ); + this.modalBtnBoolean = 0; + } + }.bind(this); + this.ldcwebBtn.addEventListener("click", resetVue); } setCookieList() { this.cookiesList.innerHTML = ""; let cookiesSite = this.getLDCWebCookie("ldcwebcn-init"); - let acceptInputEvent = function (acceptLabel, denyLabel, key, value) { - return function (e) { + let acceptInputEvent = function(acceptLabel, denyLabel, key, value) { + return function() { acceptLabel.classList.add("active"); denyLabel.classList.remove("active"); this.updateAllCookiesButtonsActiveStatus(); this.addCookie(key, value); }.bind(this, [acceptLabel, denyLabel, key, value]); }; - let denyInputEvent = function (acceptLabel, denyLabel, key, value) { - return function (e) { + let denyInputEvent = function(acceptLabel, denyLabel, key, value) { + return function() { acceptLabel.classList.remove("active"); denyLabel.classList.add("active"); this.updateAllCookiesButtonsActiveStatus(); @@ -175,7 +231,9 @@ export class LdcwebCn { let cookie = document.createElement("li"); cookie.append(this.template.children.item(0).cloneNode(true)); let name = cookie.querySelector("span.ldcweb-cn-name"); - let description = cookie.querySelector("span.ldcweb-cn-description"); + let description = cookie.querySelector( + "span.ldcweb-cn-description" + ); let link = cookie.querySelector("a.ldcweb-cn-link"); let acceptInput = cookie.querySelector(".accept > input"); let denyInput = cookie.querySelector(".deny > input"); @@ -197,7 +255,12 @@ export class LdcwebCn { acceptInput.addEventListener( "click", - acceptInputEvent.apply(this, [acceptLabel, denyLabel, key, value]) + acceptInputEvent.apply(this, [ + acceptLabel, + denyLabel, + key, + value + ]) ); denyInput.addEventListener( "click", @@ -222,41 +285,34 @@ export class LdcwebCn { break; } } - if (status === "wait") { - this.cookieContainer.classList.add("open-banner"); - } } } - - this.cookieContainer.classList.add("open-modal"); this.setListenerOnChange(); } updateAllCookiesButtonsActiveStatus() { - let acceptsButtons = - this.cookieContainer.querySelectorAll("div.accept > label"); - let deniesButtons = - this.cookieContainer.querySelectorAll("div.deny > label"); + let acceptsButtons = this.cookieContainer.querySelectorAll( + "div.accept > label" + ); + let deniesButtons = this.cookieContainer.querySelectorAll( + "div.deny > label" + ); let activeAcceptsButtons = this.cookieContainer.querySelectorAll( - "div.accept > label.active" + "div.accept > label.active" ); let activeDeniesButtons = this.cookieContainer.querySelectorAll( "div.deny > label.active" ); - this.acceptAllBtn.classList.remove("active"); - this.denyAllBtn.classList.remove("active"); if ( acceptsButtons.length && acceptsButtons.length === activeAcceptsButtons.length ) { - this.acceptAllBtn.classList.add("active"); } if ( deniesButtons.length && deniesButtons.length === activeDeniesButtons.length ) { - this.denyAllBtn.classList.add("active"); } } @@ -278,8 +334,8 @@ export class LdcwebCn { } setListenerOnChange() { this.changeBtn = document.getElementsByClassName("ldcweb-cn-change"); - let itemClick = function (item) { - return function () { + let itemClick = function(item) { + return function() { this.changeStatus( item.getAttribute("data-name"), item.getAttribute("data-status") @@ -296,12 +352,12 @@ export class LdcwebCn { let cookie = this.getLDCWebCookie("ldcwebcn-init"); let test = cookie.split(","); - test.forEach((elm) => { + test.forEach(elm => { let test = elm.split("="); if (test[0] === name) { newCookie.push(name + "=" + status); if (status === "false") { - this.config[test[0]].cookies.forEach((elm) => { + this.config[test[0]].cookies.forEach(elm => { let cookies = this.getLDCWebCookie(elm); if (cookies !== undefined) { document.cookie = @@ -340,8 +396,8 @@ export class LdcwebCn { let matches = document.cookie.match( new RegExp( "(?:^|; )" + - name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, "\\$1") + - "=([^;]*)" + name.replace(/([\.$?*|{}\(\)\[\]\\\/\+^])/g, "\\$1") + + "=([^;]*)" ) ); return matches ? decodeURIComponent(matches[1]) : undefined; diff --git a/resources/lang/en/rgpd.php b/resources/lang/en/rgpd.php index 1b3d53b..a671846 100644 --- a/resources/lang/en/rgpd.php +++ b/resources/lang/en/rgpd.php @@ -8,7 +8,14 @@ return array ( ), 'banner' => array ( - 'desc' => '', + 'desc' => + array ( + 'introclose' => '', + 'introopen' => '', + 'more' => '', + ), + 'lessdetails' => '', + 'moredetails' => '', 'title' => '', ), 'contact' => @@ -27,11 +34,13 @@ return array ( 'allowall' => '', 'denyall' => '', 'personalize' => '', + 'return' => '', 'settignsall' => '', ), 'manage' => array ( 'explain' => '', + 'subtitle' => '', 'title' => '', ), ); diff --git a/resources/lang/es/rgpd.php b/resources/lang/es/rgpd.php index 9529253..a671846 100644 --- a/resources/lang/es/rgpd.php +++ b/resources/lang/es/rgpd.php @@ -4,11 +4,18 @@ return array ( 'analytics' => array ( 'desc' => '', - 'title' => '', + 'title' => 'Google Analytics', ), 'banner' => array ( - 'desc' => '', + 'desc' => + array ( + 'introclose' => '', + 'introopen' => '', + 'more' => '', + ), + 'lessdetails' => '', + 'moredetails' => '', 'title' => '', ), 'contact' => @@ -27,11 +34,13 @@ return array ( 'allowall' => '', 'denyall' => '', 'personalize' => '', + 'return' => '', 'settignsall' => '', ), 'manage' => array ( 'explain' => '', + 'subtitle' => '', 'title' => '', ), ); diff --git a/resources/lang/fr/rgpd.php b/resources/lang/fr/rgpd.php index 1537d66..1da62a9 100644 --- a/resources/lang/fr/rgpd.php +++ b/resources/lang/fr/rgpd.php @@ -1,44 +1,53 @@ + 'analytics' => array ( 'desc' => 'Les services de mesure d\'audience permettent de générer des statistiques de fréquentation utiles à l\'amélioration du site.', - 'title' => 'MESURES D\'AUDIENCE - Google Analytics', + 'title' => 'Google Analytics', ), - 'banner' => + 'banner' => array ( - 'desc' => '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. -
Vous pouvez cliquer sur « Accepter » si vous consentez à l\'utilisation de ces cookies. -
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. -
Vous pouvez changer d’avis et modifier votre consentement à tout moment en revenant sur ce site. -
Pour en savoir plus sur les cookies que nous utilisons, consultez notre politique de confidentialité.', - 'title' => 'Le respect de votre vie privée est notre priorité', + 'desc' => + array( + 'introclose' => 'Nous utilisons des cookies pour nous assurer du bon fonctionnement de notre site et à des fins analytiques. + En poursuivant votre navigation sur ce site ou en fermant ce bandeau, vous consentez à l’utilisation de ces cookies.', + 'introopen' => '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. +
Vous pouvez cliquer sur « Accepter » si vous consentez à l\'utilisation de ces cookies.', + 'more' => '
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. +
Vous pouvez changer d’avis et modifier votre consentement à tout moment en revenant sur ce site. +
Pour en savoir plus sur les cookies que nous utilisons, consultez notre politique de confidentialité.', + ), + 'title' => 'Le site Doux utilise des cookies!', + 'moredetails' => 'Plus de détails...', + 'lessdetails' => 'Moins de détails...', ), - 'contact' => + 'contact' => array ( 'acceptcgu' => 'J’accepte les conditions générales d’utilisation du site et autorise la Société Bretonne de Volaille à traiter mes données personnelles conformément à la Charte de confidentialité.', 'disclaimer' => 'Les informations que vous nous communiquez sont collectées et traitées par la Société Bretonne de Volaille, responsable de traitement selon les finalités définies dans notre Charte de confidentialité. Ces informations sont destinées au personnel de la Société Bretonne de Volaille et peuvent être partagées avec ses sous-traitants.
A tout moment, vous pouvez retirer votre consentement. Pour toute information complémentaire concernant vos données personnelles et vos droits, merci de consulter notre Charte de confidentialité.', ), - 'cookie' => + 'cookie' => array ( 'allow' => 'Autoriser', 'deny' => 'Interdire', ), - 'cookies' => + 'cookies' => array ( 'acceptall' => 'OK, TOUT ACCEPTER', - 'allowall' => 'Autoriser tous les cookies', - 'denyall' => 'Interdire tous les cookies', - 'personalize' => 'Personnaliser', + 'allowall' => 'TOUT ACCEPTER', + 'denyall' => 'TOUT REFUSER', + 'personalize' => 'PERSONNALISER', + 'return' => 'RETOUR', 'settignsall' => 'Préférence pour tous les services', ), - 'manage' => + 'manage' => array ( 'explain' => 'Les fonctionnalités de ce site s’appuient sur des services proposés par des tiers.
Si vous acceptez, ces tiers déposeront des cookies qui vous permettront de visualiser sur le site du contenu hébergé par ces tiers.
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.', 'title' => 'Panneau de gestion des cookies', + 'subtitle' => 'Le respect de votre vie privée est notre priorité', ), ); diff --git a/resources/sass/frontend/cookies-ldc.scss b/resources/sass/frontend/cookies-ldc.scss index ca2d6e4..66d4ee9 100644 --- a/resources/sass/frontend/cookies-ldc.scss +++ b/resources/sass/frontend/cookies-ldc.scss @@ -2,26 +2,36 @@ /* - Choix des FONTS */ /* - Changement des couleurs et des polices */ -:root{ +:root { /* PARTIE A RENSEIGNER */ - --primary-color: #d4021d; - --secondary-color: #707070; - --background-color: #ffffff; - --title-font: "Satisfy", sans-serif; - --title-size: 30px; + --primary-color: #0c1417; + --secondary-color: #ff0400; + --background-color: #fccf1d; + --shadow-color: 0 0.5rem 1rem rgb(0 0 0 / 35%); + --title-font: "barlow-bold", arial, sans-serif; + --title-size: 40px; --text-font: "Barlow", sans-serif; - --text-size: 16px; + --text-size: 14px; --accept-color: #33aa33; --deny-color: #aa3333; + /* Position et animation des cookies */ + --ldcweb-cn-position-left: 20px; /* Distance par rapport à la gauche de la fenêtre */ + --ldcweb-cn-position-right: auto; /* Distance par rapport à la droite de la fenêtre */ + --ldcweb-cn-animation-left: 0; /* Position gauche de base des cookies */ + --ldcweb-cn-animation-right: auto; /* Position droite de base des cookies */ + --ldcweb-cn-position-bottom: 20px; /* Distance par rapport au bas de la fenêtre */ + --ldcweb-cn-z-index: 200; + /* PARTIE A RENSEIGNER FACULTATIF */ /* FENETRE D'ACCUEIL */ --ck-bg-color: var(--background-color); + /* Title settings */ --ck-w1-bgcolor-title: var(--background-color); --ck-w1-font-family-title: var(--title-font); --ck-w1-font-size-title: var(--title-size); - --ck-w1-color-title: #000000; + --ck-w1-color-title: var(--secondary-color); /* Text settings */ --ck-w1-font-family-txt: var(--text-font); @@ -30,7 +40,7 @@ --ck-w1-color-href-hover: var(--secondary-color); /* Button settings */ - --ck-w1-color-btn: var(--primary-color); + --ck-w1-color-btn: var(--secondary-color); --ck-w1-color-btn-hover: var(--secondary-color); --ck-w1-font-family-btn-txt: var(--text-font); --ck-w1-font-size-btn-txt: var(--text-size); @@ -42,15 +52,15 @@ /* FENETRE DE PERSONNALISATION */ --ck-bg-color-modal-wrapper: #ffffff; /* Title settings */ - --ck-w2-bgcolor-title: var(--primary-color); + --ck-w2-bgcolor-title: var(--background-color); --ck-w2-font-family-title: var(--title-font); --ck-w2-font-size-title: var(--title-size); - --ck-w2-color-title: #ffffff; + --ck-w2-color-title: var(--secondary-color); /* Text settings */ --ck-w2-font-family-txt: var(--text-font); --ck-w2-font-size-txt: var(--text-size); - --ck-w2-color-txt: #ffffff; + --ck-w2-color-txt: var(--primary-color); --ck-w2-color-href-hover: #000000; /* Accept/Deny btn settings */ @@ -66,520 +76,427 @@ --ck-font-family-list: var(--text-font); --ck-font-size-list: var(--text-size); --ck-color-list: #000000; + --ck-color-title: var(--secondary-color); + + /* Scroll bar */ + --ck-scroll-bgcolor: var(--primary-color); + --ck-scroll-barcolor: var(--secondary-color); } /* FIN DU PARAMETRAGE */ /* MOBILE FIRST */ -#ldcweb-cn *,#ldcweb-cn *::before, #ldcweb-cn *::after { - padding: 0; - margin: 0; +#template { + display: none; +} +* { box-sizing: border-box; } -#template{display: none;} -#ldcweb-cn.open-banner .ldcweb-cn-banner{display: flex;} -#ldcweb-cn.open-modal #ldcweb-cn-modal{display: flex;} -#ldcweb-cn.open-banner, #ldcweb-cn.open-modal{display: flex;} -#ldcweb-cn { - display: none; - flex-direction: column; - justify-content: flex-end; - position: fixed; - left: 0; right: 0; - top: 0; bottom: 0; - width: 100%; height: 100%; - background: rgba(0, 0, 0, 0.7); - z-index: 99999999999; - opacity: 1; - line-height: initial; +#ldcweb-cn.open-banner .ldcweb-cn-banner { + display: flex; +} +#ldcweb-cn.open-banner, +#ldcweb-cn.open-modal { + display: flex; } - #ldcweb-cn p, -#ldcweb-cn a{ +#ldcweb-cn a { font-family: var(--ck-w1-font-family-txt); font-size: var(--ck-w1-font-size-txt); color: var(--ck-w1-color-txt); } -#ldcweb-cn a{ +#ldcweb-cn a { text-decoration: underline; - transition: color .5s; + transition: 0s; } -#ldcweb-cn a:hover{color: var(--ck-w1-color-href-hover);} -#ldcweb-cn .ldcweb-cn-banner, #ldcweb-cn-modal .modal-wrapper{ +#ldcweb-cn a::before { + content: none; +} +.ldcweb-cn-cookie-link { + cursor: pointer; +} +#ldcweb-cn .ldcweb-cn-banner, +#ldcweb-cn-modal .modal-wrapper { overflow: auto; display: flex; flex-direction: column; align-items: center; } -#ldcweb-cn .ldcweb-cn-banner{ - display: none; - padding: 6vw 10vw; - max-height: 50vh; - - box-shadow: 0px 5px 10px -5px #000 inset; +#ldcweb-cn .ldcweb-cn-banner { + padding: 0; + margin: 0; + padding-top: 20px; background-color: var(--ck-bg-color); + flex-direction: column; + justify-content: flex-end; + position: fixed; + left: var(--ldcweb-cn-animation-left); + right: var(--ldcweb-cn-animation-right); + bottom: calc(var(--ldcweb-cn-position-bottom) + 60px); + width: 475px; + height: auto; + max-height: 80vh; + border-radius: 10px; + z-index: var(--ldcweb-cn-z-index); + line-height: initial; + overflow: hidden; + box-shadow: var(--shadow-color); + user-select: none; + opacity: 0; + visibility: hidden; + transition: 0.3s; } -#ldcweb-cn .ldcweb-cn-banner div:not(:last-child){margin-bottom: 4vw;} -#ldcweb-cn .banner-img{ - flex: 1; - max-width: 200px; +#ldcweb-cn .ldcweb-cn-banner-open { + left: var(--ldcweb-cn-position-left); + right: var(--ldcweb-cn-position-right); + opacity: 1; + visibility: visible; } -#ldcweb-cn .banner-img img{width: 100%;} -#ldcweb-cn .col{flex: 2;} -#ldcweb-cn .banner-title p{ +.ldcweb-banner-content, +.ldcweb-banner-details { + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + padding: 0px 20px 0px 20px; +} +.ldcweb-banner-details { + height: 0; + transition: 0.3s; + text-align: justify; + overflow: hidden; + align-items: flex-start; +} +.ldcweb-banner-details-open { + margin-bottom: 6px; +} +#ldcweb-cn .ldcweb-banner-img { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + height: auto; + width: 150px; + padding-right: 20px; +} +#ldcweb-cn .ldcweb-banner-img img { + width: 100%; +} +#ldcweb-cn .ldcweb-banner-text { + flex: 2; +} +#ldcweb-cn .ldcweb-banner-title { + line-height: 0.9; + padding-bottom: 1rem; +} +#ldcweb-cn .ldcweb-banner-title p { font-family: var(--ck-w1-font-family-title); font-size: var(--ck-w1-font-size-title); font-weight: bold; color: var(--ck-w1-color-title); + text-align: left; +} +#ldcweb-cn .ldcweb-banner-para-p { + text-align: justify; + margin-bottom: 6px; +} +#ldcweb-cn .ldcweb-banner-btnDetails { + width: 100%; + margin: 0 0 20px 0; +} +#ldcweb-cn .ldcweb-banner-btnDetails-p { + cursor: pointer; + color: var(--secondary-color); + width: fit-content; + margin: 0 auto; text-align: center; } -#ldcweb-cn .banner-txt{text-align: center;} -#ldcweb-cn .btns { +#ldcweb-cn .ldcweb-banner-btns { flex: 1; display: flex; - flex-direction: column; -} -#ldcweb-cn .btns .btn { - display: block; - /* flex: 1; */ - padding: 1em; - text-align: center; - min-width: 12em; + flex-direction: row; width: 100%; - line-height: 0; - - background-color: var(--ck-w1-color-btn); + cursor: pointer; +} +#ldcweb-cn .ldcweb-banner-btns .ldcweb-banner-btn-flex { + width: 66.5%; + border-top: 1px solid grey; + display: flex; + flex-direction: row; + justify-content: center; + align-items: center; + text-align: center; +} +.ldcweb-banner-btn-personalize { + width: 33.5%; + border-top: 1px solid gray; +} +#ldcweb-cn .ldcweb-banner-btns .ldcweb-banner-btn-flex div { + width: 50%; +} +.ldcweb-banner-btn-accept { + border-left: 1px solid gray; + border-right: 1px solid gray; +} +#ldcweb-cn .ldcweb-banner-btns .ldcweb-banner-btn-flex .ldcweb-cn-accept { + font-weight: bolder; + color: var(--secondary-color); +} +#ldcweb-cn .ldcweb-banner-btns .ldcweb-banner-btns-btn { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + text-align: center; + width: 100%; + height: 50px; + background-color: var(--background-color); text-decoration: none; font-family: var(--ck-w1-font-family-btn-txt); font-size: var(--ck-w1-font-size-btn-txt); - color: var(--ck-w1-color-btn-txt); - transition: all .5s; + color: var(--primary-color); } -#ldcweb-cn .btns .btn:hover { - background-color: var(--ck-w1-color-btn-hover); - background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.5)); +#ldcweb-cn .ldcweb-banner-btns .ldcweb-banner-btns-btn:hover { color: var(--ck-w1-color-btn-txt-hover); + background-color: var(--ck-w1-color-btn-hover); +} +.ldcweb-btn { + position: fixed; + left: var(--ldcweb-cn-position-left); + right: var(--ldcweb-cn-position-right); + bottom: var(--ldcweb-cn-position-bottom); + z-index: var(--ldcweb-cn-z-index); + background-color: white; + padding: 8px; + border-radius: 100%; + cursor: pointer; + box-shadow: var(--shadow-color); + width: 50px; + height: 50px; +} +.ldcweb-btn-icon path { + fill: var(--secondary-color); +} +.ldcweb-btn-icon circle { + fill: var(--secondary-color); +} +.visibility { + display: none !important; } /* MODAL */ #ldcweb-cn-modal { - display: none; - align-items: center; - justify-content: center; - position: fixed; - left: 0; right: 0; - top: 0; bottom: 0; - width: 100%; height: 100%; - z-index: 200; - - background: rgba(0, 0, 0, 0.7); - opacity: 1; -} -#ldcweb-cn-modal .modal-wrapper{ - position: relative; - background-color: var(--ck-bg-color-modal-wrapper); - max-height: 100vh; -} -#ldcweb-cn-modal .modal-wrapper > div:not(:first-of-type){width: 100%;} -#ldcweb-cn-modal .modal-btn-close{ - position: absolute; - right: 0; - top: 0; - width: 5vw; height: 6vw; display: flex; - justify-content: center; align-items: center; -} -#ldcweb-cn-modal .modal-btn-close a{ + justify-content: center; width: 100%; height: 100%; - display: flex; - justify-content: center; - align-items: center; - - font-family: Arial, Helvetica, sans-serif; - font-size: medium; - font-weight: bold; - color: var(--ck-w2-color-title); - background-color: var(--ck-w2-bgcolor-title); - text-decoration: none; - border-radius: 0 0 0 50%; - transition: all .5s; + z-index: 200; + opacity: 1; } -#ldcweb-cn-modal .modal-btn-close a:hover{ - color: #000000; - background-color: #808080; - background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.5)); - box-shadow: -1px 1px 10px -4px #000; +#ldcweb-cn-modal .modal-wrapper { + position: relative; + max-height: 100vh; +} +#ldcweb-cn-modal .modal-wrapper > div:not(:first-of-type) { + width: 100%; + align-items: flex-end; +} +#ldcweb-cn-modal .modal-title { + padding: 0px 20px 0px 20px; +} +#ldcweb-cn-modal .modal-title * { + text-align: justify; + margin: 0; } -#ldcweb-cn-modal .modal-title, #ldcweb-cn-modal .modal-all - {background-color: var(--ck-w2-bgcolor-title);} #ldcweb-cn-modal .modal-title .description, -#ldcweb-cn-modal .modal-title > div, -#ldcweb-cn-modal .modal-all{ +#ldcweb-cn-modal .modal-btns { display: flex; flex-direction: column; align-items: center; + font-weight: normal; + line-height: initial; } #ldcweb-cn-modal .modal-title .description, -#ldcweb-cn-modal .modal-title > div a, -#ldcweb-cn-modal .modal-all p, -#ldcweb-cn-modal .modal-all a{ +#ldcweb-cn-modal .modal-btns p, +#ldcweb-cn-modal .modal-btns a, +#ldcweb-cn-modal .modal-title > .subTitle { font-family: var(--ck-w2-font-family-txt); font-size: var(--ck-w2-font-size-txt); color: var(--ck-w2-color-txt); - text-align: center; } -#ldcweb-cn-modal .modal-title > div a:hover, -#ldcweb-cn-modal .modal-all a:hover - {color: var(--ck-w2-color-href-hover);} /* TITLE */ -#ldcweb-cn-modal .modal-wrapper .modal-title{padding: 4vw;} -#ldcweb-cn-modal .modal-title .title{ +#ldcweb-cn-modal .modal-title .title { font-family: var(--ck-w2-font-family-title); font-size: var(--ck-w2-font-size-title); font-weight: bold; color: var(--ck-w2-color-title); +} +#ldcweb-cn-modal .modal-title > .subTitle { + color: var(--ck-w2-color-title); + margin-bottom: 6px; +} +#ldcweb-cn-modal .modal-title .title, +#ldcweb-cn-modal .modal-title > .subTitle { text-align: center; } -#ldcweb-cn-modal .modal-title .title::after, -#ldcweb-cn-modal .modal-title > div::after{ - content: ""; - display: block; - width: 90%; height: 2px; - margin: 4vw auto; +#ldcweb-cn-modal .modal-title a { + width: fit-content; +} - background-color: rgba(255, 255, 255, .5); -} -#ldcweb-cn-modal .modal-title a{width: fit-content;} -/* ALL */ -#ldcweb-cn-modal .modal-wrapper .modal-all{padding: 0 4vw 4vw;} -#ldcweb-cn-modal .modal-all .all-buttons{ - display: flex; - flex-direction: column; - align-items: center; -} -#ldcweb-cn-modal .modal-all .all-buttons > div{ - width: calc(100% + 15vw); - margin: 2vw 0 0; -} -#ldcweb-cn-modal .modal-all a{ - display: block; - padding: 3vw 0; - - color: var(--ck-color-txt); - /* font-weight: bold; */ - text-decoration: none; - transition: all .5s; -} -#ldcweb-cn-modal .all-buttons > div.accept > a.active { - background-color: var(--ck-color-accept-hover); - background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.5)); -} -#ldcweb-cn-modal .all-buttons > div.deny > a.active { - background-color: var(--ck-color-deny-hover); - background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.5)); -} -#ldcweb-cn-modal .modal-all > div > div:first-of-type a{background-color: var(--ck-color-accept);} -#ldcweb-cn-modal .modal-all > div > div:last-of-type a{background-color: var(--ck-color-deny);} -#ldcweb-cn-modal .modal-all > div > div:first-of-type a:hover{ - color: var(--ck-color-txt-hover); - background-color: var(--ck-color-accept-hover); - background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.5)); -} -#ldcweb-cn-modal .modal-all > div > div:last-of-type a:hover{ - color: var(--ck-color-txt-hover); - background-color: var(--ck-color-deny-hover); - background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.5)); -} /* DETAILS */ -#ldcweb-cn-modal .modal-wrapper .modal-details{padding: 2vw 0;} -#ldcweb-cn-modal .modal-details ul{ +#ldcweb-cn-modal .modal-details { + width: 100%; + height: 153px; + overflow-y: auto; + margin: 6px 0; +} +#ldcweb-cn-modal .modal-details ul { display: flex; flex-direction: column; + padding: 0 20px; + list-style: none; } -#ldcweb-cn-modal .modal-details li > div{ +#ldcweb-cn-modal .modal-details li > div { display: flex; flex-direction: column; justify-content: space-between; - margin: 2vw 0; - padding: 2vw 4vw; - - background-color: var(--ck-bgcolor-list); + align-items: center; + margin: 10px 0; + padding: 10px 20px; + border-radius: 20px; + border: 1px solid var(--ck-bgcolor-list); } #ldcweb-cn-modal .modal-details li span, #ldcweb-cn-modal .modal-details li a, -#ldcweb-cn-modal .modal-details li label{ +#ldcweb-cn-modal .modal-details li label { font-family: var(--ck-font-family-list); font-size: var(--ck-font-size-list); color: var(--ck-color-list); } -#ldcweb-cn-modal .modal-details li a:hover{color:var(--secondary-color);} -#ldcweb-cn-modal .modal-details .ldcweb-cn-infos{ +#ldcweb-cn-modal .modal-details .ldcweb-cn-name { + color: var(--ck-color-title); +} +#ldcweb-cn-modal .modal-details .ldcweb-cn-infos { display: flex; flex-direction: column; flex: 1; + width: 100%; } -#ldcweb-cn-modal .modal-details .ldcweb-cn-infos span:first-of-type{ - font-size: calc(var(--ck-font-size-list) * 1.25); +#ldcweb-cn-modal .modal-details .ldcweb-cn-infos span:first-of-type { + font-size: var(--ck-w1-font-size-title); font-weight: bold; + font-family: var(--ck-w1-font-family-title); +} +#ldcweb-cn-modal .modal-details .ldcweb-cn-infos .ldcweb-cn-description { + color: var(--ck-w2-color-txt); +} +#ldcweb-cn-modal .modal-details .ldcweb-cn-infos a { + width: fit-content; +} +#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons { + display: flex; + justify-content: space-around; + width: 200px; + margin-top: 6px; } -#ldcweb-cn-modal .modal-details .ldcweb-cn-infos a{width: fit-content;} -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{display: flex;} #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type, -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type - {transition: all .5s;} -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{ - margin-right: 2vw; +#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type { + transition: all 0.3s; +} +#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type { background: var(--ck-color-accept); } -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type{background: var(--ck-color-deny);} -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ - width: 25vw; - margin: 2vw 0; +#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type { + background: var(--ck-color-deny); +} +#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div { display: table; - - /* font-weight: bold; */ text-align: center; + margin: 0.5em; } -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type:hover, -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type:hover{ - cursor: pointer; - background: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.5)); -} -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:hover > label{color: var(--ck-color-txt-hover);} -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type input:checked ~ label, -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type input ~label.active{ - background-color: var(--ck-color-accept-hover); - background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.5)); -} -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type input:checked ~ label, -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:last-of-type input ~ label.active{ +#ldcweb-cn-modal + .modal-details + .ldcweb-cn-buttons + div:first-of-type + input:checked + ~ label, +#ldcweb-cn-modal + .modal-details + .ldcweb-cn-buttons + div:first-of-type + input + ~ label.active { background-color: var(--ck-color-deny-hover); - background-image: linear-gradient(rgba(0,0,0,.1),rgba(0,0,0,.5)); } -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons input{display: none;} -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label{ +#ldcweb-cn-modal + .modal-details + .ldcweb-cn-buttons + div:last-of-type + input:checked + ~ label, +#ldcweb-cn-modal + .modal-details + .ldcweb-cn-buttons + div:last-of-type + input + ~ label.active { + background-color: var(--ck-color-accept-hover); +} +#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons input { + display: none; +} +#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label { + width: 100px; display: block; - padding: 1.5vw 0; - color: var(--ck-color-txt); - transition: color .5s; -} -#ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label:hover{ + transition: color 0.3s; + padding: 6px 20px; cursor: pointer; - color: var(--ck-color-txt-hover); } -/* ************************* */ -/* ** ** */ -/* ************************* */ -/* ** ** */ -/* ** ** */ -/* ** ** */ -/* ** ** */ -/* ** ** */ -/* ** ** */ -/* ** ** */ -/* ******* */ -@media only screen and (min-width:768px) { - #ldcweb-cn .ldcweb-cn-banner{ - padding-top: 4vw; - padding-bottom: 4vw; - } - #ldcweb-cn .btns {flex-direction: row;} - #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 */ - #ldcweb-cn-modal .modal-wrapper{width: 90vw;} - /* ALL */ - #ldcweb-cn-modal .modal-all{ - flex-direction: row; - justify-content: space-between; - } - #ldcweb-cn-modal .modal-all a{padding: 2vw 0;} - #ldcweb-cn-modal .modal-all .all-buttons > div{margin: 0;} - #ldcweb-cn-modal .modal-all .all-buttons > div:last-of-type{margin: 1vw 0 0;} - #ldcweb-cn-modal .modal-all a{width: 30vw;} - /* DETAILS */ - #ldcweb-cn-modal .modal-details li > div{flex-direction: row;} - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{flex-direction: column;} - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ - width: 20vw; - margin: 0; - } - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{margin: 0 0 1vw;} -} - -/* **** */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* **** */ -@media only screen and (min-width:1024px) { - #ldcweb-cn .ldcweb-cn-banner{ - flex-direction: row; - align-items: flex-start; - justify-content: space-between; - padding: 2vw 3vw; - } - #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 .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 .btns { - height: 100%; +/* MEDIA QUERIES */ +@media (max-width: 535px) { + .ldcweb-banner-content, + #ldcweb-cn .ldcweb-banner-btns { flex-direction: column; - justify-content: center; } - #ldcweb-cn .btns > div:first-child .btn{margin: 0;} - /* MODAL */ - #ldcweb-cn-modal .modal-wrapper{width: 80vw;} - #ldcweb-cn-modal .modal-btn-close{ - width: 3vw; - height: 3vw; + #ldcweb-cn .ldcweb-banner-btns .ldcweb-banner-btn-flex, + #ldcweb-cn .ldcweb-banner-btns .ldcweb-banner-btn-personalize { + width: 100%; } - /* TITLE */ - #ldcweb-cn-modal .modal-wrapper .modal-title{padding: 2vw;} - #ldcweb-cn-modal .modal-title .title::after, - #ldcweb-cn-modal .modal-title > div::after{margin: 2vw auto;} - /* ALL */ - #ldcweb-cn-modal .modal-wrapper .modal-all{padding: 0 2vw 2vw;} - #ldcweb-cn-modal .modal-all a{padding: 1.5vw 0;} - #ldcweb-cn-modal .modal-all .all-buttons{flex-direction: row;} - #ldcweb-cn-modal .modal-all .all-buttons > div:first-of-type{margin: 0 1vw 0 0;} - #ldcweb-cn-modal .modal-all .all-buttons > div:last-of-type{margin: 0;} - #ldcweb-cn-modal .modal-all a{width: 22vw;} - /* DETAILS */ - #ldcweb-cn-modal .modal-wrapper .modal-details{padding: 1vw 0;} - #ldcweb-cn-modal .modal-details li > div{ - margin: 1vw 0; - padding: 2vw; + #ldcweb-cn + .ldcweb-banner-btns + .ldcweb-banner-btn-flex + .ldcweb-banner-btn-deny, + #ldcweb-cn + .ldcweb-banner-btns + .ldcweb-banner-btn-flex + .ldcweb-banner-btn-accept { + width: 50%; } - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{ - flex-direction: row; - align-items: center; + .ldcweb-banner-btn-accept { + border-left: 1px solid gray; + border-right: none; } - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{ - width: 10vw; - margin: 0; + #ldcweb-cn .ldcweb-cn-banner { + left: 0; + bottom: 0; + } + #ldcweb-cn .ldcweb-cn-banner { + width: 100%; + max-height: 100vh; + border-top-left-radius: 10px; + border-top-right-radius: 10px; + border-bottom-right-radius: 0; + border-bottom-left-radius: 0; + } + .ldcweb-banner-details-open { + height: 0; + } + #ldcweb-cn .ldcweb-banner-title p { + text-align: center; + } + #ldcweb-cn .ldcweb-banner-img { + padding: 0 0 20px 0; } - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{margin: 0 1vw 0;} - } - -/* ******** */ -/* * ***** * */ -/* * * * * */ -/* *** * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * * */ -/* * ************** */ -/* * * */ -/* ***************** */ -@media only screen and (min-width: 1440px) { - #ldcweb-cn .col{flex: 4;} - /* MODAL */ - #ldcweb-cn-modal .modal-wrapper{width: 60vw;} - #ldcweb-cn-modal .modal-btn-close{ - width: 2vw; - height: 2vw; - } - /* ALL */ - #ldcweb-cn-modal .modal-all .all-buttons > div:first-of-type{margin: 0 1vw 0 0;} - #ldcweb-cn-modal .modal-all a{ - width: 15vw; - padding: 1vw 0; - } - /* DETAILS */ - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{width: 8vw;} - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label{padding: 1vw 0;} -} - -/* ************ */ -/* * **** */ -/* ********* * */ - /* ***** * */ - /* ** * */ - /* ** * */ -/* ********** * */ -/* * * */ -/* ********* * */ - /* ***** * */ - /* ** * */ - /* ** * */ -/* ********** * */ -/* * *** */ -/* ************ */ -@media only screen and (min-width: 1920px) { - #ldcweb-cn p{font-size: calc(var(--ck-w1-font-size-txt) * 1.25);} - #ldcweb-cn .banner-title p{font-size: calc(var(--ck-w1-font-size-title) * 1.25);} - #ldcweb-cn .btns .btn {font-size: calc(var(--ck-w1-font-size-btn-txt) * 1.25);} - - /* MODAL */ - #ldcweb-cn-modal .modal-wrapper{width: 50vw;} - #ldcweb-cn-modal .modal-btn-close{ - width: 2rem; - height: 2rem; - } - #ldcweb-cn-modal .modal-title .description, - #ldcweb-cn-modal .modal-title > div a, - #ldcweb-cn-modal .modal-all p, - #ldcweb-cn-modal .modal-all a - {font-size: calc(var(--ck-w2-font-size-txt) * 1.25);} - /* TITLE */ - #ldcweb-cn-modal .modal-wrapper .modal-title{padding: 1vw;} - #ldcweb-cn-modal .modal-title .title{font-size: calc(var(--ck-w2-font-size-title) * 1.25);} - #ldcweb-cn-modal .modal-title .title::after, - #ldcweb-cn-modal .modal-title > div::after{margin: 1vw auto;} - /* ALL */ - #ldcweb-cn-modal .modal-wrapper .modal-all{padding: 0 1vw 1vw;} - #ldcweb-cn-modal .modal-all a{ - width: 13vw; - padding: .5vw 0; - } - /* DETAILS */ - #ldcweb-cn-modal .modal-wrapper .modal-details{padding: .5vw 0;} - #ldcweb-cn-modal .modal-details li > div{ - margin: .5vw 0; - padding: 1vw; - } - #ldcweb-cn-modal .modal-details li span, - #ldcweb-cn-modal .modal-details li a, - #ldcweb-cn-modal .modal-details li label - {font-size: calc(var(--ck-font-size-list) * 1.25);} - #ldcweb-cn-modal .modal-details .ldcweb-cn-infos span:first-of-type{font-size: calc(var(--ck-font-size-list) * 1.5);} - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons{ - flex-direction: row; - align-items: center; - } - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div{width: 5vw;} - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons div:first-of-type{margin: 0 1vw 0;} - #ldcweb-cn-modal .modal-details .ldcweb-cn-buttons label{padding: .5vw 0;} -} \ No newline at end of file diff --git a/resources/views/layouts/frontend/cookie.blade.php b/resources/views/layouts/frontend/cookie.blade.php index 02d0e1a..031f96d 100644 --- a/resources/views/layouts/frontend/cookie.blade.php +++ b/resources/views/layouts/frontend/cookie.blade.php @@ -1,99 +1,118 @@
-
- -
- - -
- -
-
- @push('scripts') - + }); + @endpush