Setup compile dist script
This commit is contained in:
Jérémy Munsch
parent
30bb79385a
commit
e64bc62c41
13 changed files with 2 additions and 3166 deletions
1
.gitignore
vendored
1
.gitignore
vendored
|
|
@ -1 +1,2 @@
|
||||||
node_modules
|
node_modules
|
||||||
|
dist
|
||||||
|
|
|
||||||
438
dist/browser/cookie-cn.css
vendored
438
dist/browser/cookie-cn.css
vendored
|
|
@ -1,438 +0,0 @@
|
||||||
@charset "UTF-8";
|
|
||||||
:root {
|
|
||||||
--cs-primary-color: var();
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Distance par rapport à la gauche de la fenêtre */
|
|
||||||
/* Distance par rapport à la droite de la fenêtre */
|
|
||||||
/* Distance par rapport au bas de la fenêtre */
|
|
||||||
/* Position gauche de base des cookies */
|
|
||||||
/* Position droite de base des cookies */
|
|
||||||
#cn-wrapper {
|
|
||||||
/* Buttons styles start */
|
|
||||||
/* Button styles end */
|
|
||||||
}
|
|
||||||
#cn-wrapper * {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
#cn-wrapper *::before {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
#cn-wrapper button {
|
|
||||||
display: inline-block;
|
|
||||||
padding: 0.2rem 0.5rem;
|
|
||||||
border: 0;
|
|
||||||
margin: 0;
|
|
||||||
appearance: none;
|
|
||||||
background: #d6d6d6;
|
|
||||||
color: #000;
|
|
||||||
cursor: pointer;
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 1rem;
|
|
||||||
line-height: 1;
|
|
||||||
text-align: center;
|
|
||||||
text-decoration: none;
|
|
||||||
transition: background 250ms ease-in-out, transform 150ms ease;
|
|
||||||
}
|
|
||||||
#cn-wrapper button:hover,
|
|
||||||
#cn-wrapper button:focus {
|
|
||||||
background: #bdbdbd;
|
|
||||||
/* prettier-ignore */
|
|
||||||
color: #000;
|
|
||||||
}
|
|
||||||
#cn-wrapper button:focus {
|
|
||||||
outline: 1px solid;
|
|
||||||
/* prettier-ignore */
|
|
||||||
outline-color: #000;
|
|
||||||
outline-offset: -4px;
|
|
||||||
}
|
|
||||||
#cn-wrapper button:active {
|
|
||||||
transform: scale(0.99);
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 5.0.4 */
|
|
||||||
/* FENETRE D'ACCUEIL */
|
|
||||||
/* Title settings */
|
|
||||||
/* Text settings */
|
|
||||||
/* Button settings */
|
|
||||||
/* Title settings */
|
|
||||||
/* Text settings */
|
|
||||||
/* Switch Buttons */
|
|
||||||
/* Cookies list settings */
|
|
||||||
/* Size */
|
|
||||||
#cn-wrapper .cn-nav #cn-settings-banner, #cn-wrapper .cn-nav #cn-accept-banner, #cn-wrapper .cn-nav #cn-deny-banner, #cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal {
|
|
||||||
display: flex;
|
|
||||||
height: 3rem;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
padding: 0;
|
|
||||||
background-color: #d6d6d6;
|
|
||||||
color: #000;
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-settings-banner:hover, #cn-wrapper .cn-nav #cn-accept-banner:hover, #cn-wrapper .cn-nav #cn-deny-banner:hover, #cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal:hover, #cn-wrapper .cn-nav #cn-settings-banner:focus, #cn-wrapper .cn-nav #cn-accept-banner:focus, #cn-wrapper .cn-nav #cn-deny-banner:focus, #cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal:focus {
|
|
||||||
background-color: #bdbdbd;
|
|
||||||
/* prettier-ignore */
|
|
||||||
color: #000;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-settings-banner:focus, #cn-wrapper .cn-nav #cn-accept-banner:focus, #cn-wrapper .cn-nav #cn-deny-banner:focus, #cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal:focus {
|
|
||||||
/* prettier-ignore */
|
|
||||||
outline-color: #000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cn-modal-bg {
|
|
||||||
position: fixed;
|
|
||||||
z-index: 1030;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100vw;
|
|
||||||
height: 100dvh;
|
|
||||||
background-color: rgba(0, 0, 0, 0.6);
|
|
||||||
cursor: pointer;
|
|
||||||
opacity: 0;
|
|
||||||
transition: 0.3s;
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
.cn-modal-bg-active {
|
|
||||||
cursor: default;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cn-open .cn-modal-bg {
|
|
||||||
opacity: 1;
|
|
||||||
visibility: visible;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cn-disabled {
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#cn-wrapper {
|
|
||||||
position: fixed;
|
|
||||||
z-index: 1050;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100vw;
|
|
||||||
height: 100dvh;
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-cookie-btn {
|
|
||||||
position: fixed;
|
|
||||||
right: auto;
|
|
||||||
bottom: 0.5rem;
|
|
||||||
left: 0.5rem;
|
|
||||||
width: 2.4rem;
|
|
||||||
height: 2.4rem;
|
|
||||||
padding: 0.3rem;
|
|
||||||
border-radius: 100%;
|
|
||||||
background-color: #fff;
|
|
||||||
box-shadow: 0 0.1rem 1rem rgba(0, 0, 0, 0.35);
|
|
||||||
cursor: pointer;
|
|
||||||
pointer-events: auto;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper #cn-cookie-btn {
|
|
||||||
right: auto;
|
|
||||||
bottom: -1.5rem;
|
|
||||||
left: -1.5rem;
|
|
||||||
width: 3rem;
|
|
||||||
height: 3rem;
|
|
||||||
padding: 0.5rem;
|
|
||||||
transition: all 1s 6s;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-cookie-btn:hover, #cn-wrapper #cn-cookie-btn:focus {
|
|
||||||
right: auto;
|
|
||||||
bottom: 0.5rem;
|
|
||||||
left: 0.5rem;
|
|
||||||
transition: all 1s;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-cookie-btn:focus {
|
|
||||||
outline-color: #d1842a;
|
|
||||||
outline-offset: 0.1rem;
|
|
||||||
outline-width: 0.2rem;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-cookie-btn-icon path {
|
|
||||||
fill: #dc9c52;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-cookie-btn-icon circle {
|
|
||||||
fill: #dc9c52;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-banner {
|
|
||||||
position: absolute;
|
|
||||||
z-index: 1050;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
display: flex;
|
|
||||||
width: 100vw;
|
|
||||||
max-height: 100dvh;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: flex-end;
|
|
||||||
padding: 0;
|
|
||||||
border-radius: 0;
|
|
||||||
margin: auto;
|
|
||||||
margin-bottom: 0;
|
|
||||||
background-color: #fff;
|
|
||||||
box-shadow: 0 0.1rem 1rem rgba(0, 0, 0, 0.35);
|
|
||||||
line-height: initial;
|
|
||||||
opacity: 0;
|
|
||||||
pointer-events: none;
|
|
||||||
transition: 0.3s;
|
|
||||||
user-select: none;
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-banner .cn-modal-top-line {
|
|
||||||
align-self: end;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal {
|
|
||||||
width: 4rem;
|
|
||||||
height: 3rem;
|
|
||||||
border-bottom-left-radius: 0.5rem;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal {
|
|
||||||
border-top-right-radius: 0.5rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-banner > * {
|
|
||||||
pointer-events: all;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper #cn-banner {
|
|
||||||
right: auto;
|
|
||||||
bottom: calc(0.5rem + 60px);
|
|
||||||
left: 0;
|
|
||||||
width: 30rem;
|
|
||||||
max-height: 26rem;
|
|
||||||
border-radius: 0.5rem;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-banner.cn-modal-page {
|
|
||||||
max-height: 38rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-li-template {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
#cn-wrapper .d-none {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content {
|
|
||||||
flex-grow: 1;
|
|
||||||
padding: 0.8rem;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper .cn-content {
|
|
||||||
flex-grow: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch {
|
|
||||||
position: relative;
|
|
||||||
display: inline-block;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 4.2rem;
|
|
||||||
height: 2.4rem;
|
|
||||||
box-sizing: content-box;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch:focus, #cn-wrapper .cn-content .cn-switch:focus-visible {
|
|
||||||
border-width: 0.1rem;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: #b7b7b7;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input + span {
|
|
||||||
position: absolute;
|
|
||||||
border-radius: 2rem;
|
|
||||||
background: #b7b7b7;
|
|
||||||
inset: 0;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input + span::before {
|
|
||||||
position: absolute;
|
|
||||||
top: 50%;
|
|
||||||
left: 0.21rem;
|
|
||||||
display: inline-block;
|
|
||||||
width: 1.8rem;
|
|
||||||
height: 1.8rem;
|
|
||||||
border-radius: 50%;
|
|
||||||
background: #fff;
|
|
||||||
content: "";
|
|
||||||
transform: translateY(-50%);
|
|
||||||
transition: all 0.5s;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input:indeterminate + span {
|
|
||||||
background: #b7b7b7;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input:indeterminate + span::before {
|
|
||||||
left: 1.08rem;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input:checked + span {
|
|
||||||
background: #b7b7b7;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input:checked + span::before {
|
|
||||||
left: 2.16rem;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content {
|
|
||||||
display: flex;
|
|
||||||
min-height: 100%;
|
|
||||||
flex-direction: column;
|
|
||||||
color: #707070;
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content {
|
|
||||||
flex-flow: row wrap;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-img {
|
|
||||||
width: 33%;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-text {
|
|
||||||
width: 66%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-img {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-img img {
|
|
||||||
width: 90%;
|
|
||||||
object-fit: contain;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-text .cn-banner-title {
|
|
||||||
color: #dc9c52;
|
|
||||||
font-family: "Satisfy", sans-serif;
|
|
||||||
font-size: 28px;
|
|
||||||
font-weight: bold;
|
|
||||||
line-height: inherit;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-text .cn-banner-para-p {
|
|
||||||
margin: 6px 0;
|
|
||||||
text-align: justify;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper {
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
overflow: auto;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
/* stylelint-disable-next-line no-descending-specificity */
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper ul {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
list-style: none;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper .cn-cookie-wrapper {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
padding: 20px;
|
|
||||||
border: 1px solid #e4e4e4;
|
|
||||||
border-radius: 20px;
|
|
||||||
margin: 10px 0;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper span {
|
|
||||||
color: #dc9c52;
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper a {
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper label {
|
|
||||||
color: #dc9c52;
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-cookie-name {
|
|
||||||
color: #dc9c52;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-cookie-infos {
|
|
||||||
display: flex;
|
|
||||||
width: 100%;
|
|
||||||
flex: 1;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-cookie-infos span:first-of-type {
|
|
||||||
font-size: calc(16px * 1.25);
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-cookie-infos .cn-cookie-description {
|
|
||||||
color: #707070;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-cookie-infos a {
|
|
||||||
width: fit-content;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav {
|
|
||||||
display: flex;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 100%;
|
|
||||||
height: 6rem;
|
|
||||||
flex-shrink: 0;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
align-items: center;
|
|
||||||
border-top: 1px solid #6d6d6d;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-deny-banner {
|
|
||||||
width: 50%;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-accept-banner {
|
|
||||||
width: 50%;
|
|
||||||
border-right: 1px solid #6d6d6d;
|
|
||||||
border-left: 1px solid #6d6d6d;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-settings-banner {
|
|
||||||
width: 100%;
|
|
||||||
border-top: 1px solid #6d6d6d;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper .cn-nav {
|
|
||||||
height: 3rem;
|
|
||||||
flex-wrap: initial;
|
|
||||||
border-bottom-left-radius: 0.5rem;
|
|
||||||
border-bottom-right-radius: 0.5rem;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-deny-banner {
|
|
||||||
width: 33.33%;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-accept-banner {
|
|
||||||
width: 33.33%;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-settings-banner {
|
|
||||||
width: 33.33%;
|
|
||||||
border-top: initial;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.cn-open {
|
|
||||||
overflow: hidden !important;
|
|
||||||
}
|
|
||||||
.cn-open #cn-wrapper #cn-banner {
|
|
||||||
opacity: 1;
|
|
||||||
visibility: visible;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
.cn-open #cn-wrapper #cn-banner {
|
|
||||||
right: auto;
|
|
||||||
left: 0.5rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
.cn-open #cn-wrapper #cn-cookie-btn {
|
|
||||||
right: auto;
|
|
||||||
bottom: 0.5rem;
|
|
||||||
left: 0.5rem;
|
|
||||||
transition: all 1s;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
1
dist/browser/cookie-cn.js
vendored
1
dist/browser/cookie-cn.js
vendored
File diff suppressed because one or more lines are too long
7
dist/browser/typings/ts/export/global.d.ts
vendored
7
dist/browser/typings/ts/export/global.d.ts
vendored
|
|
@ -1,7 +0,0 @@
|
||||||
import "./../../scss/themes/standard.scss";
|
|
||||||
import CookieNotice from "./../index";
|
|
||||||
declare global {
|
|
||||||
interface Window {
|
|
||||||
CookieNotice: typeof CookieNotice;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
267
dist/browser/typings/ts/index.d.ts
vendored
267
dist/browser/typings/ts/index.d.ts
vendored
|
|
@ -1,267 +0,0 @@
|
||||||
/** 5.0.4 */
|
|
||||||
export default class CookieNotice {
|
|
||||||
browserCookieName: string;
|
|
||||||
/** Cookie life time */
|
|
||||||
cookieTimeLife: number;
|
|
||||||
/** The index on which store the expiration date */
|
|
||||||
cookieExpirationName: string;
|
|
||||||
/** Cookie policies for each functionality */
|
|
||||||
cookiePolicies: CookiePolicy;
|
|
||||||
/** Cookie expiration date as specified in the cookie itself */
|
|
||||||
cookieExpirationDate: Date;
|
|
||||||
config: Record<string, CookieOptions>;
|
|
||||||
modalBg: HTMLDivElement;
|
|
||||||
cookieContainer: HTMLDivElement;
|
|
||||||
bannerContainer: HTMLDivElement;
|
|
||||||
modalContainer: HTMLDivElement;
|
|
||||||
cookieShowModalBtn: HTMLButtonElement;
|
|
||||||
cookieCloseModalBtn: HTMLButtonElement;
|
|
||||||
bannerContent: HTMLDivElement;
|
|
||||||
acceptAllBtn: HTMLButtonElement;
|
|
||||||
denyAllBtn: HTMLButtonElement;
|
|
||||||
customizeBtn: HTMLButtonElement;
|
|
||||||
cookiesUnorderedList: HTMLUListElement;
|
|
||||||
cookieLinkShowCustomizeModalList: NodeListOf<HTMLElement>;
|
|
||||||
modalWrapper: HTMLDivElement;
|
|
||||||
template: HTMLDivElement;
|
|
||||||
restrictCloseModal: boolean;
|
|
||||||
static noConflict: (deep?: boolean) => typeof CookieNotice;
|
|
||||||
constructor(config: Record<string, CookieOptions>);
|
|
||||||
/**
|
|
||||||
* Update restrict for closing cookie modal
|
|
||||||
*/
|
|
||||||
updateRestrictCloseModal(): void;
|
|
||||||
/**
|
|
||||||
* Get cookies expiration date or null if not defined alread
|
|
||||||
*/
|
|
||||||
readCookiesExpirationDate(): Date | null;
|
|
||||||
/**
|
|
||||||
* Check if the cookies date are older than a specified date
|
|
||||||
|
|
||||||
* @param date The limit date for cookies
|
|
||||||
*/
|
|
||||||
cookiesOlderThan(date: Date): boolean;
|
|
||||||
/**
|
|
||||||
* Check if the actual cookie matches the config
|
|
||||||
*/
|
|
||||||
cookiesMatchesConfig(): boolean;
|
|
||||||
/**
|
|
||||||
* Accept a all cookies
|
|
||||||
*/
|
|
||||||
acceptAllCookies(): void;
|
|
||||||
/**
|
|
||||||
* Accept a specific cookie
|
|
||||||
*/
|
|
||||||
acceptCookie(cookieName: string): void;
|
|
||||||
/**
|
|
||||||
* Deny a all cookies
|
|
||||||
*/
|
|
||||||
denyAllCookies(): void;
|
|
||||||
/**
|
|
||||||
* Deny a specific cookie
|
|
||||||
*/
|
|
||||||
denyCookie(cookieName: string): void;
|
|
||||||
/**
|
|
||||||
* Deny all waiting cookies
|
|
||||||
*/
|
|
||||||
denyAllWaitingCookies(): void;
|
|
||||||
/**
|
|
||||||
* Get a specific cookie config
|
|
||||||
*/
|
|
||||||
getCookie(cookieName: string): CookieOptions;
|
|
||||||
/**
|
|
||||||
* Fetch the cookie status list
|
|
||||||
*
|
|
||||||
* @returns the cookie status list
|
|
||||||
*/
|
|
||||||
getCookieStatusList(): CookieStatusList;
|
|
||||||
/**
|
|
||||||
* Check has cookie status
|
|
||||||
*
|
|
||||||
* @param key
|
|
||||||
* @param value
|
|
||||||
*/
|
|
||||||
containsCookieStatus(key: string): boolean;
|
|
||||||
/**
|
|
||||||
* Get a cookie status
|
|
||||||
*
|
|
||||||
* @param key
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
getCookieStatus(key: string): CookieStatus;
|
|
||||||
/**
|
|
||||||
* Set the cookie value
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param status
|
|
||||||
* @param cookieOption
|
|
||||||
*/
|
|
||||||
setCookieStatus(cookieName: string, status: CookieStatus, cookieOption: CookieOptions): void;
|
|
||||||
/**
|
|
||||||
* Add a specific cookie and
|
|
||||||
* change his status to true
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param cookieOption
|
|
||||||
*/
|
|
||||||
addCookieStatus(cookieName: string, cookieOption: CookieOptions): void;
|
|
||||||
/**
|
|
||||||
* Remove a specific cookie and
|
|
||||||
* change his status to false
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param cookieOption
|
|
||||||
*/
|
|
||||||
removeCookieStatus(cookieName: string, cookieOption: CookieOptions): void;
|
|
||||||
/**
|
|
||||||
* Change the status of a cookie
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param status
|
|
||||||
*/
|
|
||||||
setBrowserCookieStatus(cookieName: string, status: CookieStatus): void;
|
|
||||||
/**
|
|
||||||
* Has CN cokie setup ?
|
|
||||||
* @returns true if the cookie is setup
|
|
||||||
*/
|
|
||||||
hasBrowserCookie(): boolean;
|
|
||||||
/**
|
|
||||||
* Get the Ldcweb cookie
|
|
||||||
*
|
|
||||||
* @returns A string like analytics=true,youtube=true or undefined
|
|
||||||
*/
|
|
||||||
getBrowserCookieValue(): string | undefined;
|
|
||||||
/**
|
|
||||||
* Save cookie content on web browser
|
|
||||||
*
|
|
||||||
* @param list
|
|
||||||
*/
|
|
||||||
saveBrowserCookie(statusList: CookieStatusList): void;
|
|
||||||
/**
|
|
||||||
* Set an older expire parameter to a specific cookie
|
|
||||||
*/
|
|
||||||
deleteBrowserCookie(): void;
|
|
||||||
getCookiePoliciesAsString(): string;
|
|
||||||
/**
|
|
||||||
* Reset Ldc Web CN cookie
|
|
||||||
*/
|
|
||||||
resetBrowserCookie(): void;
|
|
||||||
/**
|
|
||||||
* Add event on a specific element
|
|
||||||
*
|
|
||||||
* @param element
|
|
||||||
* @param evnt
|
|
||||||
* @param funct
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
addEvent(element: HTMLElement, evnt: string, funct: (e: Event) => void): void;
|
|
||||||
/**
|
|
||||||
* Add event on a specific element and prevent default
|
|
||||||
*
|
|
||||||
* @param element
|
|
||||||
* @param evnt
|
|
||||||
* @param funct
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
addEventPrevent(element: HTMLElement, evnt: string, funct: (e: Event) => void): void;
|
|
||||||
/**
|
|
||||||
* Add event on a specific element
|
|
||||||
*
|
|
||||||
* @param element
|
|
||||||
* @param evnt
|
|
||||||
* @param funct
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
addEventKbdValidate(element: HTMLElement, funct: (e: Event) => void): void;
|
|
||||||
/**
|
|
||||||
* Show or hide Cookie modal
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
toggleCookieModal(): void;
|
|
||||||
/**
|
|
||||||
* Open the cookies modal to the banner page
|
|
||||||
*/
|
|
||||||
openCookieModalToBannerPage(): void;
|
|
||||||
/**
|
|
||||||
* Open the cookies modal to the cookies page
|
|
||||||
*/
|
|
||||||
openCookieModalToCookiePage(): void;
|
|
||||||
/**
|
|
||||||
* Hide the cookies modal
|
|
||||||
*/
|
|
||||||
closeCookieModal(): void;
|
|
||||||
/**
|
|
||||||
* Setup tab indexes on visible elements
|
|
||||||
*/
|
|
||||||
setTabIndex(): void;
|
|
||||||
/**
|
|
||||||
* Undo setup tab indexes on visible elements
|
|
||||||
*/
|
|
||||||
unsetTabIndex(): void;
|
|
||||||
/**
|
|
||||||
* Reset the modal view state
|
|
||||||
*/
|
|
||||||
resetCookieModal(): void;
|
|
||||||
/**
|
|
||||||
* Set the cookies list in the modal
|
|
||||||
*/
|
|
||||||
setupCookieModalList(): void;
|
|
||||||
switchToModalPageOrClose(): void;
|
|
||||||
/**
|
|
||||||
* Toggle Cookie modal pages
|
|
||||||
*/
|
|
||||||
toggleCookieModalPages(): void;
|
|
||||||
/**
|
|
||||||
* Toggle customize btn
|
|
||||||
*/
|
|
||||||
togglePersonalizeBtn(): void;
|
|
||||||
/**
|
|
||||||
* Get the actual page: banner or modal (with cookie choices)
|
|
||||||
*/
|
|
||||||
isOnBannerPage(): boolean;
|
|
||||||
/**
|
|
||||||
* Invert cookie status
|
|
||||||
*
|
|
||||||
* @param status
|
|
||||||
* @returns Inverted cookie status, `wait` will give `false`.
|
|
||||||
*/
|
|
||||||
private invertCookieStatus;
|
|
||||||
}
|
|
||||||
declare enum CookieStatus {
|
|
||||||
true = "true",
|
|
||||||
false = "false",
|
|
||||||
wait = "wait"
|
|
||||||
}
|
|
||||||
type CookieStatusList = Record<string, CookieStatus>;
|
|
||||||
type CookiePolicy = {
|
|
||||||
sameSite: CookiePolicySameSite;
|
|
||||||
secure: string;
|
|
||||||
};
|
|
||||||
declare enum CookiePolicySameSite {
|
|
||||||
lax = "lax",
|
|
||||||
strict = "strict",
|
|
||||||
none = "none"
|
|
||||||
}
|
|
||||||
export type CookieOptions = {
|
|
||||||
name: string;
|
|
||||||
description: string;
|
|
||||||
link: string;
|
|
||||||
labelLink: string;
|
|
||||||
cookies: string[];
|
|
||||||
/**
|
|
||||||
* Fonction qui sert à initialiser la fonctionnalité
|
|
||||||
* conduisant à la génération du cookie
|
|
||||||
* @return void
|
|
||||||
*/
|
|
||||||
script: () => void;
|
|
||||||
/**
|
|
||||||
* Fonction qui sert à informer l'utilisateur
|
|
||||||
* sur chaque élèment que le cookie
|
|
||||||
* associé à la fonctionnalité
|
|
||||||
* est désactivé et propose un lien sur
|
|
||||||
* cookie notice pour l'activer
|
|
||||||
* @return void
|
|
||||||
*/
|
|
||||||
fallback: () => void | null;
|
|
||||||
};
|
|
||||||
export {};
|
|
||||||
11
dist/esm/ts/export/global.js
vendored
11
dist/esm/ts/export/global.js
vendored
|
|
@ -1,11 +0,0 @@
|
||||||
import "./../../scss/themes/standard.scss";
|
|
||||||
import CookieNotice from "./../index";
|
|
||||||
const // Map over CookieNotice in case of overwrite
|
|
||||||
_CookieNotice = window.CookieNotice;
|
|
||||||
CookieNotice.noConflict = function (deep = false) {
|
|
||||||
if (deep && window.CookieNotice === CookieNotice) {
|
|
||||||
window.CookieNotice = _CookieNotice;
|
|
||||||
}
|
|
||||||
return CookieNotice;
|
|
||||||
};
|
|
||||||
window.CookieNotice = CookieNotice.noConflict();
|
|
||||||
697
dist/esm/ts/index.js
vendored
697
dist/esm/ts/index.js
vendored
|
|
@ -1,697 +0,0 @@
|
||||||
/** 5.0.4 */
|
|
||||||
export default class CookieNotice {
|
|
||||||
constructor(config) {
|
|
||||||
this.browserCookieName = "cn-init";
|
|
||||||
/** Cookie life time */
|
|
||||||
this.cookieTimeLife = 6;
|
|
||||||
/** The index on which store the expiration date */
|
|
||||||
this.cookieExpirationName = "_expiration";
|
|
||||||
/** Cookie policies for each functionality */
|
|
||||||
this.cookiePolicies = {
|
|
||||||
sameSite: CookiePolicySameSite.lax,
|
|
||||||
secure: "",
|
|
||||||
};
|
|
||||||
// * Setup Config
|
|
||||||
this.config = config;
|
|
||||||
// * Setup cookie expiration date
|
|
||||||
let cookieExpirationDate = this.readCookiesExpirationDate();
|
|
||||||
if (!cookieExpirationDate) {
|
|
||||||
cookieExpirationDate = new Date();
|
|
||||||
cookieExpirationDate.setMonth(cookieExpirationDate.getMonth() + this.cookieTimeLife);
|
|
||||||
}
|
|
||||||
this.cookieExpirationDate = cookieExpirationDate;
|
|
||||||
// * Inject DOM modal BG
|
|
||||||
const modalBg = document.createElement("div");
|
|
||||||
modalBg.classList.add("cn-modal-bg");
|
|
||||||
document.body.append(modalBg);
|
|
||||||
this.modalBg = modalBg;
|
|
||||||
// * Setup Dom Elements
|
|
||||||
const cookieContainer = document.querySelector("div#cn-wrapper"), cookieShowModalBtn = document.querySelector("button#cn-cookie-btn"), cookieCloseModalBtn = document.querySelector("button#cn-close-modal"), cookieLinkShowCustomizeModalPageList = document.querySelectorAll(".cn-cookie-link"), bannerContainer = document.querySelector("div#cn-banner"), bannerContent = document.querySelector("div.cn-banner-content"), modalContainer = document.querySelector("div.cn-modal-container"), acceptAllBtn = document.querySelector("button#cn-accept-banner"), denyAllBtn = document.querySelector("button#cn-deny-banner"), customizeBtn = document.querySelector("button#cn-settings-banner"), cookiesUnorderedList = document.querySelector("ul#cn-modal-list"), modalWrapper = document.querySelector("div.cn-modal-wrapper"), template = document.querySelector("div#cn-li-template");
|
|
||||||
if (!cookieContainer) {
|
|
||||||
throw new Error("Cannot find div#cn-wrapper");
|
|
||||||
}
|
|
||||||
if (!cookieShowModalBtn) {
|
|
||||||
throw new Error("Cannot find 'button#cn-cookie-btn' element");
|
|
||||||
}
|
|
||||||
if (!cookieCloseModalBtn) {
|
|
||||||
throw new Error("Cannot find 'button#cn-close-modal' element");
|
|
||||||
}
|
|
||||||
if (!bannerContainer) {
|
|
||||||
throw new Error("Cannot find 'div#cn-banner' element");
|
|
||||||
}
|
|
||||||
if (!bannerContent) {
|
|
||||||
throw new Error("Cannot find 'div.cn-banner-content' element");
|
|
||||||
}
|
|
||||||
if (!modalContainer) {
|
|
||||||
throw new Error("Cannot find 'div.cn-modal-container' element");
|
|
||||||
}
|
|
||||||
if (!acceptAllBtn) {
|
|
||||||
throw new Error("Cannot find 'button#cn-accept-banner' element");
|
|
||||||
}
|
|
||||||
if (!denyAllBtn) {
|
|
||||||
throw new Error("Cannot find 'button#cn-deny-banner' element");
|
|
||||||
}
|
|
||||||
if (!customizeBtn) {
|
|
||||||
throw new Error("Cannot find 'button.cn-settings-banner' element");
|
|
||||||
}
|
|
||||||
if (!cookiesUnorderedList) {
|
|
||||||
throw new Error("Cannot find 'ul#cn-modal-list' element");
|
|
||||||
}
|
|
||||||
if (!modalWrapper) {
|
|
||||||
throw new Error("Cannot find 'div.cn-modal-wrapper' element");
|
|
||||||
}
|
|
||||||
if (!template) {
|
|
||||||
throw new Error("Cannot find 'div#cn-li-template' element");
|
|
||||||
}
|
|
||||||
this.cookieShowModalBtn = cookieShowModalBtn;
|
|
||||||
this.cookieCloseModalBtn = cookieCloseModalBtn;
|
|
||||||
this.cookieLinkShowCustomizeModalList =
|
|
||||||
cookieLinkShowCustomizeModalPageList;
|
|
||||||
this.cookieContainer = cookieContainer;
|
|
||||||
this.bannerContainer = bannerContainer;
|
|
||||||
this.bannerContent = bannerContent;
|
|
||||||
this.cookiesUnorderedList = cookiesUnorderedList;
|
|
||||||
this.modalWrapper = modalWrapper;
|
|
||||||
this.modalContainer = modalContainer;
|
|
||||||
this.acceptAllBtn = acceptAllBtn;
|
|
||||||
this.denyAllBtn = denyAllBtn;
|
|
||||||
this.customizeBtn = customizeBtn;
|
|
||||||
this.template = template;
|
|
||||||
const memoryTemplate = this.template.cloneNode(true);
|
|
||||||
this.template.remove();
|
|
||||||
this.template = memoryTemplate;
|
|
||||||
this.restrictCloseModal = true;
|
|
||||||
// * Setup Events
|
|
||||||
this.addEventPrevent(this.modalBg, "click", this.closeCookieModal);
|
|
||||||
this.addEventPrevent(this.cookieCloseModalBtn, "click", this.closeCookieModal);
|
|
||||||
this.addEventPrevent(this.acceptAllBtn, "click", this.acceptAllCookies);
|
|
||||||
this.addEventPrevent(this.denyAllBtn, "click", this.denyAllCookies);
|
|
||||||
this.addEventPrevent(this.customizeBtn, "click", this.switchToModalPageOrClose);
|
|
||||||
this.addEventPrevent(this.cookieShowModalBtn, "click", this.toggleCookieModal);
|
|
||||||
this.cookieLinkShowCustomizeModalList.forEach((cookieLink) => {
|
|
||||||
this.addEventPrevent(cookieLink, "click", this.openCookieModalToCookiePage);
|
|
||||||
this.addEventKbdValidate(cookieLink, this.openCookieModalToCookiePage);
|
|
||||||
});
|
|
||||||
// * Setup CN Cookie
|
|
||||||
if (!this.cookiesMatchesConfig() || this.cookiesOlderThan(new Date())) {
|
|
||||||
// * Setup Browser Cookie if none.
|
|
||||||
this.resetBrowserCookie();
|
|
||||||
this.openCookieModalToBannerPage();
|
|
||||||
}
|
|
||||||
this.updateRestrictCloseModal();
|
|
||||||
// * Cookie should have been created from here.
|
|
||||||
Object.entries(this.getCookieStatusList()).forEach(([cookieName, cookieStatus]) => {
|
|
||||||
if (cookieStatus === CookieStatus.wait) {
|
|
||||||
// * Open modal if any cookie config is not set.
|
|
||||||
this.openCookieModalToBannerPage();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (!this.config[cookieName]) {
|
|
||||||
// * Ignore missing config
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (cookieStatus === CookieStatus.true) {
|
|
||||||
// * Exec script part for accepted cookie.
|
|
||||||
this.config[cookieName].script();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (this.config[cookieName].fallback != null) {
|
|
||||||
// * Exec fallback part for accepted cookie if provided.
|
|
||||||
this.config[cookieName].fallback();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
// COOKIES
|
|
||||||
/**
|
|
||||||
* Update restrict for closing cookie modal
|
|
||||||
*/
|
|
||||||
updateRestrictCloseModal() {
|
|
||||||
this.restrictCloseModal = (Object.values(this.getCookieStatusList()).includes(CookieStatus.wait)) ? true : false;
|
|
||||||
(this.restrictCloseModal) ? this.cookieCloseModalBtn.classList.add("d-none") : this.cookieCloseModalBtn.classList.remove("d-none");
|
|
||||||
(this.restrictCloseModal) ? this.modalBg.classList.add("cn-modal-bg-active") : this.modalBg.classList.remove("cn-modal-bg-active");
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Get cookies expiration date or null if not defined alread
|
|
||||||
*/
|
|
||||||
readCookiesExpirationDate() {
|
|
||||||
var _a;
|
|
||||||
const cookies = (_a = this.getBrowserCookieValue()) !== null && _a !== void 0 ? _a : "", expirationDateString = cookies.split(",").find((cookieString) => cookieString.startsWith(this.cookieExpirationName));
|
|
||||||
if (!expirationDateString) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
try {
|
|
||||||
const epochExpiration = Number.parseInt(expirationDateString.replace(`${this.cookieExpirationName}=`, ""));
|
|
||||||
if (isNaN(epochExpiration)) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
return new Date(epochExpiration);
|
|
||||||
}
|
|
||||||
catch (e) {
|
|
||||||
return null;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Check if the cookies date are older than a specified date
|
|
||||||
|
|
||||||
* @param date The limit date for cookies
|
|
||||||
*/
|
|
||||||
cookiesOlderThan(date) {
|
|
||||||
return this.cookieExpirationDate.getTime() < date.getTime();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Check if the actual cookie matches the config
|
|
||||||
*/
|
|
||||||
cookiesMatchesConfig() {
|
|
||||||
const cookies = this.getCookieStatusList();
|
|
||||||
return Object.keys(cookies).length === Object.keys(this.config).length;
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Accept a all cookies
|
|
||||||
*/
|
|
||||||
acceptAllCookies() {
|
|
||||||
Object.keys(this.config).forEach((cookieName) => this.acceptCookie(cookieName));
|
|
||||||
this.closeCookieModal();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Accept a specific cookie
|
|
||||||
*/
|
|
||||||
acceptCookie(cookieName) {
|
|
||||||
const cookieOptions = this.getCookie(cookieName);
|
|
||||||
this.setCookieStatus(cookieName, CookieStatus.true, cookieOptions);
|
|
||||||
const cnSwitch = document.getElementById(`${cookieName}-switch`);
|
|
||||||
const cnSwitchInput = cnSwitch === null || cnSwitch === void 0 ? void 0 : cnSwitch.querySelector("input");
|
|
||||||
if (!cnSwitch || !cnSwitchInput) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
cnSwitchInput.checked = true;
|
|
||||||
cnSwitch.ariaChecked = "true";
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Deny a all cookies
|
|
||||||
*/
|
|
||||||
denyAllCookies() {
|
|
||||||
Object.keys(this.config).forEach((cookieName) => this.denyCookie(cookieName));
|
|
||||||
this.closeCookieModal();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Deny a specific cookie
|
|
||||||
*/
|
|
||||||
denyCookie(cookieName) {
|
|
||||||
const cookieOptions = this.getCookie(cookieName);
|
|
||||||
this.setCookieStatus(cookieName, CookieStatus.false, cookieOptions);
|
|
||||||
const cnSwitch = document.getElementById(`${cookieName}-switch`);
|
|
||||||
const cnSwitchInput = cnSwitch === null || cnSwitch === void 0 ? void 0 : cnSwitch.querySelector("input");
|
|
||||||
if (!cnSwitch || !cnSwitchInput) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
cnSwitchInput.checked = false;
|
|
||||||
cnSwitch.ariaChecked = "false";
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Deny all waiting cookies
|
|
||||||
*/
|
|
||||||
denyAllWaitingCookies() {
|
|
||||||
Object.entries(this.getCookieStatusList()).forEach(([cookieName, cookieStatus]) => {
|
|
||||||
if (cookieStatus === CookieStatus.wait) {
|
|
||||||
this.setBrowserCookieStatus(cookieName, CookieStatus.false);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
this.updateRestrictCloseModal();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Get a specific cookie config
|
|
||||||
*/
|
|
||||||
getCookie(cookieName) {
|
|
||||||
var _a;
|
|
||||||
const cookieOptions = (_a = Object.entries(this.config).find((entry) => entry[0] === cookieName)) === null || _a === void 0 ? void 0 : _a[1];
|
|
||||||
if (cookieOptions === undefined) {
|
|
||||||
throw new Error(`Cookie options ${cookieName} not found in list`);
|
|
||||||
}
|
|
||||||
return cookieOptions;
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Fetch the cookie status list
|
|
||||||
*
|
|
||||||
* @returns the cookie status list
|
|
||||||
*/
|
|
||||||
getCookieStatusList() {
|
|
||||||
const cookies = this.getBrowserCookieValue(), statusList = {};
|
|
||||||
if (cookies === undefined) {
|
|
||||||
return statusList;
|
|
||||||
}
|
|
||||||
/** specificCookieString contains youtube=true like */
|
|
||||||
cookies.split(",")
|
|
||||||
// * Ignore timestamp
|
|
||||||
.filter((specificCookieString) => !specificCookieString.startsWith(this.cookieExpirationName))
|
|
||||||
.forEach((specificCookieString) => {
|
|
||||||
const values = specificCookieString.split("=");
|
|
||||||
statusList[values[0]] = values[1];
|
|
||||||
});
|
|
||||||
return statusList;
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Check has cookie status
|
|
||||||
*
|
|
||||||
* @param key
|
|
||||||
* @param value
|
|
||||||
*/
|
|
||||||
containsCookieStatus(key) {
|
|
||||||
const statusList = this.getCookieStatusList();
|
|
||||||
return (Object.keys(statusList).find((cookieName) => cookieName === key) !==
|
|
||||||
undefined);
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Get a cookie status
|
|
||||||
*
|
|
||||||
* @param key
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
getCookieStatus(key) {
|
|
||||||
const statusList = this.getCookieStatusList();
|
|
||||||
const cookieIndex = Object.keys(statusList).find((cookieName) => cookieName === key);
|
|
||||||
if (cookieIndex === undefined) {
|
|
||||||
throw new Error(`Cookie options ${key} not found in list`);
|
|
||||||
}
|
|
||||||
return statusList[cookieIndex];
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Set the cookie value
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param status
|
|
||||||
* @param cookieOption
|
|
||||||
*/
|
|
||||||
setCookieStatus(cookieName, status, cookieOption) {
|
|
||||||
if (status === CookieStatus.true) {
|
|
||||||
this.addCookieStatus(cookieName, cookieOption);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if (status === CookieStatus.false) {
|
|
||||||
this.removeCookieStatus(cookieName, cookieOption);
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.setBrowserCookieStatus(cookieName, CookieStatus.wait);
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Add a specific cookie and
|
|
||||||
* change his status to true
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param cookieOption
|
|
||||||
*/
|
|
||||||
addCookieStatus(cookieName, cookieOption) {
|
|
||||||
if (cookieOption.script) {
|
|
||||||
cookieOption.script();
|
|
||||||
}
|
|
||||||
this.setBrowserCookieStatus(cookieName, CookieStatus.true);
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Remove a specific cookie and
|
|
||||||
* change his status to false
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param cookieOption
|
|
||||||
*/
|
|
||||||
removeCookieStatus(cookieName, cookieOption) {
|
|
||||||
const cookieNameElement = document.getElementById(cookieName);
|
|
||||||
if (cookieNameElement) {
|
|
||||||
cookieNameElement.remove();
|
|
||||||
}
|
|
||||||
if (cookieOption.fallback) {
|
|
||||||
cookieOption.fallback();
|
|
||||||
}
|
|
||||||
this.setBrowserCookieStatus(cookieName, CookieStatus.false);
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Change the status of a cookie
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param status
|
|
||||||
*/
|
|
||||||
setBrowserCookieStatus(cookieName, status) {
|
|
||||||
const statusList = this.getCookieStatusList();
|
|
||||||
// * Force refresh
|
|
||||||
this.deleteBrowserCookie();
|
|
||||||
statusList[cookieName] = status;
|
|
||||||
this.saveBrowserCookie(statusList);
|
|
||||||
this.updateRestrictCloseModal();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Has CN cokie setup ?
|
|
||||||
* @returns true if the cookie is setup
|
|
||||||
*/
|
|
||||||
hasBrowserCookie() {
|
|
||||||
return Boolean(this.getBrowserCookieValue());
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Get the Ldcweb cookie
|
|
||||||
*
|
|
||||||
* @returns A string like analytics=true,youtube=true or undefined
|
|
||||||
*/
|
|
||||||
getBrowserCookieValue() {
|
|
||||||
const matches = document.cookie.match(new RegExp("(?:^|; )" +
|
|
||||||
this.browserCookieName.replace(/([.$?*|{}()[\]\\/+^])/g, "\\$1") +
|
|
||||||
"=([^;]*)"));
|
|
||||||
return matches ? decodeURIComponent(matches[1]) : undefined;
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Save cookie content on web browser
|
|
||||||
*
|
|
||||||
* @param list
|
|
||||||
*/
|
|
||||||
saveBrowserCookie(statusList) {
|
|
||||||
const date = new Date(), content = Object.entries(statusList)
|
|
||||||
.map(([cookieName, cookieStatus]) => {
|
|
||||||
return `${cookieName}=${cookieStatus}`;
|
|
||||||
});
|
|
||||||
// * Update expiration date
|
|
||||||
this.cookieExpirationDate = new Date(date.setMonth(date.getMonth() + this.cookieTimeLife));
|
|
||||||
// * Append expiration date
|
|
||||||
content.push(`${this.cookieExpirationName}=${this.cookieExpirationDate.getTime()}`);
|
|
||||||
document.cookie = `${this.browserCookieName}=${content.join(",")};path=/${location.hostname ? `;domain=${location.hostname}` : ""};expires=${this.cookieExpirationDate.toUTCString()};${this.getCookiePoliciesAsString()}`;
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Set an older expire parameter to a specific cookie
|
|
||||||
*/
|
|
||||||
deleteBrowserCookie() {
|
|
||||||
if (this.hasBrowserCookie()) {
|
|
||||||
// * Suppression du cookie et de sa version precedé d'un point
|
|
||||||
document.cookie = `${this.browserCookieName}=;path=/${location.hostname ? `;domain=.${location.hostname}` : ""};expires=Thu, 01 Jan 1970 00:00:01 GMT;`;
|
|
||||||
document.cookie = `${this.browserCookieName}=;path=/${location.hostname ? `;domain=${location.hostname}` : ""};expires=Thu, 01 Jan 1970 00:00:01 GMT;`;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
getCookiePoliciesAsString() {
|
|
||||||
return Object.entries(this.cookiePolicies)
|
|
||||||
.map(([policyName, policyValue]) => `${policyName}=${policyValue}`)
|
|
||||||
.join(";");
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Reset Ldc Web CN cookie
|
|
||||||
*/
|
|
||||||
resetBrowserCookie() {
|
|
||||||
// * Create Cookie as It does not exists.
|
|
||||||
const newCookieList = {};
|
|
||||||
Object.entries(this.config).forEach(([cookieName]) => (newCookieList[cookieName] = CookieStatus.wait));
|
|
||||||
this.saveBrowserCookie(newCookieList);
|
|
||||||
}
|
|
||||||
// LISTENERS
|
|
||||||
/**
|
|
||||||
* Add event on a specific element
|
|
||||||
*
|
|
||||||
* @param element
|
|
||||||
* @param evnt
|
|
||||||
* @param funct
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
addEvent(element, evnt, funct) {
|
|
||||||
return element.addEventListener(evnt, funct.bind(this), false);
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Add event on a specific element and prevent default
|
|
||||||
*
|
|
||||||
* @param element
|
|
||||||
* @param evnt
|
|
||||||
* @param funct
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
addEventPrevent(element, evnt, funct) {
|
|
||||||
return element.addEventListener(evnt, (e) => {
|
|
||||||
e.preventDefault();
|
|
||||||
funct.call(this, e);
|
|
||||||
}, false);
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Add event on a specific element
|
|
||||||
*
|
|
||||||
* @param element
|
|
||||||
* @param evnt
|
|
||||||
* @param funct
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
addEventKbdValidate(element, funct) {
|
|
||||||
return this.addEvent(element, "keydown", (e) => {
|
|
||||||
const kbdEvt = e;
|
|
||||||
if (kbdEvt.key == " " ||
|
|
||||||
kbdEvt.code == "Space" ||
|
|
||||||
kbdEvt.keyCode == 32 ||
|
|
||||||
kbdEvt.key == "Enter" ||
|
|
||||||
kbdEvt.code == "Enter" ||
|
|
||||||
kbdEvt.keyCode == 13) {
|
|
||||||
funct.call(this, kbdEvt);
|
|
||||||
e.preventDefault();
|
|
||||||
}
|
|
||||||
});
|
|
||||||
}
|
|
||||||
// COOKIE MODAL
|
|
||||||
/**
|
|
||||||
* Show or hide Cookie modal
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
toggleCookieModal() {
|
|
||||||
if (!document.body.classList.contains("cn-open")) {
|
|
||||||
this.openCookieModalToBannerPage();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
this.closeCookieModal();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Open the cookies modal to the banner page
|
|
||||||
*/
|
|
||||||
openCookieModalToBannerPage() {
|
|
||||||
this.openCookieModalToCookiePage();
|
|
||||||
this.toggleCookieModalPages();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Open the cookies modal to the cookies page
|
|
||||||
*/
|
|
||||||
openCookieModalToCookiePage() {
|
|
||||||
document.body.classList.add("cn-open");
|
|
||||||
this.resetCookieModal();
|
|
||||||
this.bannerContent.classList.add("d-none");
|
|
||||||
this.modalContainer.classList.remove("d-none");
|
|
||||||
this.bannerContainer.classList.add("cn-modal-page");
|
|
||||||
// Scroll to the top of the cookies list
|
|
||||||
this.modalWrapper.scrollTop = 0;
|
|
||||||
this.setupCookieModalList();
|
|
||||||
this.setTabIndex();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Hide the cookies modal
|
|
||||||
*/
|
|
||||||
closeCookieModal() {
|
|
||||||
this.updateRestrictCloseModal();
|
|
||||||
if (!this.restrictCloseModal) {
|
|
||||||
document.body.classList.remove("cn-open");
|
|
||||||
if (!this.isOnBannerPage()) {
|
|
||||||
// * Make toggle page to banner on closing
|
|
||||||
this.bannerContent.classList.toggle("d-none");
|
|
||||||
this.modalContainer.classList.toggle("d-none");
|
|
||||||
this.bannerContainer.classList.remove("cn-modal-page");
|
|
||||||
}
|
|
||||||
this.unsetTabIndex();
|
|
||||||
this.setupCookieModalList();
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
throw new Error("You need to accept or refuse all cookies");
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Setup tab indexes on visible elements
|
|
||||||
*/
|
|
||||||
setTabIndex() {
|
|
||||||
// * Prevent focus html tag
|
|
||||||
document.documentElement.setAttribute("tabindex", "-1");
|
|
||||||
setTimeout(() => {
|
|
||||||
const focusableSelector = "a[href], button, [role=\"button\"], input, embed, object, iframe, textarea, select, details, [tabindex]:not([tabindex=\"-1\"])";
|
|
||||||
// * Only focusable elements
|
|
||||||
[...document.body.querySelectorAll(focusableSelector)]
|
|
||||||
.filter((el) => !el.hasAttribute("disabled") &&
|
|
||||||
!el.getAttribute("aria-hidden") &&
|
|
||||||
!this.cookieContainer.contains(el))
|
|
||||||
.forEach((el) => {
|
|
||||||
el.setAttribute("tabindex", "-1");
|
|
||||||
el.classList.add("cn-disabled");
|
|
||||||
});
|
|
||||||
[...this.cookieContainer.querySelectorAll(focusableSelector)]
|
|
||||||
.filter((el) => !el.hasAttribute("disabled") &&
|
|
||||||
!el.getAttribute("aria-hidden") &&
|
|
||||||
// * Only visible elements
|
|
||||||
!!(el.offsetWidth ||
|
|
||||||
el.offsetHeight ||
|
|
||||||
el.getClientRects().length) &&
|
|
||||||
!this.cookieContainer.contains(el))
|
|
||||||
.forEach((el) => {
|
|
||||||
el.setAttribute("tabindex", "0");
|
|
||||||
el.classList.remove("cn-disabled");
|
|
||||||
});
|
|
||||||
this.cookieShowModalBtn.setAttribute("tabindex", "-1");
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Undo setup tab indexes on visible elements
|
|
||||||
*/
|
|
||||||
unsetTabIndex() {
|
|
||||||
document.documentElement.setAttribute("tabindex", "0");
|
|
||||||
setTimeout(() => {
|
|
||||||
document.body.querySelectorAll(".cn-disabled").forEach((el) => {
|
|
||||||
el.setAttribute("tabindex", "0");
|
|
||||||
el.classList.remove("cn-disabled");
|
|
||||||
});
|
|
||||||
this.cookieShowModalBtn.setAttribute("tabindex", "0");
|
|
||||||
}, 500);
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Reset the modal view state
|
|
||||||
*/
|
|
||||||
resetCookieModal() {
|
|
||||||
this.bannerContent.classList.remove("d-none");
|
|
||||||
this.modalContainer.classList.add("d-none");
|
|
||||||
this.bannerContainer.classList.remove("cn-modal-page");
|
|
||||||
if (!this.customizeBtn.dataset.openModal) {
|
|
||||||
throw new Error("Cannot find attribut data-open-modal");
|
|
||||||
}
|
|
||||||
this.customizeBtn.innerHTML = this.customizeBtn.dataset.openModal;
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Set the cookies list in the modal
|
|
||||||
*/
|
|
||||||
setupCookieModalList() {
|
|
||||||
this.cookiesUnorderedList.innerHTML = "";
|
|
||||||
Object.entries(this.config).forEach(([cookieName, cookieConfig]) => {
|
|
||||||
const cookie = document.createElement("li");
|
|
||||||
const childItem = this.template.children.item(0);
|
|
||||||
if (childItem === null) {
|
|
||||||
throw new Error("Cannot find child item");
|
|
||||||
}
|
|
||||||
cookie.append(childItem.cloneNode(true));
|
|
||||||
const name = cookie.querySelector("span.cn-cookie-name");
|
|
||||||
const description = cookie.querySelector("span.cn-cookie-description");
|
|
||||||
const link = cookie.querySelector(".cn-cookie-link");
|
|
||||||
const cnSwitch = cookie.querySelector(".cn-switch");
|
|
||||||
const cnSwitchInput = cookie.querySelector(".cn-switch > input");
|
|
||||||
// * Undertermined state
|
|
||||||
cnSwitchInput.indeterminate = true;
|
|
||||||
cnSwitchInput.checked = false;
|
|
||||||
// * Assign cookie aside content
|
|
||||||
name.textContent = cookieConfig.name;
|
|
||||||
description.id = `${cookieName}-desc`;
|
|
||||||
description.textContent = cookieConfig.description;
|
|
||||||
link.textContent = cookieConfig.labelLink;
|
|
||||||
link.setAttribute("href", cookieConfig.link);
|
|
||||||
// * Assign cookie controls
|
|
||||||
cnSwitch.id = `${cookieName}-switch`;
|
|
||||||
cnSwitch.name = cookieName;
|
|
||||||
cnSwitch.dataset.name = cookieName;
|
|
||||||
cnSwitch.setAttribute("aria-labelledby", `${cookieName}-desc`);
|
|
||||||
cnSwitch.setAttribute("aria-describedby", `${cookieName}-desc`);
|
|
||||||
const toggleCookie = (cookieName) => {
|
|
||||||
const cookieStatus = this.getCookieStatus(cookieName);
|
|
||||||
this.setCookieStatus(cookieName, this.invertCookieStatus(cookieStatus), cookieConfig);
|
|
||||||
};
|
|
||||||
this.addEvent(cnSwitchInput, "click", () => toggleCookie(cookieName));
|
|
||||||
this.addEventKbdValidate(cnSwitch, () => cnSwitchInput.click());
|
|
||||||
this.cookiesUnorderedList.append(cookie);
|
|
||||||
if (!this.hasBrowserCookie()) {
|
|
||||||
// * Ldcweb cookie is not set.
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
// * Setup list status state
|
|
||||||
Object.entries(this.getCookieStatusList()).forEach(([ckName, cookieStatus]) => {
|
|
||||||
if (ckName === cookieName) {
|
|
||||||
switch (cookieStatus) {
|
|
||||||
case CookieStatus.true:
|
|
||||||
cnSwitchInput.indeterminate = false;
|
|
||||||
cnSwitchInput.checked = true;
|
|
||||||
break;
|
|
||||||
case CookieStatus.false:
|
|
||||||
cnSwitchInput.indeterminate = false;
|
|
||||||
cnSwitchInput.checked = false;
|
|
||||||
break;
|
|
||||||
case CookieStatus.wait:
|
|
||||||
cnSwitchInput.indeterminate = true;
|
|
||||||
cnSwitchInput.checked = false;
|
|
||||||
break;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
switchToModalPageOrClose() {
|
|
||||||
// * Modification du comportement du bouton, même si ca n'a pas de sens.
|
|
||||||
// https://lab.s-web.fr/ldc-web/projets/ldc-web-cookie-notice/-/issues/9`
|
|
||||||
if (this.isOnBannerPage()) {
|
|
||||||
this.toggleCookieModalPages();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
// * Pas de permutation en arrière
|
|
||||||
this.closeCookieModal();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Toggle Cookie modal pages
|
|
||||||
*/
|
|
||||||
toggleCookieModalPages() {
|
|
||||||
this.bannerContent.classList.toggle("d-none");
|
|
||||||
this.modalContainer.classList.toggle("d-none");
|
|
||||||
this.bannerContainer.classList.toggle("cn-modal-page");
|
|
||||||
if (!this.isOnBannerPage()) {
|
|
||||||
this.bannerContainer.classList.add("cn-modal-page");
|
|
||||||
this.denyAllWaitingCookies();
|
|
||||||
}
|
|
||||||
this.setTabIndex();
|
|
||||||
this.setupCookieModalList();
|
|
||||||
this.togglePersonalizeBtn();
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Toggle customize btn
|
|
||||||
*/
|
|
||||||
togglePersonalizeBtn() {
|
|
||||||
const customizeBtnBannerDataset = this.customizeBtn.dataset;
|
|
||||||
this.modalWrapper.scrollTop = 0;
|
|
||||||
if (this.bannerContent.classList.contains("d-none")) {
|
|
||||||
this.customizeBtn.innerHTML =
|
|
||||||
customizeBtnBannerDataset.openModal;
|
|
||||||
this.customizeBtn.title = customizeBtnBannerDataset.openModal;
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
this.customizeBtn.innerHTML =
|
|
||||||
customizeBtnBannerDataset.closeModal;
|
|
||||||
this.customizeBtn.title = customizeBtnBannerDataset.closeModal;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Get the actual page: banner or modal (with cookie choices)
|
|
||||||
*/
|
|
||||||
isOnBannerPage() {
|
|
||||||
return this.modalContainer.classList.contains("d-none");
|
|
||||||
}
|
|
||||||
/**
|
|
||||||
* Invert cookie status
|
|
||||||
*
|
|
||||||
* @param status
|
|
||||||
* @returns Inverted cookie status, `wait` will give `false`.
|
|
||||||
*/
|
|
||||||
invertCookieStatus(status) {
|
|
||||||
switch (status) {
|
|
||||||
case CookieStatus.true:
|
|
||||||
case CookieStatus.wait:
|
|
||||||
return CookieStatus.false;
|
|
||||||
case CookieStatus.false:
|
|
||||||
return CookieStatus.true;
|
|
||||||
default:
|
|
||||||
throw new Error(`Un handled cookie status ${status}`);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
var CookieStatus;
|
|
||||||
(function (CookieStatus) {
|
|
||||||
CookieStatus["true"] = "true";
|
|
||||||
CookieStatus["false"] = "false";
|
|
||||||
CookieStatus["wait"] = "wait";
|
|
||||||
})(CookieStatus || (CookieStatus = {}));
|
|
||||||
var CookiePolicySameSite;
|
|
||||||
(function (CookiePolicySameSite) {
|
|
||||||
CookiePolicySameSite["lax"] = "lax";
|
|
||||||
CookiePolicySameSite["strict"] = "strict";
|
|
||||||
CookiePolicySameSite["none"] = "none";
|
|
||||||
})(CookiePolicySameSite || (CookiePolicySameSite = {}));
|
|
||||||
7
dist/typings/ts/export/global.d.ts
vendored
7
dist/typings/ts/export/global.d.ts
vendored
|
|
@ -1,7 +0,0 @@
|
||||||
import "./../../scss/themes/standard.scss";
|
|
||||||
import CookieNotice from "./../index";
|
|
||||||
declare global {
|
|
||||||
interface Window {
|
|
||||||
CookieNotice: typeof CookieNotice;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
267
dist/typings/ts/index.d.ts
vendored
267
dist/typings/ts/index.d.ts
vendored
|
|
@ -1,267 +0,0 @@
|
||||||
/** 5.0.4 */
|
|
||||||
export default class CookieNotice {
|
|
||||||
browserCookieName: string;
|
|
||||||
/** Cookie life time */
|
|
||||||
cookieTimeLife: number;
|
|
||||||
/** The index on which store the expiration date */
|
|
||||||
cookieExpirationName: string;
|
|
||||||
/** Cookie policies for each functionality */
|
|
||||||
cookiePolicies: CookiePolicy;
|
|
||||||
/** Cookie expiration date as specified in the cookie itself */
|
|
||||||
cookieExpirationDate: Date;
|
|
||||||
config: Record<string, CookieOptions>;
|
|
||||||
modalBg: HTMLDivElement;
|
|
||||||
cookieContainer: HTMLDivElement;
|
|
||||||
bannerContainer: HTMLDivElement;
|
|
||||||
modalContainer: HTMLDivElement;
|
|
||||||
cookieShowModalBtn: HTMLButtonElement;
|
|
||||||
cookieCloseModalBtn: HTMLButtonElement;
|
|
||||||
bannerContent: HTMLDivElement;
|
|
||||||
acceptAllBtn: HTMLButtonElement;
|
|
||||||
denyAllBtn: HTMLButtonElement;
|
|
||||||
customizeBtn: HTMLButtonElement;
|
|
||||||
cookiesUnorderedList: HTMLUListElement;
|
|
||||||
cookieLinkShowCustomizeModalList: NodeListOf<HTMLElement>;
|
|
||||||
modalWrapper: HTMLDivElement;
|
|
||||||
template: HTMLDivElement;
|
|
||||||
restrictCloseModal: boolean;
|
|
||||||
static noConflict: (deep?: boolean) => typeof CookieNotice;
|
|
||||||
constructor(config: Record<string, CookieOptions>);
|
|
||||||
/**
|
|
||||||
* Update restrict for closing cookie modal
|
|
||||||
*/
|
|
||||||
updateRestrictCloseModal(): void;
|
|
||||||
/**
|
|
||||||
* Get cookies expiration date or null if not defined alread
|
|
||||||
*/
|
|
||||||
readCookiesExpirationDate(): Date | null;
|
|
||||||
/**
|
|
||||||
* Check if the cookies date are older than a specified date
|
|
||||||
|
|
||||||
* @param date The limit date for cookies
|
|
||||||
*/
|
|
||||||
cookiesOlderThan(date: Date): boolean;
|
|
||||||
/**
|
|
||||||
* Check if the actual cookie matches the config
|
|
||||||
*/
|
|
||||||
cookiesMatchesConfig(): boolean;
|
|
||||||
/**
|
|
||||||
* Accept a all cookies
|
|
||||||
*/
|
|
||||||
acceptAllCookies(): void;
|
|
||||||
/**
|
|
||||||
* Accept a specific cookie
|
|
||||||
*/
|
|
||||||
acceptCookie(cookieName: string): void;
|
|
||||||
/**
|
|
||||||
* Deny a all cookies
|
|
||||||
*/
|
|
||||||
denyAllCookies(): void;
|
|
||||||
/**
|
|
||||||
* Deny a specific cookie
|
|
||||||
*/
|
|
||||||
denyCookie(cookieName: string): void;
|
|
||||||
/**
|
|
||||||
* Deny all waiting cookies
|
|
||||||
*/
|
|
||||||
denyAllWaitingCookies(): void;
|
|
||||||
/**
|
|
||||||
* Get a specific cookie config
|
|
||||||
*/
|
|
||||||
getCookie(cookieName: string): CookieOptions;
|
|
||||||
/**
|
|
||||||
* Fetch the cookie status list
|
|
||||||
*
|
|
||||||
* @returns the cookie status list
|
|
||||||
*/
|
|
||||||
getCookieStatusList(): CookieStatusList;
|
|
||||||
/**
|
|
||||||
* Check has cookie status
|
|
||||||
*
|
|
||||||
* @param key
|
|
||||||
* @param value
|
|
||||||
*/
|
|
||||||
containsCookieStatus(key: string): boolean;
|
|
||||||
/**
|
|
||||||
* Get a cookie status
|
|
||||||
*
|
|
||||||
* @param key
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
getCookieStatus(key: string): CookieStatus;
|
|
||||||
/**
|
|
||||||
* Set the cookie value
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param status
|
|
||||||
* @param cookieOption
|
|
||||||
*/
|
|
||||||
setCookieStatus(cookieName: string, status: CookieStatus, cookieOption: CookieOptions): void;
|
|
||||||
/**
|
|
||||||
* Add a specific cookie and
|
|
||||||
* change his status to true
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param cookieOption
|
|
||||||
*/
|
|
||||||
addCookieStatus(cookieName: string, cookieOption: CookieOptions): void;
|
|
||||||
/**
|
|
||||||
* Remove a specific cookie and
|
|
||||||
* change his status to false
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param cookieOption
|
|
||||||
*/
|
|
||||||
removeCookieStatus(cookieName: string, cookieOption: CookieOptions): void;
|
|
||||||
/**
|
|
||||||
* Change the status of a cookie
|
|
||||||
*
|
|
||||||
* @param cookieName
|
|
||||||
* @param status
|
|
||||||
*/
|
|
||||||
setBrowserCookieStatus(cookieName: string, status: CookieStatus): void;
|
|
||||||
/**
|
|
||||||
* Has CN cokie setup ?
|
|
||||||
* @returns true if the cookie is setup
|
|
||||||
*/
|
|
||||||
hasBrowserCookie(): boolean;
|
|
||||||
/**
|
|
||||||
* Get the Ldcweb cookie
|
|
||||||
*
|
|
||||||
* @returns A string like analytics=true,youtube=true or undefined
|
|
||||||
*/
|
|
||||||
getBrowserCookieValue(): string | undefined;
|
|
||||||
/**
|
|
||||||
* Save cookie content on web browser
|
|
||||||
*
|
|
||||||
* @param list
|
|
||||||
*/
|
|
||||||
saveBrowserCookie(statusList: CookieStatusList): void;
|
|
||||||
/**
|
|
||||||
* Set an older expire parameter to a specific cookie
|
|
||||||
*/
|
|
||||||
deleteBrowserCookie(): void;
|
|
||||||
getCookiePoliciesAsString(): string;
|
|
||||||
/**
|
|
||||||
* Reset Ldc Web CN cookie
|
|
||||||
*/
|
|
||||||
resetBrowserCookie(): void;
|
|
||||||
/**
|
|
||||||
* Add event on a specific element
|
|
||||||
*
|
|
||||||
* @param element
|
|
||||||
* @param evnt
|
|
||||||
* @param funct
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
addEvent(element: HTMLElement, evnt: string, funct: (e: Event) => void): void;
|
|
||||||
/**
|
|
||||||
* Add event on a specific element and prevent default
|
|
||||||
*
|
|
||||||
* @param element
|
|
||||||
* @param evnt
|
|
||||||
* @param funct
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
addEventPrevent(element: HTMLElement, evnt: string, funct: (e: Event) => void): void;
|
|
||||||
/**
|
|
||||||
* Add event on a specific element
|
|
||||||
*
|
|
||||||
* @param element
|
|
||||||
* @param evnt
|
|
||||||
* @param funct
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
addEventKbdValidate(element: HTMLElement, funct: (e: Event) => void): void;
|
|
||||||
/**
|
|
||||||
* Show or hide Cookie modal
|
|
||||||
* @returns
|
|
||||||
*/
|
|
||||||
toggleCookieModal(): void;
|
|
||||||
/**
|
|
||||||
* Open the cookies modal to the banner page
|
|
||||||
*/
|
|
||||||
openCookieModalToBannerPage(): void;
|
|
||||||
/**
|
|
||||||
* Open the cookies modal to the cookies page
|
|
||||||
*/
|
|
||||||
openCookieModalToCookiePage(): void;
|
|
||||||
/**
|
|
||||||
* Hide the cookies modal
|
|
||||||
*/
|
|
||||||
closeCookieModal(): void;
|
|
||||||
/**
|
|
||||||
* Setup tab indexes on visible elements
|
|
||||||
*/
|
|
||||||
setTabIndex(): void;
|
|
||||||
/**
|
|
||||||
* Undo setup tab indexes on visible elements
|
|
||||||
*/
|
|
||||||
unsetTabIndex(): void;
|
|
||||||
/**
|
|
||||||
* Reset the modal view state
|
|
||||||
*/
|
|
||||||
resetCookieModal(): void;
|
|
||||||
/**
|
|
||||||
* Set the cookies list in the modal
|
|
||||||
*/
|
|
||||||
setupCookieModalList(): void;
|
|
||||||
switchToModalPageOrClose(): void;
|
|
||||||
/**
|
|
||||||
* Toggle Cookie modal pages
|
|
||||||
*/
|
|
||||||
toggleCookieModalPages(): void;
|
|
||||||
/**
|
|
||||||
* Toggle customize btn
|
|
||||||
*/
|
|
||||||
togglePersonalizeBtn(): void;
|
|
||||||
/**
|
|
||||||
* Get the actual page: banner or modal (with cookie choices)
|
|
||||||
*/
|
|
||||||
isOnBannerPage(): boolean;
|
|
||||||
/**
|
|
||||||
* Invert cookie status
|
|
||||||
*
|
|
||||||
* @param status
|
|
||||||
* @returns Inverted cookie status, `wait` will give `false`.
|
|
||||||
*/
|
|
||||||
private invertCookieStatus;
|
|
||||||
}
|
|
||||||
declare enum CookieStatus {
|
|
||||||
true = "true",
|
|
||||||
false = "false",
|
|
||||||
wait = "wait"
|
|
||||||
}
|
|
||||||
type CookieStatusList = Record<string, CookieStatus>;
|
|
||||||
type CookiePolicy = {
|
|
||||||
sameSite: CookiePolicySameSite;
|
|
||||||
secure: string;
|
|
||||||
};
|
|
||||||
declare enum CookiePolicySameSite {
|
|
||||||
lax = "lax",
|
|
||||||
strict = "strict",
|
|
||||||
none = "none"
|
|
||||||
}
|
|
||||||
export type CookieOptions = {
|
|
||||||
name: string;
|
|
||||||
description: string;
|
|
||||||
link: string;
|
|
||||||
labelLink: string;
|
|
||||||
cookies: string[];
|
|
||||||
/**
|
|
||||||
* Fonction qui sert à initialiser la fonctionnalité
|
|
||||||
* conduisant à la génération du cookie
|
|
||||||
* @return void
|
|
||||||
*/
|
|
||||||
script: () => void;
|
|
||||||
/**
|
|
||||||
* Fonction qui sert à informer l'utilisateur
|
|
||||||
* sur chaque élèment que le cookie
|
|
||||||
* associé à la fonctionnalité
|
|
||||||
* est désactivé et propose un lien sur
|
|
||||||
* cookie notice pour l'activer
|
|
||||||
* @return void
|
|
||||||
*/
|
|
||||||
fallback: () => void | null;
|
|
||||||
};
|
|
||||||
export {};
|
|
||||||
438
dist/umd/css/standard.css
vendored
438
dist/umd/css/standard.css
vendored
|
|
@ -1,438 +0,0 @@
|
||||||
@charset "UTF-8";
|
|
||||||
:root {
|
|
||||||
--cs-primary-color: var();
|
|
||||||
}
|
|
||||||
|
|
||||||
/* Distance par rapport à la gauche de la fenêtre */
|
|
||||||
/* Distance par rapport à la droite de la fenêtre */
|
|
||||||
/* Distance par rapport au bas de la fenêtre */
|
|
||||||
/* Position gauche de base des cookies */
|
|
||||||
/* Position droite de base des cookies */
|
|
||||||
#cn-wrapper {
|
|
||||||
/* Buttons styles start */
|
|
||||||
/* Button styles end */
|
|
||||||
}
|
|
||||||
#cn-wrapper * {
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
#cn-wrapper *::before {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
#cn-wrapper button {
|
|
||||||
display: inline-block;
|
|
||||||
padding: 0.2rem 0.5rem;
|
|
||||||
border: 0;
|
|
||||||
margin: 0;
|
|
||||||
appearance: none;
|
|
||||||
background: #d6d6d6;
|
|
||||||
color: #000;
|
|
||||||
cursor: pointer;
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 1rem;
|
|
||||||
line-height: 1;
|
|
||||||
text-align: center;
|
|
||||||
text-decoration: none;
|
|
||||||
transition: background 250ms ease-in-out, transform 150ms ease;
|
|
||||||
}
|
|
||||||
#cn-wrapper button:hover,
|
|
||||||
#cn-wrapper button:focus {
|
|
||||||
background: #bdbdbd;
|
|
||||||
/* prettier-ignore */
|
|
||||||
color: #000;
|
|
||||||
}
|
|
||||||
#cn-wrapper button:focus {
|
|
||||||
outline: 1px solid;
|
|
||||||
/* prettier-ignore */
|
|
||||||
outline-color: #000;
|
|
||||||
outline-offset: -4px;
|
|
||||||
}
|
|
||||||
#cn-wrapper button:active {
|
|
||||||
transform: scale(0.99);
|
|
||||||
}
|
|
||||||
|
|
||||||
/** 5.0.4 */
|
|
||||||
/* FENETRE D'ACCUEIL */
|
|
||||||
/* Title settings */
|
|
||||||
/* Text settings */
|
|
||||||
/* Button settings */
|
|
||||||
/* Title settings */
|
|
||||||
/* Text settings */
|
|
||||||
/* Switch Buttons */
|
|
||||||
/* Cookies list settings */
|
|
||||||
/* Size */
|
|
||||||
#cn-wrapper .cn-nav #cn-settings-banner, #cn-wrapper .cn-nav #cn-accept-banner, #cn-wrapper .cn-nav #cn-deny-banner, #cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal {
|
|
||||||
display: flex;
|
|
||||||
height: 3rem;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
padding: 0;
|
|
||||||
background-color: #d6d6d6;
|
|
||||||
color: #000;
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-settings-banner:hover, #cn-wrapper .cn-nav #cn-accept-banner:hover, #cn-wrapper .cn-nav #cn-deny-banner:hover, #cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal:hover, #cn-wrapper .cn-nav #cn-settings-banner:focus, #cn-wrapper .cn-nav #cn-accept-banner:focus, #cn-wrapper .cn-nav #cn-deny-banner:focus, #cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal:focus {
|
|
||||||
background-color: #bdbdbd;
|
|
||||||
/* prettier-ignore */
|
|
||||||
color: #000;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-settings-banner:focus, #cn-wrapper .cn-nav #cn-accept-banner:focus, #cn-wrapper .cn-nav #cn-deny-banner:focus, #cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal:focus {
|
|
||||||
/* prettier-ignore */
|
|
||||||
outline-color: #000;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cn-modal-bg {
|
|
||||||
position: fixed;
|
|
||||||
z-index: 1030;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100vw;
|
|
||||||
height: 100dvh;
|
|
||||||
background-color: rgba(0, 0, 0, 0.6);
|
|
||||||
cursor: pointer;
|
|
||||||
opacity: 0;
|
|
||||||
transition: 0.3s;
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
.cn-modal-bg-active {
|
|
||||||
cursor: default;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cn-open .cn-modal-bg {
|
|
||||||
opacity: 1;
|
|
||||||
visibility: visible;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cn-disabled {
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
#cn-wrapper {
|
|
||||||
position: fixed;
|
|
||||||
z-index: 1050;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100vw;
|
|
||||||
height: 100dvh;
|
|
||||||
pointer-events: none;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-cookie-btn {
|
|
||||||
position: fixed;
|
|
||||||
right: auto;
|
|
||||||
bottom: 0.5rem;
|
|
||||||
left: 0.5rem;
|
|
||||||
width: 2.4rem;
|
|
||||||
height: 2.4rem;
|
|
||||||
padding: 0.3rem;
|
|
||||||
border-radius: 100%;
|
|
||||||
background-color: #fff;
|
|
||||||
box-shadow: 0 0.1rem 1rem rgba(0, 0, 0, 0.35);
|
|
||||||
cursor: pointer;
|
|
||||||
pointer-events: auto;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper #cn-cookie-btn {
|
|
||||||
right: auto;
|
|
||||||
bottom: -1.5rem;
|
|
||||||
left: -1.5rem;
|
|
||||||
width: 3rem;
|
|
||||||
height: 3rem;
|
|
||||||
padding: 0.5rem;
|
|
||||||
transition: all 1s 6s;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-cookie-btn:hover, #cn-wrapper #cn-cookie-btn:focus {
|
|
||||||
right: auto;
|
|
||||||
bottom: 0.5rem;
|
|
||||||
left: 0.5rem;
|
|
||||||
transition: all 1s;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-cookie-btn:focus {
|
|
||||||
outline-color: #d1842a;
|
|
||||||
outline-offset: 0.1rem;
|
|
||||||
outline-width: 0.2rem;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-cookie-btn-icon path {
|
|
||||||
fill: #dc9c52;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-cookie-btn-icon circle {
|
|
||||||
fill: #dc9c52;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-banner {
|
|
||||||
position: absolute;
|
|
||||||
z-index: 1050;
|
|
||||||
top: 0;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
display: flex;
|
|
||||||
width: 100vw;
|
|
||||||
max-height: 100dvh;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: flex-end;
|
|
||||||
padding: 0;
|
|
||||||
border-radius: 0;
|
|
||||||
margin: auto;
|
|
||||||
margin-bottom: 0;
|
|
||||||
background-color: #fff;
|
|
||||||
box-shadow: 0 0.1rem 1rem rgba(0, 0, 0, 0.35);
|
|
||||||
line-height: initial;
|
|
||||||
opacity: 0;
|
|
||||||
pointer-events: none;
|
|
||||||
transition: 0.3s;
|
|
||||||
user-select: none;
|
|
||||||
visibility: hidden;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-banner .cn-modal-top-line {
|
|
||||||
align-self: end;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal {
|
|
||||||
width: 4rem;
|
|
||||||
height: 3rem;
|
|
||||||
border-bottom-left-radius: 0.5rem;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper #cn-banner .cn-modal-top-line #cn-close-modal {
|
|
||||||
border-top-right-radius: 0.5rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-banner > * {
|
|
||||||
pointer-events: all;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper #cn-banner {
|
|
||||||
right: auto;
|
|
||||||
bottom: calc(0.5rem + 60px);
|
|
||||||
left: 0;
|
|
||||||
width: 30rem;
|
|
||||||
max-height: 26rem;
|
|
||||||
border-radius: 0.5rem;
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-banner.cn-modal-page {
|
|
||||||
max-height: 38rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cn-wrapper #cn-li-template {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
#cn-wrapper .d-none {
|
|
||||||
display: none !important;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content {
|
|
||||||
flex-grow: 1;
|
|
||||||
padding: 0.8rem;
|
|
||||||
overflow-y: auto;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper .cn-content {
|
|
||||||
flex-grow: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch {
|
|
||||||
position: relative;
|
|
||||||
display: inline-block;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 4.2rem;
|
|
||||||
height: 2.4rem;
|
|
||||||
box-sizing: content-box;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch:focus, #cn-wrapper .cn-content .cn-switch:focus-visible {
|
|
||||||
border-width: 0.1rem;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: #b7b7b7;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input + span {
|
|
||||||
position: absolute;
|
|
||||||
border-radius: 2rem;
|
|
||||||
background: #b7b7b7;
|
|
||||||
inset: 0;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input + span::before {
|
|
||||||
position: absolute;
|
|
||||||
top: 50%;
|
|
||||||
left: 0.21rem;
|
|
||||||
display: inline-block;
|
|
||||||
width: 1.8rem;
|
|
||||||
height: 1.8rem;
|
|
||||||
border-radius: 50%;
|
|
||||||
background: #fff;
|
|
||||||
content: "";
|
|
||||||
transform: translateY(-50%);
|
|
||||||
transition: all 0.5s;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input:indeterminate + span {
|
|
||||||
background: #b7b7b7;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input:indeterminate + span::before {
|
|
||||||
left: 1.08rem;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input:checked + span {
|
|
||||||
background: #b7b7b7;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-switch input:checked + span::before {
|
|
||||||
left: 2.16rem;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content {
|
|
||||||
display: flex;
|
|
||||||
min-height: 100%;
|
|
||||||
flex-direction: column;
|
|
||||||
color: #707070;
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content {
|
|
||||||
flex-flow: row wrap;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-img {
|
|
||||||
width: 33%;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-text {
|
|
||||||
width: 66%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-img {
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-img img {
|
|
||||||
width: 90%;
|
|
||||||
object-fit: contain;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-text .cn-banner-title {
|
|
||||||
color: #dc9c52;
|
|
||||||
font-family: "Satisfy", sans-serif;
|
|
||||||
font-size: 28px;
|
|
||||||
font-weight: bold;
|
|
||||||
line-height: inherit;
|
|
||||||
text-align: left;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-banner-content .cn-banner-text .cn-banner-para-p {
|
|
||||||
margin: 6px 0;
|
|
||||||
text-align: justify;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper {
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
overflow: auto;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
/* stylelint-disable-next-line no-descending-specificity */
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper ul {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
list-style: none;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper .cn-cookie-wrapper {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
padding: 20px;
|
|
||||||
border: 1px solid #e4e4e4;
|
|
||||||
border-radius: 20px;
|
|
||||||
margin: 10px 0;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper span {
|
|
||||||
color: #dc9c52;
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper a {
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-modal-wrapper label {
|
|
||||||
color: #dc9c52;
|
|
||||||
font-family: "Barlow", sans-serif;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-cookie-name {
|
|
||||||
color: #dc9c52;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-cookie-infos {
|
|
||||||
display: flex;
|
|
||||||
width: 100%;
|
|
||||||
flex: 1;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-cookie-infos span:first-of-type {
|
|
||||||
font-size: calc(16px * 1.25);
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-cookie-infos .cn-cookie-description {
|
|
||||||
color: #707070;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-content .cn-modal-container .cn-cookie-infos a {
|
|
||||||
width: fit-content;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav {
|
|
||||||
display: flex;
|
|
||||||
overflow: hidden;
|
|
||||||
width: 100%;
|
|
||||||
height: 6rem;
|
|
||||||
flex-shrink: 0;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
align-items: center;
|
|
||||||
border-top: 1px solid #6d6d6d;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-deny-banner {
|
|
||||||
width: 50%;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-accept-banner {
|
|
||||||
width: 50%;
|
|
||||||
border-right: 1px solid #6d6d6d;
|
|
||||||
border-left: 1px solid #6d6d6d;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-settings-banner {
|
|
||||||
width: 100%;
|
|
||||||
border-top: 1px solid #6d6d6d;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
#cn-wrapper .cn-nav {
|
|
||||||
height: 3rem;
|
|
||||||
flex-wrap: initial;
|
|
||||||
border-bottom-left-radius: 0.5rem;
|
|
||||||
border-bottom-right-radius: 0.5rem;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-deny-banner {
|
|
||||||
width: 33.33%;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-accept-banner {
|
|
||||||
width: 33.33%;
|
|
||||||
}
|
|
||||||
#cn-wrapper .cn-nav #cn-settings-banner {
|
|
||||||
width: 33.33%;
|
|
||||||
border-top: initial;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.cn-open {
|
|
||||||
overflow: hidden !important;
|
|
||||||
}
|
|
||||||
.cn-open #cn-wrapper #cn-banner {
|
|
||||||
opacity: 1;
|
|
||||||
visibility: visible;
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
.cn-open #cn-wrapper #cn-banner {
|
|
||||||
right: auto;
|
|
||||||
left: 0.5rem;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@media (min-width: 535px) {
|
|
||||||
.cn-open #cn-wrapper #cn-cookie-btn {
|
|
||||||
right: auto;
|
|
||||||
bottom: 0.5rem;
|
|
||||||
left: 0.5rem;
|
|
||||||
transition: all 1s;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
1032
dist/umd/main.js
vendored
1032
dist/umd/main.js
vendored
File diff suppressed because it is too large
Load diff
1
dist/umd/main.js.map
vendored
1
dist/umd/main.js.map
vendored
File diff suppressed because one or more lines are too long
|
|
@ -34,6 +34,7 @@
|
||||||
"build": "rm -rf ./dist/umd && webpack --progress && npm run buildbrowser",
|
"build": "rm -rf ./dist/umd && webpack --progress && npm run buildbrowser",
|
||||||
"buildbrowser": "rm -rf ./dist/browser && node ./node_modules/.bin/rollup --bundleConfigAsCjs -c rollup.config.js",
|
"buildbrowser": "rm -rf ./dist/browser && node ./node_modules/.bin/rollup --bundleConfigAsCjs -c rollup.config.js",
|
||||||
"prebuild": "npm run stylelint && npm run eslint && rm -rf ./dist/typings && rm -rf ./dist/esm && tsc -p ./tsconfig.json",
|
"prebuild": "npm run stylelint && npm run eslint && rm -rf ./dist/typings && rm -rf ./dist/esm && tsc -p ./tsconfig.json",
|
||||||
|
"buildPackage": "git checkout main && git reset && git merge --no-ff --no-commit -m \"chore: 📦 Npm run build\" develop && npm run prebuild && npm run build && git add -f \"dist/\" && git commit --no-edit && echo 'DONE !!';",
|
||||||
"eslint": "node ./node_modules/.bin/eslint --max-warnings 0 -c .eslintrc.json ./src",
|
"eslint": "node ./node_modules/.bin/eslint --max-warnings 0 -c .eslintrc.json ./src",
|
||||||
"eslint-fix": "node ./node_modules/.bin/eslint --fix --max-warnings 0 -c .eslintrc.json ./src",
|
"eslint-fix": "node ./node_modules/.bin/eslint --fix --max-warnings 0 -c .eslintrc.json ./src",
|
||||||
"eslint-ci": "node ./node_modules/.bin/eslint --max-warnings 0 -c .eslintrc.json ./src -f junit",
|
"eslint-ci": "node ./node_modules/.bin/eslint --max-warnings 0 -c .eslintrc.json ./src -f junit",
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue