Merge pull request #462 from clemdesign/master

Manage cookie icon
This commit is contained in:
Amauri CHAMPEAUX 2020-10-10 10:18:17 +02:00 committed by GitHub
commit 48ed45ba1c
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 56 additions and 1 deletions

View File

@ -39,6 +39,9 @@ tarteaucitron.init({
"orientation": "middle", /* Banner position (top - bottom) */ "orientation": "middle", /* Banner position (top - bottom) */
"showAlertSmall": true, /* Show the small banner on bottom right */ "showAlertSmall": true, /* Show the small banner on bottom right */
"cookieslist": true, /* Show the cookie list */ "cookieslist": true, /* Show the cookie list */
"showIcon": true, /* Show cookie icon to manage cookies */
"iconPosition": "BottomRight", /* Position of the icon between BottomRight, BottomLeft, TopRight and TopLeft */
"adblocker": false, /* Show a Warning if an adblocker is detected */ "adblocker": false, /* Show a Warning if an adblocker is detected */
"DenyAllCta" : true, /* Show the deny all button */ "DenyAllCta" : true, /* Show the deny all button */

View File

@ -495,7 +495,7 @@ div#tarteaucitronServices {
text-align: center; text-align: center;
padding: 10px 0 10px 0; padding: 10px 0 10px 0;
margin: auto; margin: auto;
width: 100%; width: calc(100% - 20px); /* 100 % - padding-right - padding-left */
} }
#tarteaucitronAlertBig #tarteaucitronPrivacyUrl, #tarteaucitronAlertBig #tarteaucitronPrivacyUrl,
@ -556,6 +556,46 @@ div#tarteaucitronServices {
z-index: 2147483644; z-index: 2147483644;
} }
/***
* Icon
*/
.tarteaucitronIconBottomRight {
bottom: 0;
right: 0;
}
.tarteaucitronIconBottomLeft {
bottom: 0;
left: 0;
}
.tarteaucitronIconTopRight {
top: 0;
right: 0;
}
.tarteaucitronIconTopLeft {
top: 0;
left: 0;
}
#tarteaucitronIcon {
background: transparent;
position: fixed;
display: none;
width: auto;
z-index: 2147483646;
}
#tarteaucitronIcon #tarteaucitronManager {
color: transparent;
cursor: pointer;
display: inline-block;
font-size: 11px !important;
padding: 8px 10px 8px;
border: none;
}
#tarteaucitronIcon #tarteaucitronManager img {
width: 50px;
height: 50px;
}
/*** /***
* Small alert * Small alert
*/ */

View File

