Initial commit

public/index.html

@@ -0,0 +1,108 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title> Cinnamon Buchhaltung </title>
+    <link rel="shortcut icon" href="/assets/favicon.ico" type="image/x-icon">
+    <link rel="icon" href="/assets/favicon.ico" type="image/x-icon">
+    <link rel="stylesheet" href="/style.css">
+    </href>
+</head>
+
+    <body>
+        <header>
+            <!-- Titel der Seite-->
+            <h1 class="title">Buchhaltung von <i>Cinnamon</i></h1>
+
+            <!-- Jahre/Monate -->
+           <div class="head">
+            <div class="auswahl">
+                <select id="jahr">
+                  <option value="2025">2025</option>
+                  <option value="2026">2026</option>
+                </select>
+                <select id="monat">
+                  <option value="1">Januar</option>
+                  <option value="2">Februar</option>
+                  <option value="3">März</option>
+                  <option value="4">April</option>
+                  <option value="5">Mai</option>
+                  <option value="6">Juni</option>
+                  <option value="7">Juli</option>
+                  <option value="8">August</option>
+                  <option value="9">September</option>
+                  <option value="10">Oktober</option>
+                  <option value="11">November</option>
+                  <option value="12">Dezember</option>
+                </select>
+            </div>
+          
+            <!-- Menüleiste/Werkzeuge -->
+            <div class="menu">
+                <input type="text" id="suche" placeholder="Kategorie suchen...">
+                <button id="export">📁 Datenbank Ordner</button>
+                <button id="path">📝 Pfad ändern</button>
+                <button id="mode">🦉 Hoot</button>
+            </div>
+          </div>
+        </header>
+
+        <main>
+            <!-- Tabelle -->
+            <div class="container">
+                <table id="buchhaltung-tabelle">
+                  <thead>
+                    <tr>
+                      <th>Ausgabe</th>
+                      <th>Kategorie</th>
+                      <th>Datum</th>
+                      <th>Aktionen</th>
+                    </tr>
+                  </thead>
+                  
+
+                  <!-- Dynamische Daten -->
+                  <tbody>
+
+                  </tbody>
+
+                  <tfoot>
+                    <tr id="eintrag">
+                      <td colspan="4">
+                        <button id="eintrag">➕ Neuer Eintrag</button>
+                      </td>
+                    </tr>
+
+                    <tr id="summe">
+                      <td id="summe-zelle" colspan="5">Summe: 0,00 €</td>
+                    </tr>
+                  </tfoot>
+                </table>
+            </div>
+              
+        </main>
+        
+        <footer>
+            <p>Hehe <3</p>
+        </footer>
+
+
+      <div id="nachricht-container" class="nachricht"></div>
+
+      <!-- Bestätigungs-Popup -->
+      <div id="confirm-popup" class="confirm-popup">
+        <div class="popup-content">
+            <p>Cinnamon u sure u wanna delete?</p>
+            <button id="confirm-yes" class="confirm-btn">Yes</button>
+            <button id="confirm-no" class="confirm-btn">NO!</button>
+        </div>
+      </div>
+
+
+      </body>
+
+    <script src="script.js"></script>
+
+
+</html>