css und für post load

flag.css

@@ -7,13 +7,16 @@
   border-top-left-radius: 15px;
   border-bottom-left-radius: 15px;
   margin-right: -130px;
-  transition: margin-right 1s;
 }
 
 #flag-panel.open {
   margin-right: 0px !important;
 }
 
+#flag-panel.opened {
+  transition: margin-right 1s;
+}
+
 #flag-panel span {
   margin-right: 10px;
   margin-left: 5px;
@@ -28,6 +31,14 @@
   background-color: rgba(0,0,0,0.5);
 }
 
-#flagoverlay iframe {
-
+#flag-overlay iframe {
+  width: 80%;
+  min-width: 350px;
+  margin: 0 auto;
+  margin-top: 1vh;
+  display: block;
+  background-color: #fff;
+  border: 3px solid #000;
+  overflow-y: scroll;
+  height: 97vh;
 }

flag.js

@@ -7,6 +7,9 @@
   var tab = document.createElement('span');
   tab.innerHTML = '⚑';
   tab.addEventListener('mouseenter',function(ev) {
+    if(!panel.classList.contains('opened')) {
+      panel.classList.add('opened');
+    }
     panel.classList.toggle('open');
   });
 
@@ -25,7 +28,30 @@
 
     var form = document.createElement('form');
     form.action = connector;
+    form.target = 'flag-iframe';
     form.method = 'POST';
+    const screenshotTarget = document.body;
+
+    /*html2canvas(screenshotTarget).then((canvas) => {
+      const base64image = canvas.toDataURL("image/png");
+      window.location.href = base64image;
+    });*/
+    var fields = {
+      r:'ref',
+      u:'url',
+      s:'screen'
+    }
+    for(var f in 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();
   })