@ -208,6 +208,8 @@ var tarteaucitron = {
"bodyPosition": "bottom", "bodyPosition": "bottom",
"removeCredit": false, "removeCredit": false,
"showAlertSmall": true, "showAlertSmall": true,
"showIcon": true,
"iconPosition": "BottomRight",
"cookieslist": true, "cookieslist": true,
"handleBrowserDNTRequest": false, "handleBrowserDNTRequest": false,
"DenyAllCta": true, "DenyAllCta": true,
@ -430,6 +432,14 @@ var tarteaucitron = {
html += '<div id="tarteaucitronPercentage"></div>'; html += '<div id="tarteaucitronPercentage"></div>';
} }
if (tarteaucitron.parameters.showIcon === true) {
html += '<div id="tarteaucitronIcon" class="tarteaucitronIcon' + tarteaucitron.parameters.iconPosition + '">';
html += ' <button type="button" id="tarteaucitronManager" onclick="tarteaucitron.userInterface.openPanel();">';
html += ' <img src="data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiPz4NCjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iMTI5OXB4IiBoZWlnaHQ9IjEyOTlweCIgdmVyc2lvbj0iMS4xIiBzdHlsZT0ic2hhcGUtcmVuZGVyaW5nOmdlb21ldHJpY1ByZWNpc2lvbjsgdGV4dC1yZW5kZXJpbmc6Z2VvbWV0cmljUHJlY2lzaW9uOyBpbWFnZS1yZW5kZXJpbmc6b3B0aW1pemVRdWFsaXR5OyBmaWxsLXJ1bGU6ZXZlbm9kZDsgY2xpcC1ydWxlOmV2ZW5vZGQiDQp2aWV3Qm94PSIwIDAgMTI5OSAxMjk5Ig0KIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIg0KIGRhdGEtbmFtZT0iTGF5ZXIgMSI+DQogPGRlZnM+DQogIDxzdHlsZSB0eXBlPSJ0ZXh0L2NzcyI+DQogICA8IVtDREFUQVsNCiAgICAuc3RyMCB7c3Ryb2tlOiM0OTM1Mjc7c3Ryb2tlLXdpZHRoOjQ4LjQ0O3N0cm9rZS1saW5lam9pbjpyb3VuZDtzdHJva2UtbWl0ZXJsaW1pdDoyMi45MjU2fQ0KICAgIC5maWwxIHtmaWxsOm5vbmV9DQogICAgLmZpbDIge2ZpbGw6I0Q2QzE3NX0NCiAgICAuZmlsMCB7ZmlsbDojRUZFMkIyfQ0KICAgXV0+DQogIDwvc3R5bGU+DQogPC9kZWZzPg0KIDxnIGlkPSJQbGFuX3gwMDIwXzEiPg0KICA8bWV0YWRhdGEgaWQ9IkNvcmVsQ29ycElEXzBDb3JlbC1MYXllciIvPg0KICA8cGF0aCBjbGFzcz0iZmlsMCIgZD0iTTExOTEuOTggNjQ5LjVjMCwwLjE2IDAsMC40MyAwLDAuNTYgMCwyOTkuNTUgLTI0Mi45Myw1NDIuNDggLTU0Mi40OCw1NDIuNDggLTI2Ny45NiwwIC00OTUuODUsLTE5NS44NCAtNTM2LjI1LC00NjAuNjkgMCwtMC43MiAtMC4yNSwtMS40NSAtMC4yOSwtMi4xOCAtMy45NiwtMjYuNDYgLTUuOTUsLTUzLjMyIC01Ljk1LC04MC4xMSAwLC00NC4wOCA1LjM4LC04OC4xIDE1Ljk1LC0xMzAuODUgNC45NiwtMjAuNDIgMTEuMzcsLTQwLjYzIDE4Ljc2LC02MC4zMiA3OS41MywtMjExLjMgMjgxLjg1LC0zNTEuMzcgNTA3LjY5LC0zNTEuMzcgMCwwIDAuMDcsMCAwLjA3LDBsMS4wOSAwYzExLjEsMTYyLjQxIDE0Ni4xNCwyODguNDggMzA4LjkyLDI4OC40OCA5LjAxLDAgMTcuODcsLTAuMzggMjYuNjksLTEuMTYgMi4wOSwxNS43IDUuNTEsMzEuMjkgMTAuMDcsNDYuNDMgMjguNjIsOTUuNTUgMTAxLjQ2LDE3MS42MSAxOTUuNzIsMjA0LjI0IDAuMDEsMS40OSAwLjAxLDIuOTkgMC4wMSw0LjQ5eiIvPg0KICA8cGF0aCBjbGFzcz0iZmlsMSBzdHIwIiBkPSJNMTE5MS45OCA2NDkuNWMwLDI5OS41NSAtMjQyLjkzLDU0Mi40OCAtNTQyLjQ4LDU0Mi40OCAtMjk5LjU1LDAgLTU0Mi40OCwtMjQyLjkzIC01NDIuNDgsLTU0Mi40OCAwLC0yOTkuNTUgMjQyLjkzLC01NDIuNDggNTQyLjQ4LC01NDIuNDhsMS4wNyAwYzExLjEsMTYyLjQxIDE0Ni4xNCwyODguNDggMzA4LjkyLDI4OC40OCA5LjAxLDAgMTcuODcsLTAuMzggMjYuNjksLTEuMTYgMi4wOSwxNS43IDUuNTEsMzEuMjkgMTAuMDcsNDYuNDMgMjguNTMsOTUuNTkgMTAxLjQ2LDE3MS42NiAxOTUuNzMsMjA0LjI0IDAsMS40OSAwLDIuOTkgMCw0LjQ5eiIvPg0KICA8cGF0aCBjbGFzcz0iZmlsMiBzdHIwIiBkPSJNNDIwLjg4IDg2MS42Yy0yLjQ2LDAuMjIgLTQuOTYsMC4zMyAtNy40MywwLjMzIC00My4wMiwwIC03OS4xMiwtMzIuNDkgLTgzLjYzLC03NS4yNiAtMC4yOSwtMi40MiAtMC40NSwtNC44NSAtMC40NSwtNy4yOCAwLC00LjM4IDAuNDksLTguNzUgMS40NywtMTMuMDIgNC4yMiwtMTcuMjQgMTguMjIsLTMwLjcxIDMzLjkxLC0zOC43NSAxMy41MiwtNi45MSAyOC41MywtMTAuNTMgNDMuNzMsLTEwLjUzIDUzLjAzLDAgOTYuMDQsNDMuMDIgOTYuMDQsOTYuMDUgMCwyLjY1IC0wLjExLDUuMzMgLTAuMzIsNy45NmwwIDAuNTRjLTIuNDcsMjMuMzYgLTIyLjE4LDQxLjExIC00NS42Nyw0MS4xMSAtMC42LDAgLTEuMjEsLTAuMDEgLTEuODEsLTAuMDNsLTM1Ljg0IC0xLjEyeiIvPg0KICA8cGF0aCBjbGFzcz0iZmlsMiBzdHIwIiBkPSJNOTEwLjI4IDY5NC44OGMtMS43NiwtMC4xMSAtMy41NSwtMC4xOSAtNS4zMSwtMC4xOSAtOC4wNywwIC0xNi4xMSwxLjMyIC0yMy43NSwzLjg4IC0xNy4wNCw1LjcxIC0zMy44MiwxMi43IC00OS45MSwyMC42NyAtMTQuNTksNi42NCAtMjguMDQsMTUuNzEgLTM5LjY2LDI2Ljc1IC0yOS4wNiwyOS45NCAtMzIuODksNzcuNSAtMjEuMzYsMTE3LjY1IDAuOTUsNC4yOSAyLjg0LDguMzMgNS41MywxMS44MSAzLjQ5LDMuNDMgNy44Nyw1Ljg0IDEyLjY0LDYuOTMgNy4xOSwxLjk0IDE0LjYxLDIuOTIgMjIuMDUsMi45MiA4LjQzLDAgMTYuODMsLTEuMjcgMjQuODgsLTMuNzQgMjkuMDcsLTguNjMgNTcuNjgsLTE4LjMxIDg1LjgzLC0yOS4wNyAxMS42NSwtMy41OSAyMi40NywtOS41NiAzMS43MywtMTcuNDggOC4wOSwtOC43MiAxNC4wNCwtMTkuMjQgMTcuMzQsLTMwLjY2IDIuOTMsLTguNiA1LjE3LC0xNy40NyA2LjU1LC0yNi40NCAwLjUsLTMuNSAwLjc2LC03LjA2IDAuNzYsLTEwLjYgMCwtMzguMTQgLTI5LjQ4LC02OS43OSAtNjcuNTEsLTcyLjQ4bDAuMTkgMC4wNXoiLz4NCiAgPHBhdGggY2xhc3M9ImZpbDIgc3RyMCIgZD0iTTU5OC4xNiAzNTUuNjljLTQuMTksLTAuNDcgLTguNDIsLTAuNzEgLTEyLjY0LC0wLjcxIC0yMy40MywwIC00Ni4yOSw3LjM2IC02NS4zNCwyMS4wMWwtMC4zOCAwLjI5Yy0xOC40NiwxMy4yNyAtMzguMTcsMjkuNzQgLTM0LjY4LDU1LjA3IDEuOTUsMTIuMzEgOC42MSwyMy40MSAxOC41NCwzMC45NSAyMC43MywxNi41MSA0Ny4xOCwxOC40IDcyLjY2LDIwLjA1bDM2LjgxIDIuMzdjMTQuNTMsMC45NyAzMC44LDEuMzEgNDEuNTYsLTguNDMgNC45MiwtNC45NCA4LjY2LC0xMC45NyAxMC44OSwtMTcuNTggNS4wNCwtMTEuODUgNy42NCwtMjQuNTkgNy42NCwtMzcuNDYgMCwtMy44OSAtMC4yNSwtNy44IC0wLjcxLC0xMS42NSAtMi4xOCwtMTYuODIgLTExLjM0LC0zMS45NyAtMjUuMjQsLTQxLjcxIC0xMy44NSwtOS4wMSAtMzEuMDQsLTEwLjY1IC00Ny41MSwtMTIuMDZsLTEuNiAtMC4xNHoiLz4NCiA8L2c+DQo8L3N2Zz4NCg==" alt="Cookies">';
html += ' </button>';
html += '</div>';
}
if (tarteaucitron.parameters.showAlertSmall === true) { if (tarteaucitron.parameters.showAlertSmall === true) {
html += '<div id="tarteaucitronAlertSmall" class="tarteaucitronAlertSmall' + orientation + '">'; html += '<div id="tarteaucitronAlertSmall" class="tarteaucitronAlertSmall' + orientation + '">';
html += ' <button type="button" id="tarteaucitronManager">'; html += ' <button type="button" id="tarteaucitronManager">';
@ -1042,6 +1052,7 @@ var tarteaucitron = {
var c = 'tarteaucitron'; var c = 'tarteaucitron';
tarteaucitron.userInterface.css(c + 'Percentage', 'display', 'block'); tarteaucitron.userInterface.css(c + 'Percentage', 'display', 'block');
tarteaucitron.userInterface.css(c + 'AlertSmall', 'display', 'none'); tarteaucitron.userInterface.css(c + 'AlertSmall', 'display', 'none');
tarteaucitron.userInterface.css(c + 'Icon', 'display', 'none');
tarteaucitron.userInterface.css(c + 'AlertBig', 'display', 'block'); tarteaucitron.userInterface.css(c + 'AlertBig', 'display', 'block');
tarteaucitron.userInterface.addClass(c + 'Root', 'tarteaucitronBeforeVisible'); tarteaucitron.userInterface.addClass(c + 'Root', 'tarteaucitronBeforeVisible');
@ -1062,6 +1073,7 @@ var tarteaucitron = {
var c = 'tarteaucitron'; var c = 'tarteaucitron';
tarteaucitron.userInterface.css(c + 'Percentage', 'display', 'none'); tarteaucitron.userInterface.css(c + 'Percentage', 'display', 'none');
tarteaucitron.userInterface.css(c + 'AlertSmall', 'display', 'block'); tarteaucitron.userInterface.css(c + 'AlertSmall', 'display', 'block');
tarteaucitron.userInterface.css(c + 'Icon', 'display', 'block');
tarteaucitron.userInterface.css(c + 'AlertBig', 'display', 'none'); tarteaucitron.userInterface.css(c + 'AlertBig', 'display', 'none');
tarteaucitron.userInterface.removeClass(c + 'Root', 'tarteaucitronBeforeVisible'); tarteaucitron.userInterface.removeClass(c + 'Root', 'tarteaucitronBeforeVisible');
tarteaucitron.userInterface.jsSizing('box'); tarteaucitron.userInterface.jsSizing('box');