Bug fix - send pop up back

Extensions/Editor Extensions/Exit Intent Pop-up 2/config.json

@@ -59,9 +59,9 @@
   ],
   "description": "Show a popup modal when the user's mouse leaves the window.",
   "options": {
-    "html": "<div class=\"optly-modal\">\n <div class=\"optly-modal-content\">\n \t<span class=\"optly-modal-close\">x</span>\n \t<div class=\"grid\">\n \t\t<div class=\"grid__cell optly-modal-left\">\n \t\t\t<h1>{{ widget.headline1 }}</h1>\n \t\t\t<h3>{{ widget.description }}</h3>\n \t\t\t<form class=\"optly-modal-form\">\n \t\t\t\t<a href=\"{{ widget.ctaLink }}\"><button class='button button--highlight button--large'>{{ widget.cta }}</button></a>\n \t\t\t</form>\n \t\t</div>\n \t\t<div class=\"grid__cell optly-modal-right\">\n \t\t\t<img src='{{ widget.imageURL }}'>\n \t\t</div>\n \t</div>\n </div>\n</div>",
-    "css": ".optly-modal {\n  opacity: 0;\n  background-color: rgb(0,0,0);\n  background-color: rgba(0,0,0,0.4);\n  height: 100%;\n  left: 0;\n  overflow: auto;\n  padding-top: 9%;\n  position: fixed;\n  top: 0;\n  width: 100%;\n  z-index: 1000;\n}\n\n.optly-modal-close {\n  color: #aaa;\n  float: right;\n  font-family: Helvetica,Arial,sans-serif;\n  font-size: 28px;\n  font-weight: bold;\n  margin: -2%;\n}\n\n.optly-modal-close:hover,\n.optly-modal-close:focus {\n  color: black;\n  cursor: pointer;\n  text-decoration: none;\n}\n\n.optly-modal-content {\n  background-color: #fefefe;\n  margin: auto;\n  padding: 2% 3% 3% 3%;\n  border: 1px solid #888;\n  width: 80%;\n  max-width: 1100px;\n  position: relative;\n}\n\n.optly-modal-left {\n\tmargin-top: 5%\n}\n\n.optly-modal-left h1 {\n color: #0F75B2;\n font-size: 3em;\n line-height: 1.2em;\n margin-bottom: 20px;\n}\n\n.optly-modal-left h3 {\n font-size: 1.5em;\n color:rgba(0,0,0,0.5);\n margin-bottom: 20px;\n}\n\n.optly-modal-right img {\n margin-top: 0%;\n max-height:90%;\n max-width:90%;\n border: 1px solid transparent;\n border-radius: 8px;\n}\n\n.grid {\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-flex-wrap: wrap;\n  -ms-flex-wrap: wrap;\n  flex-wrap: wrap;\n  margin-left: -20px; }\n  \n  .grid__cell {\n    -webkit-flex: 1;\n    -ms-flex: 1;\n    flex: 1;\n    padding-left: 20px; }\n  \n  .grid--gutter--narrow {\n    margin-left: -10px; }\n    \n    .grid--gutter--narrow > .grid__cell {\n      padding-left: 10px; }\n  \n  .grid--gutter--wide {\n    margin-left: -40px; }\n    \n    .grid--gutter--wide > .grid__cell {\n      padding-left: 40px; }\n  \n  .grid--flush {\n    margin-left: 0; }\n    \n    .grid--flush > .grid__cell {\n      padding-left: 0; }\n  \n  .grid--natural > .grid__cell {\n    -webkit-flex: none;\n    -ms-flex: none;\n    flex: none; }\n  \n  .grid--center {\n    -webkit-align-items: center;\n    -ms-flex-align: center;\n    -ms-grid-row-align: center;\n    align-items: center; }\n  \n  .grid--bottom {\n    -webkit-align-items: flex-end;\n    -ms-flex-align: end;\n    -ms-grid-row-align: flex-end;\n    align-items: flex-end; }\n  \n  .grid__cell[class*=\"width-\"] {\n    -webkit-flex: none;\n    -ms-flex: none;\n    flex: none; }\n\n\n.button {\n  display: inline-block;\n  vertical-align: middle;\n  white-space: nowrap;\n  font-family: inherit;\n  cursor: pointer;\n  margin: 0;\n  line-height: 32px;\n  border-width: 1px;\n  border-style: solid;\n  font-size: 13px;\n  font-weight: 400;\n  border-radius: 2px;\n  height: 34px;\n  padding: 0 15px;\n  background-color: #F6F6F7;\n  border-color: #CDD0D8;\n  color: #262626; }\n  \n  .button:visited {\n    color: #262626; }\n  \n  .button:hover {\n    color: #262626;\n    box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.16); }\n  \n  .button.is-active,\n  .button:active {\n    background: #64738A;\n    border-color: #3B5871;\n    color: #FFF;\n    box-shadow: inset 1px 0 3px 0 rgba(0, 0, 0, 0.5);\n    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); }\n  \n  .button--highlight {\n    background-color: #0F75B2;\n    border-color: #0E699F;\n    color: #FFF;\n    text-shadow: 1px 0 1px rgba(0, 0, 0, 0.2); }\n    \n    .button--highlight:hover {\n      background: #0081BA;\n      border-color: #0176A9; }\n    \n    .button--highlight:active {\n      background: #0074B4;\n      border-color: #005584;\n      box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5); }\n    \n    .button--highlight:visited,\n    .button--highlight:hover,\n    .button--highlight:active,\n    .button--highlight:focus {\n      color: #FFF; }\n  \n  .button--outline {\n    background-color: transparent;\n    border-color: #8D96A8;\n    color: #64738A; }\n    \n    .button--outline:visited {\n      color: #64738A; }\n    \n    .button--outline:hover {\n      background-color: transparent;\n      border-color: #0074B4;\n      color: #0074B4;\n      text-shadow: none;\n      box-shadow: none; }\n    \n    .button--outline:active {\n      background-color: transparent;\n      border-color: #00415D;\n      color: #00415D;\n      text-shadow: none;\n      box-shadow: none; }\n  \n  .button--outline-reverse {\n    background-color: transparent;\n    border-color: #FFF;\n    color: #FFF; }\n    \n    .button--outline-reverse:visited {\n      color: #FFF; }\n    \n    .button--outline-reverse:hover {\n      background: transparent;\n      border-color: #E0E1E5;\n      color: #E5E5E9; }\n    \n    .button--outline-reverse:active {\n      background: transparent;\n      border-color: #FFF;\n      color: #FFF; }\n  \n  .button--danger {\n    background-color: #E8464E;\n    border-color: #AA161E;\n    color: #FFF;\n    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3); }\n    \n    .button--danger:hover {\n      background: #F35E65;\n      border-color: #AC192B; }\n    \n    .button--danger:active {\n      background: #CB2D35;\n      border-color: #8F192B; }\n    \n    .button--danger:visited,\n    .button--danger:hover,\n    .button--danger:active,\n    .button--danger:focus {\n      color: #FFF; }\n  \n  .button--plain {\n    color: #00415D;\n    border-color: transparent;\n    background-color: transparent;\n    text-shadow: none;\n    box-shadow: none; }\n    \n    .button--plain:hover {\n      color: #8D96A8; }\n    \n    .button--plain:active {\n      color: #00415D; }\n    \n    .button--plain:visited,\n    .button--plain:hover,\n    .button--plain:active,\n    .button--plain:focus {\n      border-color: transparent;\n      background-color: transparent;\n      text-shadow: none;\n      box-shadow: none; }\n  \n  .button--toggle:hover {\n    color: #262626; }\n  \n  .button--toggle:active,\n  .button--toggle.is-active:hover {\n    color: #FFF; }\n  \n  .button--toggle:not(:hover):not(.is-active) {\n    border-color: transparent;\n    background-color: transparent; }\n  \n  .button--small {\n    font-size: 11px;\n    font-weight: 400;\n    border-radius: 2px;\n    line-height: 26px;\n    height: 27px;\n    padding: 0 7px; }\n  \n  .button--large {\n    font-size: 15px;\n    font-weight: 400;\n    border-radius: 2px;\n    line-height: 41px;\n    height: 42px;\n    padding: 0 20px; }\n  \n  .button--narrow {\n    padding-left: 10px;\n    padding-right: 10px; }\n  \n  .button--tight {\n    padding-left: 5px;\n    padding-right: 5px; }\n  \n  .button--full {\n    width: 100%;\n    padding-right: 0;\n    padding-left: 0;\n    text-align: center; }\n  \n  .button--icon {\n    line-height: 1.4; }\n    \n    .button--icon .icon {\n      vertical-align: sub; }\n  \n  .button[disabled],\n  .button--disabled,\n  .button--disabled:visited,\n  .button--disabled:hover,\n  .button--disabled:active,\n  .button--disabled:focus {\n    cursor: default;\n    box-shadow: none;\n    background-color: #EFF0F2;\n    border-color: #E5E5E9;\n    color: #a6a6a6;\n    text-shadow: none;\n    box-shadow: none; }\n    \n    .button[disabled].button--plain,\n    .button--disabled.button--plain,\n    .button--disabled:visited.button--plain,\n    .button--disabled:hover.button--plain,\n    .button--disabled:active.button--plain,\n    .button--disabled:focus.button--plain {\n      background-color: transparent;\n      border-color: transparent; }\n    \n    .button[disabled].button--outline-reverse,\n    .button--disabled.button--outline-reverse,\n    .button--disabled:visited.button--outline-reverse,\n    .button--disabled:hover.button--outline-reverse,\n    .button--disabled:active.button--outline-reverse,\n    .button--disabled:focus.button--outline-reverse {\n      background-color: transparent; }\n\n.fade-in {\n    -webkit-animation: fadein .5s; /* Safari, Chrome and Opera > 12.1 */\n       -moz-animation: fadein .5s; /* Firefox < 16 */\n        -ms-animation: fadein .5s; /* Internet Explorer */\n         -o-animation: fadein .5s; /* Opera < 12.1 */\n            animation: fadein .5s;\n  opacity: 1 !important;\n}\n\n.fade-out {\n    -webkit-animation: fadeout 1s; /* Safari, Chrome and Opera > 12.1 */\n       -moz-animation: fadeout 1s; /* Firefox < 16 */\n        -ms-animation: fadeout 1s; /* Internet Explorer */\n         -o-animation: fadeout 1s; /* Opera < 12.1 */\n            animation: fadeout 1s;\n    opacity: 0 !important;\n}\n\n@keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Firefox < 16 */\n@-moz-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Safari, Chrome and Opera > 12.1 */\n@-webkit-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Internet Explorer */\n@-ms-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Opera < 12.1 */\n@-o-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n@keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Firefox < 16 */\n@-moz-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Safari, Chrome and Opera > 12.1*/\n@-webkit-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Internet Explorer*/\n@-ms-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Opera < 12.1*/\n@-o-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n",
     "apply_js": "var utils = window.optimizely.get('utils');\n\nutils.waitForElement('body').then(function(element){\n\tvar html = widget.$html;\n  var injection = widget.injectionType;\n  element.insertAdjacentHTML('afterbegin', html);\n  element.addEventListener(injection, function(){\n    showPopup();\n\t\tbindCloseBtn();\n  });\n});\n\nfunction showPopup() {\n  if(document.querySelector('.fade-out')){\n\t  document.querySelector('.fade-out').classList.remove('fade-out');\n  }\n  document.querySelector('.optly-modal').classList += ' fade-in';\n}\n\nfunction hidePopup() {\n  document.querySelector('.optly-modal').classList += ' fade-out';\n  window.optimizely = window.optimizely || [];\n\twindow.optimizely.push({\n\t\ttype: \"event\",\n\t\teventName: \"close_modal\"\n\t});\n}\n\nfunction bindCloseBtn() {\n\tdocument.querySelector('.optly-modal-close').addEventListener('click', function(e){\n    hidePopup();\n  });\n}",
+    "html": "<div class=\"optly-modal\">\n <div class=\"optly-modal-content\">\n \t<span class=\"optly-modal-close\">x</span>\n \t<div class=\"grid\">\n \t\t<div class=\"grid__cell optly-modal-left\">\n \t\t\t<h1>{{ widget.headline1 }}</h1>\n \t\t\t<h3>{{ widget.description }}</h3>\n \t\t\t<form class=\"optly-modal-form\">\n \t\t\t\t<a href=\"{{ widget.ctaLink }}\"><button class='button button--highlight button--large'>{{ widget.cta }}</button></a>\n \t\t\t</form>\n \t\t</div>\n \t\t<div class=\"grid__cell optly-modal-right\">\n \t\t\t<img src='{{ widget.imageURL }}'>\n \t\t</div>\n \t</div>\n </div>\n</div>",
+    "css": ".optly-modal {\n  opacity: 0;\n  background-color: rgb(0,0,0);\n  background-color: rgba(0,0,0,0.4);\n  height: 100%;\n  left: 0;\n  overflow: auto;\n  padding-top: 9%;\n  position: fixed;\n  top: 0;\n  width: 100%;\n  z-index: 1000;\n}\n\n.optly-modal-close {\n  color: #aaa;\n  float: right;\n  font-family: Helvetica,Arial,sans-serif;\n  font-size: 28px;\n  font-weight: bold;\n  margin: -2%;\n}\n\n.optly-modal-close:hover,\n.optly-modal-close:focus {\n  color: black;\n  cursor: pointer;\n  text-decoration: none;\n}\n\n.optly-modal-content {\n  background-color: #fefefe;\n  margin: auto;\n  padding: 2% 3% 3% 3%;\n  border: 1px solid #888;\n  width: 80%;\n  max-width: 1100px;\n  position: relative;\n}\n\n.optly-modal-left {\n\tmargin-top: 5%\n}\n\n.optly-modal-left h1 {\n color: #0F75B2;\n font-size: 3em;\n line-height: 1.2em;\n margin-bottom: 20px;\n}\n\n.optly-modal-left h3 {\n font-size: 1.5em;\n color:rgba(0,0,0,0.5);\n margin-bottom: 20px;\n}\n\n.optly-modal-right img {\n margin-top: 0%;\n max-height:90%;\n max-width:90%;\n border: 1px solid transparent;\n border-radius: 8px;\n}\n\n.grid {\n  display: -webkit-flex;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-flex-wrap: wrap;\n  -ms-flex-wrap: wrap;\n  flex-wrap: wrap;\n  margin-left: -20px; }\n  \n  .grid__cell {\n    -webkit-flex: 1;\n    -ms-flex: 1;\n    flex: 1;\n    padding-left: 20px; }\n  \n  .grid--gutter--narrow {\n    margin-left: -10px; }\n    \n    .grid--gutter--narrow > .grid__cell {\n      padding-left: 10px; }\n  \n  .grid--gutter--wide {\n    margin-left: -40px; }\n    \n    .grid--gutter--wide > .grid__cell {\n      padding-left: 40px; }\n  \n  .grid--flush {\n    margin-left: 0; }\n    \n    .grid--flush > .grid__cell {\n      padding-left: 0; }\n  \n  .grid--natural > .grid__cell {\n    -webkit-flex: none;\n    -ms-flex: none;\n    flex: none; }\n  \n  .grid--center {\n    -webkit-align-items: center;\n    -ms-flex-align: center;\n    -ms-grid-row-align: center;\n    align-items: center; }\n  \n  .grid--bottom {\n    -webkit-align-items: flex-end;\n    -ms-flex-align: end;\n    -ms-grid-row-align: flex-end;\n    align-items: flex-end; }\n  \n  .grid__cell[class*=\"width-\"] {\n    -webkit-flex: none;\n    -ms-flex: none;\n    flex: none; }\n\n\n.button {\n  display: inline-block;\n  vertical-align: middle;\n  white-space: nowrap;\n  font-family: inherit;\n  cursor: pointer;\n  margin: 0;\n  line-height: 32px;\n  border-width: 1px;\n  border-style: solid;\n  font-size: 13px;\n  font-weight: 400;\n  border-radius: 2px;\n  height: 34px;\n  padding: 0 15px;\n  background-color: #F6F6F7;\n  border-color: #CDD0D8;\n  color: #262626; }\n  \n  .button:visited {\n    color: #262626; }\n  \n  .button:hover {\n    color: #262626;\n    box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.16); }\n  \n  .button.is-active,\n  .button:active {\n    background: #64738A;\n    border-color: #3B5871;\n    color: #FFF;\n    box-shadow: inset 1px 0 3px 0 rgba(0, 0, 0, 0.5);\n    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.5); }\n  \n  .button--highlight {\n    background-color: #0F75B2;\n    border-color: #0E699F;\n    color: #FFF;\n    text-shadow: 1px 0 1px rgba(0, 0, 0, 0.2); }\n    \n    .button--highlight:hover {\n      background: #0081BA;\n      border-color: #0176A9; }\n    \n    .button--highlight:active {\n      background: #0074B4;\n      border-color: #005584;\n      box-shadow: inset 0 1px 3px 0 rgba(0, 0, 0, 0.5); }\n    \n    .button--highlight:visited,\n    .button--highlight:hover,\n    .button--highlight:active,\n    .button--highlight:focus {\n      color: #FFF; }\n  \n  .button--outline {\n    background-color: transparent;\n    border-color: #8D96A8;\n    color: #64738A; }\n    \n    .button--outline:visited {\n      color: #64738A; }\n    \n    .button--outline:hover {\n      background-color: transparent;\n      border-color: #0074B4;\n      color: #0074B4;\n      text-shadow: none;\n      box-shadow: none; }\n    \n    .button--outline:active {\n      background-color: transparent;\n      border-color: #00415D;\n      color: #00415D;\n      text-shadow: none;\n      box-shadow: none; }\n  \n  .button--outline-reverse {\n    background-color: transparent;\n    border-color: #FFF;\n    color: #FFF; }\n    \n    .button--outline-reverse:visited {\n      color: #FFF; }\n    \n    .button--outline-reverse:hover {\n      background: transparent;\n      border-color: #E0E1E5;\n      color: #E5E5E9; }\n    \n    .button--outline-reverse:active {\n      background: transparent;\n      border-color: #FFF;\n      color: #FFF; }\n  \n  .button--danger {\n    background-color: #E8464E;\n    border-color: #AA161E;\n    color: #FFF;\n    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.3); }\n    \n    .button--danger:hover {\n      background: #F35E65;\n      border-color: #AC192B; }\n    \n    .button--danger:active {\n      background: #CB2D35;\n      border-color: #8F192B; }\n    \n    .button--danger:visited,\n    .button--danger:hover,\n    .button--danger:active,\n    .button--danger:focus {\n      color: #FFF; }\n  \n  .button--plain {\n    color: #00415D;\n    border-color: transparent;\n    background-color: transparent;\n    text-shadow: none;\n    box-shadow: none; }\n    \n    .button--plain:hover {\n      color: #8D96A8; }\n    \n    .button--plain:active {\n      color: #00415D; }\n    \n    .button--plain:visited,\n    .button--plain:hover,\n    .button--plain:active,\n    .button--plain:focus {\n      border-color: transparent;\n      background-color: transparent;\n      text-shadow: none;\n      box-shadow: none; }\n  \n  .button--toggle:hover {\n    color: #262626; }\n  \n  .button--toggle:active,\n  .button--toggle.is-active:hover {\n    color: #FFF; }\n  \n  .button--toggle:not(:hover):not(.is-active) {\n    border-color: transparent;\n    background-color: transparent; }\n  \n  .button--small {\n    font-size: 11px;\n    font-weight: 400;\n    border-radius: 2px;\n    line-height: 26px;\n    height: 27px;\n    padding: 0 7px; }\n  \n  .button--large {\n    font-size: 15px;\n    font-weight: 400;\n    border-radius: 2px;\n    line-height: 41px;\n    height: 42px;\n    padding: 0 20px; }\n  \n  .button--narrow {\n    padding-left: 10px;\n    padding-right: 10px; }\n  \n  .button--tight {\n    padding-left: 5px;\n    padding-right: 5px; }\n  \n  .button--full {\n    width: 100%;\n    padding-right: 0;\n    padding-left: 0;\n    text-align: center; }\n  \n  .button--icon {\n    line-height: 1.4; }\n    \n    .button--icon .icon {\n      vertical-align: sub; }\n  \n  .button[disabled],\n  .button--disabled,\n  .button--disabled:visited,\n  .button--disabled:hover,\n  .button--disabled:active,\n  .button--disabled:focus {\n    cursor: default;\n    box-shadow: none;\n    background-color: #EFF0F2;\n    border-color: #E5E5E9;\n    color: #a6a6a6;\n    text-shadow: none;\n    box-shadow: none; }\n    \n    .button[disabled].button--plain,\n    .button--disabled.button--plain,\n    .button--disabled:visited.button--plain,\n    .button--disabled:hover.button--plain,\n    .button--disabled:active.button--plain,\n    .button--disabled:focus.button--plain {\n      background-color: transparent;\n      border-color: transparent; }\n    \n    .button[disabled].button--outline-reverse,\n    .button--disabled.button--outline-reverse,\n    .button--disabled:visited.button--outline-reverse,\n    .button--disabled:hover.button--outline-reverse,\n    .button--disabled:active.button--outline-reverse,\n    .button--disabled:focus.button--outline-reverse {\n      background-color: transparent; }\n\n.fade-in {\n    -webkit-animation: fadein .5s; /* Safari, Chrome and Opera > 12.1 */\n       -moz-animation: fadein .5s; /* Firefox < 16 */\n        -ms-animation: fadein .5s; /* Internet Explorer */\n         -o-animation: fadein .5s; /* Opera < 12.1 */\n            animation: fadein .5s;\n  opacity: 1 !important;\n}\n\n.fade-out {\n    -webkit-animation: fadeout 1s; /* Safari, Chrome and Opera > 12.1 */\n       -moz-animation: fadeout 1s; /* Firefox < 16 */\n        -ms-animation: fadeout 1s; /* Internet Explorer */\n         -o-animation: fadeout 1s; /* Opera < 12.1 */\n            animation: fadeout 1s;\n    opacity: 0 !important;\n  \tz-index: -2000;\n}\n\n@keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Firefox < 16 */\n@-moz-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Safari, Chrome and Opera > 12.1 */\n@-webkit-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Internet Explorer */\n@-ms-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Opera < 12.1 */\n@-o-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n@keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Firefox < 16 */\n@-moz-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Safari, Chrome and Opera > 12.1*/\n@-webkit-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Internet Explorer*/\n@-ms-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Opera < 12.1*/\n@-o-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n",
     "undo_js": "var extensionHTML = document.querySelector('.optly-modal');\nif ( extensionHTML ) extensionHTML.remove();"
   }
