Hide navigation and sidenav elements by default in the CSS

public/app.js

@@ -26,9 +26,16 @@ document.addEventListener('DOMContentLoaded', function() {
 
     // Initialize Materialize components
     M.Sidenav.init(sidenav);
+
+    // Calculate tomorrow's date
+    const today = new Date();
+    const tomorrow = new Date(today);
+    tomorrow.setDate(today.getDate() + 1);
+
+    // Initialize datepicker with tomorrow as the default date
     M.Datepicker.init(document.querySelectorAll('.datepicker'), {
         format: 'yyyy-mm-dd',
-        defaultDate: new Date(),
+        defaultDate: tomorrow,
         setDefaultDate: true,
         firstDay: 1
     });

public/index.html

@@ -31,13 +31,10 @@
 
     <div id="appContainer" class="container" style="display:none;">
         <h1 class="center-align">TODO</h1>
-        <nav style="display:none;">
+        <nav>
             <div class="nav-wrapper">
                 <a href="#" class="brand-logo">Menu</a>
                 <a href="#" data-target="mobile-demo" class="sidenav-trigger"><i class="material-icons">menu</i></a>
-                <ul class="right hide-on-med-and-down">
-                    <li><a id="logoutButton" class="hide-on-med-and-down">Logout</a></li>
-                </ul>
             </div>
         </nav>
 

public/style.css

@@ -55,4 +55,8 @@ h1 {
 
 .menu.show .menu-content {
     display: block;
+}
+
+nav, .sidenav {
+    display: none;
 }