<!DOCTYPE html>
<html lang="en">
<head>
  <title>{{ page_title() }}</title>

  {{ shidashi::include_view("header.html") }}

</head>
<body class="overflow-hidden {{ paste(body_class(), collapse=' ') }}">
<div class="shidashi-wrapper">

  <!-- Preloader -->
  {{ local({ l = page_loader(); if(is.null(l)) {""} else {l} }) }}

  <!-- Navbar -->
  <nav class="{{ paste(nav_class(), collapse = ' ') }}">
    <!-- Left navbar links -->
    <ul class="navbar-nav">
      <li class="nav-item">
        <a class="nav-link" data-shidashi-toggle="sidebar" href="#" role="button"><i class="fas fa-bars"></i></a>
      </li>
    </ul>

    <!-- Right navbar links -->
    <ul class="navbar-nav ms-auto">

      <!-- Theme switcher -->
      <li class="nav-item">
        <a class="nav-link" href="#" data-shidashi-action="theme-toggle" role="button" title="Toggle theme">
          <i class="fas fa-moon"></i>
        </a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#" data-shidashi-action="iframe-fullscreen">
          <i class="fas fa-expand"></i>
        </a>
      </li>
    </ul>
  </nav>
  <!-- /.navbar -->

  <!-- Sidebar -->
  <nav class="shidashi-sidebar {{ ifelse('dark-mode' %in% sidebar_class(), 'shidashi-sidebar--dark', 'shidashi-sidebar--light') }}">
    <!-- Brand Logo -->
    <a href="#" class="shidashi-brand-link">
      {{ local({ logo <- page_logo('normal'); if(!is.null(logo) && nzchar(logo)) HTML(paste0('<img src=\"', logo, '\" alt=\"Logo\" class=\"shidashi-brand-image rounded-circle\" style=\"opacity:.8\">')) else '' }) }}
      <span class="shidashi-brand-text fw-light">{{ page_title(FALSE) }}</span>
    </a>

    <!-- Sidebar content -->
    <div class="shidashi-sidebar-content">

      <!-- Sidebar Search -->
      <div class="shidashi-sidebar-search p-2">
        <div class="input-group input-group-sm">
          <input class="form-control" type="search" placeholder="Search" aria-label="Search" data-shidashi-action="sidebar-search">
          <button class="btn btn-outline-secondary" type="button">
            <i class="fas fa-search fa-fw"></i>
          </button>
        </div>
      </div>

      <!-- Sidebar Menu -->
      <ul class="shidashi-nav" role="menu" data-shidashi-widget="treeview">
        {{ shidashi::adminlte_sidebar(shared_id=.shared_id) }}
      </ul>
      <!-- /.sidebar-menu -->
    </div>
    <!-- /.sidebar -->
  </nav>

  <!-- Content Wrapper -->
  <div class="shidashi-content" data-shidashi-widget="iframe-manager">
    <!-- Iframe tab bar -->
    <div class="shidashi-tab-bar {{ ifelse('dark-mode' %in% body_class(), 'shidashi-tab-bar--dark', 'shidashi-tab-bar--light') }}">
      <div class="shidashi-tab-bar-controls">
        <div class="dropdown">
          <a class="shidashi-tab-control" data-bs-toggle="dropdown" href="#" role="button" aria-expanded="false">
            <i class="fa fa-times" aria-hidden="true"></i>
          </a>
          <ul class="dropdown-menu">
            <li><a class="dropdown-item" href="#" data-shidashi-action="close-all-tabs">Close all tabs</a></li>
            <li><a class="dropdown-item" href="#" data-shidashi-action="close-other-tabs">Close other tabs</a></li>
          </ul>
        </div>
      </div>

      <a class="shidashi-tab-control" href="#" data-shidashi-action="scroll-tabs-left"><i class="fas fa-angle-double-left"></i></a>
      <ul class="shidashi-tab-list" role="tablist"></ul>
      <a class="shidashi-tab-control" href="#" data-shidashi-action="scroll-tabs-right"><i class="fas fa-angle-double-right"></i></a>
      <a class="shidashi-tab-control" href="#" data-shidashi-action="iframe-fullscreen"><i class="fas fa-expand"></i></a>
    </div>

    <!-- Iframe container -->
    <div class="shidashi-iframe-container">
      <div class="shidashi-tab-empty">
        <h2 class="display-4">Please choose any module to start.</h2>
      </div>
    </div>
  </div>
  <!-- /.content-wrapper -->

  <!-- Drawer lives inside each module iframe (see back_top_button()) -->

</div>
<!-- ./wrapper -->

{{ shidashi::include_view("footer.html") }}
</body>
</html>
