.

src/index.html

@@ -5,23 +5,48 @@
   <meta charset="UTF-8" />
   <link rel="stylesheet" href="styles_default.css" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Tauri App</title>
+  <title>Notes</title>
   <script src="/main.js" defer></script>
 </head>
 
 <body>
+  <div class="app-shell">
+    <header class="window-titlebar">
+      <div class="titlebar-drag">
+        <span class="app-mark" aria-hidden="true">
+          <svg viewBox="0 0 24 24" width="18" height="18">
+            <path d="M6 3.75h8.5L19 8.25v12A1.75 1.75 0 0 1 17.25 22h-11A1.75 1.75 0 0 1 4.5 20.25v-14A2.5 2.5 0 0 1 7 3.75Zm7.75 1.5v3.5h3.5l-3.5-3.5ZM7.5 12v1.5h9V12h-9Zm0 4v1.5h9V16h-9Z" />
+          </svg>
+        </span>
+        <span class="titlebar-copy">
+          <span class="titlebar-title">Notes</span>
+          <span class="titlebar-caption">Personal notebook</span>
+        </span>
+      </div>
+      <div class="window-controls">
+        <button class="window-control" id="minimize-window" type="button" aria-label="Minimize">
+          <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M3 8h10" /></svg>
+        </button>
+        <button class="window-control" id="maximize-window" type="button" aria-label="Maximize">
+          <svg viewBox="0 0 16 16" aria-hidden="true"><path d="M3.5 3.5h9v9h-9z" /></svg>
+        </button>
+        <button class="window-control close-control" id="close-window" type="button" aria-label="Close">
+          <svg viewBox="0 0 16 16" aria-hidden="true"><path d="m4 4 8 8M12 4l-8 8" /></svg>
+        </button>
+      </div>
+    </header>
   <div class="center-page-content">
 
     <div class="grid-container-horizontal notes-sidebar" style="width: 40%; max-width: 25rem; min-width: 15rem;">
       <div class="grid-container-vertical toolbar">
-        <div>
+        <div style="height: 3rem;">
           <div style="margin-left: 0.8rem;" class="button">
             <svg class="icon" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="24px" width="24px">
               <path d="M3,18V16H21v2H3Zm0-5V11H21v2H3ZM3,8V6H21V8H3Z" />
             </svg>
 
           </div>
-          <p style="font-weight: bold; ">Notes</p>
+          <p style="font-weight: bold; "></p>
           <div style="margin-right: 0.8rem" class="button" onclick="toggle_search();">
             <svg id="search_icon" class="icon-accent" style="display: none;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" height="24px" width="24px">
               <path
@@ -54,6 +79,7 @@
     </svg>
 
   </div>
+  </div>
 </body>
 
 </html>