add top separator when iframed

src/kiri/init.js

@@ -1780,7 +1780,10 @@
         $('mode-cam').onclick = () => { API.mode.set('CAM') };
         $('mode-laser').onclick = () => { API.mode.set('LASER') };
 
+        // add app name hover info
         $('app-info').innerText = KIRI.version;
+        // show topline separator when iframed
+        try { if (WIN.self !== WIN.top) $('top-sep').style.display = 'flex' } catch (e) { }
     }
 
     // if a language needs to load, the script is injected and loaded

web/kiri/index.css

@@ -197,9 +197,6 @@ th, tr, td {
 #top > div {
     margin: 0 5px 0 5px;
 }
-#mid-sep {
-    z-index: 14;
-}
 
 #app-mode, #app-acct {
     width: 125px;
@@ -306,7 +303,11 @@ th, tr, td {
     pointer-events: visible;
 }
 
-#mid-sep {
+#top-sep {
+    display: none;
+}
+#top-sep, #mid-sep {
+    z-index: 14;
     height: 1px;
     background-image: var(--gradbar);
 }

web/kiri/index.html

@@ -25,6 +25,7 @@
     <div id="curtain" class="j-center a-center">loading...</div>
     <div id="container"></div>
     <div id="tracker"></div>
+    <div id="top-sep"></div>
     <div id="top" class="row">
         <div id="app-mode">
             <div id="app-mode-name"></div>