diff --git a/flag.css b/flag.css index abc1965..d02e540 100644 --- a/flag.css +++ b/flag.css @@ -29,6 +29,7 @@ top: 0; left: 0; background-color: rgba(0,0,0,0.5); + z-index: 9999; } #flag-overlay iframe { diff --git a/flag.js b/flag.js index a17c966..cf4e445 100644 --- a/flag.js +++ b/flag.js @@ -18,12 +18,14 @@ flag.style.opacity = 0; setTimeout(function() { flag.remove(); + document.body.style.overflowY = 'auto'; },500); },3000); } var openFlag = function(ev) { flag = document.createElement('div'); + document.body.style.overflowY = 'hidden'; flag.id = 'flag-overlay'; iframe = document.createElement('iframe'); iframe.src= ''; diff --git a/flag.min.css b/flag.min.css index 50439b6..b72d50b 100644 --- a/flag.min.css +++ b/flag.min.css @@ -1 +1 @@ -#flag-panel{position:fixed;bottom:0;right:0;width:150px;border:1px solid #fff;border-top-left-radius:15px;border-bottom-left-radius:15px;margin-right:-130px}#flag-panel.open{margin-right:0!important}#flag-panel.opened{transition:margin-right 1s}#flag-panel span{margin-right:10px;margin-left:5px}#flag-overlay{position:fixed;width:100%;height:100vh;top:0;left:0;background-color:rgba(0,0,0,.5)}#flag-overlay iframe{width:80%;min-width:350px;margin:0 auto;margin-top:1vh;display:block;background-color:#fff;border:3px solid #000;border-radius:1em;overflow-y:scroll;height:97vh}#flag-overlay.closing{transition:opacity .5s}#flag-overlay.closing iframe{transition:margin 1s ease,width 1s ease,height 1s ease;width:350px;height:170px;margin-top:calc(50vh - 50px);overflow:hidden} \ No newline at end of file +#flag-panel{position:fixed;bottom:0;right:0;width:150px;border:1px solid #fff;border-top-left-radius:15px;border-bottom-left-radius:15px;margin-right:-130px}#flag-panel.open{margin-right:0!important}#flag-panel.opened{transition:margin-right 1s}#flag-panel span{margin-right:10px;margin-left:5px}#flag-overlay{position:fixed;width:100%;height:100vh;top:0;left:0;background-color:rgba(0,0,0,.5);z-index:9999}#flag-overlay iframe{width:80%;min-width:350px;margin:0 auto;margin-top:1vh;display:block;background-color:#fff;border:3px solid #000;border-radius:1em;overflow-y:scroll;height:97vh}#flag-overlay.closing{transition:opacity .5s}#flag-overlay.closing iframe{transition:margin 1s ease,width 1s ease,height 1s ease;width:350px;height:170px;margin-top:calc(50vh - 50px);overflow:hidden} \ No newline at end of file diff --git a/flag.min.js b/flag.min.js index 0a47b76..65f0188 100644 --- a/flag.min.js +++ b/flag.min.js @@ -1,2 +1,2 @@ -!function(connector){"use strict";var style="default",iframe,flag;document.body.dataset.feedbackstyle&&(style=document.body.dataset.feedbackstyle);var col="light",closeFlag=function(ev){flag.classList.add("closing"),setTimeout((function(){flag.style.opacity=0,setTimeout((function(){flag.remove()}),500)}),3e3)},openFlag=function(ev){(flag=document.createElement("div")).id="flag-overlay",(iframe=document.createElement("iframe")).src="",iframe.name="flag-iframe",flag.appendChild(iframe),document.body.appendChild(flag);var form=document.createElement("form");form.action=connector+"?style="+style,form.target="flag-iframe",form.method="POST";const screenshotTarget=document.body;var fields={};for(var f in fields.s=window.location.hostname,document.referrer&&(fields.r=document.referrer),window.location.href&&(fields.u=window.location.href),navigator.userAgent&&(fields.a=navigator.userAgent),fields.d=window.screen.width+"x"+window.screen.height+" ("+window.screen.colorDepth+"bit)",fields){var inp=document.createElement("input");inp.type="hidden",inp.name=f,inp.value=fields[f],form.appendChild(inp)}form.style="display:none",document.body.appendChild(form),form.submit()},panel=document.createElement("div");panel.id="flag-panel";var tab=document.createElement("span");tab.innerHTML="⚑",tab.addEventListener("mouseenter",(function(ev){panel.classList.contains("opened")||panel.classList.add("opened"),panel.classList.toggle("open")}));var button=document.createElement("button");button.innerHTML="Problem melden",button.addEventListener("click",openFlag),window.addEventListener("message",event=>{"close"==event.data&&closeFlag()});var links=document.getElementsByClassName("flag-link");if(links.length>0)for(var l=0;l{"close"==event.data&&closeFlag()});var links=document.getElementsByClassName("flag-link");if(links.length>0)for(var l=0;l