Dashboard.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="Style/Dashboard.css">
    <link rel="icon" href="Assets/logo.jpeg">
    <title>Dashboard</title>
  </head>
  <body>
    <nav class="nav">
      <div class="container">
        <div class="logo">
          <a href="#">Dashboard</a>
        </div>
        <div id="mainListDiv" class="main_list">
          <ul class="navlinks">
            <li><a href="#">About</a></li>
            <li><a href="#">Services</a></li>
            <li><a href="#">Contact</a></li>
            <li><a href="#"><button type="submit" id="signout">Sign out</button></a></li>
          </ul>
        </div>
        <span class="navTrigger">
          <i></i>
          <i></i>
          <i></i>
        </span>
      </div>
    </nav>
    
    <section class="home">
    </section>
    <div style="height: 650px; display: grid; place-content: center; width: 100%; background-color: #6798e7;" >
      <!-- just to make scrolling effect possible -->
    <img src="https://i.gifer.com/origin/e0/e08f73642d422d94483c0ca96f737ac2_w200.gif" alt="Hello Image">
     
    </div>
    
    <!-- Jquery needed -->
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <script type="module" src="./Scripts/Dashboard.mjs"></script>
    
  </body>
</html>