Added (commented-out) flip transform for cards.

I'm having trouble with the plugin menu disappearing below elements from
the card below, and also with the editor controls disappearing once the
flip is complete, so the flip is disabled for now.

resources/report/css/style.css

@@ -154,6 +154,7 @@ nav a {
     overflow: auto;
     flex-shrink: 10;
     flex-grow: 1;
+    /*-webkit-perspective: 1000;*/
 }
 
 section, .dialog {
@@ -167,6 +168,31 @@ section, .dialog {
 
 section[data-active] {
     overflow:visible;
+    /*transition: 0.6s;
+    -webkit-transform-style: preserve-3d;
+    z-index:-1;*/
+}
+
+/*section[data-active] .front, section[data-active] .editor {
+    -webkit-backface-visibility: hidden;
+    transition: 0.6s;
+}*/
+
+section[data-active] .editor {
+    /*-webkit-transform: rotateY(180deg);*/
+    display:none;
+}
+
+/*section[data-active].flip  {
+    -webkit-transform: rotateY(180deg);
+}*/
+
+section[data-active].flip .front  {
+    display:none;
+}
+
+section[data-active].flip .editor  {
+    display:block;
 }
 
 section[data-active] .buttons {
@@ -201,7 +227,6 @@ section .buttons  > li:hover {
     list-style-type: none;
     position: absolute;
     right: 0.5em;
-    font: 10pt/1.5 Helvetica,sans-serif;
     width: 13em;
     z-index: 2;
     text-align: left;

resources/report/js/script.js

@@ -243,8 +243,7 @@ function processButtonClick(evt) {
         clearAllMetadata();
     } else if (action == 'show-editor') {
         var section = evt.target.parentElement.parentElement.parentElement.parentElement.parentElement;
-        hideElement(document.getElementsByClassName('front')[0]);
-        showElement(document.getElementsByClassName('editor')[0]);
+        section.classList.toggle('flip');
     }
 }
 function toggleInputRO(evt) {

resources/report/report.html

@@ -54,7 +54,7 @@
                         </ol>
                 </ol>
             </div>
-            <div class="editor hidden">
+            <div class="editor">
                 <h1></h1>
                 <div class="crc"></div>
                 <div class="version"></div>