-}
+}

Extensions/Editor Extensions/Exit Intent Pop-up/config.json

@@ -35,8 +35,8 @@
   "description": "If the user tries to leave the window, a popup will show begging them not to leave. ",
   "options": {
     "html": "<div class=\"exit-intent-modal\">\n  <div id=\"exit-popup-overlay\"></div>\n  <div id=\"exit-popup-wrapper\">\n    <div id=\"exit-popup\">\n      <div id=\"exit-popup-close\" class=\"exit-popup-close\">x</div>\n      <h2>{{widget.headline}}</h2>\n      <p>{{widget.secondary}}</p>\n      <a href=\"{{widget.link}}\" class=\"btn exit-popup-close\">{{widget.link_text}}</a>\n    </div>\n  </div>\n</div>",
-    "css": ".exit-intent-modal{\n\topacity: 0;\n  position: fixed;\n  z-index: 3001;\n  width: 100%;\n  text-align: center;\n\theight: 100% !important;\n}\n\nbody {\n  height: 100%;\n  float: left;\n  position: relative;\n}\n\n#exit-popup-overlay {\n  height: 100vh !important;\n  z-index: 3000;\n  position: fixed;\n  width: 100%;\n  background: #000;\n  opacity: 0.5;\n}\n#exit-popup-wrapper {\n  margin: 50px 0;\n  position: fixed;\n  z-index: 3001;\n  width: 100%;\n  height: 100vh;\n  text-align: center;\n}\n\n#exit-popup {\n  width: 500px;\n  display: inline-block;\n  background: #fff;\n  padding: 50px 20px;\n  position: relative;\n}\n\n#exit-popup h2 {\n  margin-top: 20px;\n}\n\n#exit-popup p {\n  \n}\n#exit-popup-close {\n  top: 10px;\n  right: 20px;\n  font-size: 20px;\n  position: absolute;\n  font-weight: bold;\n  cursor: pointer;\n  font-family: \"helvetica\", \"arial\", \"sans-serif\";\n}\n#exit-popup-close:hover {\n  color: #999;\n}\n\n.fade-in {\n    -webkit-animation: fadein .5s; /* Safari, Chrome and Opera > 12.1 */\n       -moz-animation: fadein .5s; /* Firefox < 16 */\n        -ms-animation: fadein .5s; /* Internet Explorer */\n         -o-animation: fadein .5s; /* Opera < 12.1 */\n            animation: fadein .5s;\n  opacity: 1 !important;\n}\n\n.fade-out {\n    -webkit-animation: fadeout 1s; /* Safari, Chrome and Opera > 12.1 */\n       -moz-animation: fadeout 1s; /* Firefox < 16 */\n        -ms-animation: fadeout 1s; /* Internet Explorer */\n         -o-animation: fadeout 1s; /* Opera < 12.1 */\n            animation: fadeout 1s;\n    opacity: 0 !important;\n}\n\n@keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Firefox < 16 */\n@-moz-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Safari, Chrome and Opera > 12.1 */\n@-webkit-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Internet Explorer */\n@-ms-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Opera < 12.1 */\n@-o-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n@keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Firefox < 16 */\n@-moz-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Safari, Chrome and Opera > 12.1*/\n@-webkit-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Internet Explorer*/\n@-ms-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Opera < 12.1*/\n@-o-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n",
+    "css": ".exit-intent-modal{\n\topacity: 0;\n  position: fixed;\n  z-index: 3001;\n  width: 100%;\n  text-align: center;\n\theight: 100% !important;\n}\n\nbody {\n  height: 100%;\n  float: left;\n  position: relative;\n}\n\n#exit-popup-overlay {\n  height: 100vh !important;\n  z-index: 3000;\n  position: fixed;\n  width: 100%;\n  background: #000;\n  opacity: 0.5;\n}\n#exit-popup-wrapper {\n  margin: 50px 0;\n  position: fixed;\n  z-index: 3001;\n  width: 100%;\n  height: 100vh;\n  text-align: center;\n}\n\n#exit-popup {\n  width: 500px;\n  display: inline-block;\n  background: #fff;\n  padding: 50px 20px;\n  position: relative;\n}\n\n#exit-popup h2 {\n  margin-top: 20px;\n}\n\n#exit-popup p {\n  \n}\n#exit-popup-close {\n  top: 10px;\n  right: 20px;\n  font-size: 20px;\n  position: absolute;\n  font-weight: bold;\n  cursor: pointer;\n  font-family: \"helvetica\", \"arial\", \"sans-serif\";\n}\n#exit-popup-close:hover {\n  color: #999;\n}\n\n.fade-in {\n    -webkit-animation: fadein .5s; /* Safari, Chrome and Opera > 12.1 */\n       -moz-animation: fadein .5s; /* Firefox < 16 */\n        -ms-animation: fadein .5s; /* Internet Explorer */\n         -o-animation: fadein .5s; /* Opera < 12.1 */\n            animation: fadein .5s;\n  opacity: 1 !important;\n}\n\n.fade-out {\n    -webkit-animation: fadeout 1s; /* Safari, Chrome and Opera > 12.1 */\n       -moz-animation: fadeout 1s; /* Firefox < 16 */\n        -ms-animation: fadeout 1s; /* Internet Explorer */\n         -o-animation: fadeout 1s; /* Opera < 12.1 */\n            animation: fadeout 1s;\n    opacity: 0 !important;\n    z-index: -4001;\n}\n\n@keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Firefox < 16 */\n@-moz-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Safari, Chrome and Opera > 12.1 */\n@-webkit-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Internet Explorer */\n@-ms-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n/* Opera < 12.1 */\n@-o-keyframes fadein {\n    from { opacity: 0; }\n    to   { opacity: 1; }\n}\n\n@keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Firefox < 16 */\n@-moz-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Safari, Chrome and Opera > 12.1*/\n@-webkit-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Internet Explorer*/\n@-ms-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n\n/* Opera < 12.1*/\n@-o-keyframes fadeout {\n    from { opacity: 1; }\n    to   { opacity: 0; }\n}\n",
     "apply_js": "var utils = window.optimizely.get('utils');\n\nutils.waitForElement('body').then(function(element){\n\tvar html = widget.$html;\n  element.insertAdjacentHTML('afterbegin', html);\n  element.addEventListener('mouseleave', function(){\n    showPopup();\n\t\tbindCloseBtn();\n  });\n});\n\nfunction showPopup() {\n  if(document.querySelector('.fade-out')){\n\t  document.querySelector('.fade-out').classList.remove('fade-out');\n  }\n  document.querySelector('.exit-intent-modal').classList += ' fade-in';\n}\n\nfunction hidePopup() {\n  document.querySelector('.exit-intent-modal').classList += ' fade-out';\n}\n\nfunction bindCloseBtn() {\n\tdocument.querySelector('.exit-popup-close').addEventListener('click', function(e){\n    hidePopup();\n  });\n}",
     "undo_js": "var extensionHTML = document.querySelector('.exit-intent-modal');\nif (extensionHTML) extensionHTML.remove();"
   }
-}
+}