fix iframe plugin for default tabs

build/js/IFrame.js

@@ -253,14 +253,18 @@ class IFrame {
   _init() {
     const usingDefTab = ($(SELECTOR_TAB_CONTENT).children().length > 2)
 
-    if (usingDefTab) {
-      const $el = $(`${SELECTOR_TAB_PANE}:first-child`)
-      $el.show()
-      this._setItemActive($el.find('iframe').attr('src'))
-    }
-
     this._setupListeners()
-    this._fixHeight(!usingDefTab)
+    this._fixHeight(true)
+
+    if (usingDefTab) {
+      const $el = $(`${SELECTOR_TAB_PANE}`).first()
+      // eslint-disable-next-line no-console
+      console.log($el)
+      const uniqueName = $el.attr('id').replace('panel-', '')
+      const navId = `#tab-${uniqueName}`
+
+      this.switchTab(navId, true)
+    }
   }
 
   _initFrameElement() {

build/scss/pages/_iframe.scss

@@ -132,3 +132,11 @@ body.iframe-mode-fullscreen {
     opacity: 1;
   }
 }
+
+@include dark-mode () {
+  .content-wrapper.iframe-mode {
+    .tab-loading {
+      background-color: $dark;
+    }
+  }
+}

index.html

@@ -164,7 +164,7 @@
         </a>
       </li>
       <li class="nav-item">
-        <a class="nav-link" data-widget="control-sidebar" data-slide="true" href="#" role="button">
+        <a class="nav-link" data-widget="control-sidebar" data-controlsidebar-slide="true" href="#" role="button">
           <i class="fas fa-th-large"></i>
         </a>
       </li>