dashboard/app/templates/index.html

96 lines
3.9 KiB
HTML

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta content="width=device-width, initial-scale=1.0" name="viewport">
<title>Tocknerheld-Dashboard</title>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
<link href="/static/css/style.css" rel="stylesheet" type="text/css">
<script src="https://unpkg.com/htmx.org"></script>
</head>
<body>
<div class="login-overlay" id="login-overlay">
<div class="login-window">
<!-- Tab Headers -->
<ul class="tab-group">
<li class="tab active"><a href="#login-tab">Login</a></li>
<li class="tab"><a href="#signup-tab">Sign Up</a></li>
</ul>
<!-- Tab Contents -->
<div class="tab-content">
<!-- Login Tab Pane -->
<div class="tab-pane active" id="login-tab">
<h2>Login</h2>
<form action="#" id="login-form" method="post">
<div class="form-group">
<label for="username">Username:</label>
<input id="username" name="username" type="text">
</div>
<div class="form-group">
<label for="password">Password:</label>
<input id="password" name="password" type="password">
</div>
<button class="button" type="submit">Login</button>
</form>
</div>
<!-- Signup Tab Pane -->
<div class="tab-pane" id="signup-tab">
<h2>Sign Up</h2>
<form action="#" id="registration-form" method="post">
<div class="form-group">
<label for="new-username">Username:</label>
<input id="new-username" name="new-username" type="text">
</div>
<div class="form-group">
<label for="new-password">Password:</label>
<input id="new-password" name="new-password" type="password">
</div>
<div class="form-group">
<label for="confirm-password">Confirm Password:</label>
<input id="confirm-password" name="confirm-password" type="password">
</div>
<div class="form-group">
<label for="email">Email:</label>
<input id="email" name="email" type="email">
</div>
<button class="button" type="submit">Register</button>
</form>
</div>
</div>
</div>
</div>
<nav class="sidebar">
<div class="menu-item">
<span class="material-icons menu-icon">dashboard</span>
<span class="menu-label">Übersicht</span>
</div>
<div class="menu-item" hx-get="/buchhaltung" hx-trigger="click" hx-target="#main-content">
<span class="material-icons menu-icon">account_balance_wallet</span>
<span class="menu-label">Buchhaltung</span>
</div>
<div class="menu-item" hx-get="/flottenmanagement" hx-trigger="click" hx-target="#main-content">
<span class="material-icons menu-icon">directions_car</span>
<span class="menu-label">Flottenmanagement</span>
</div>
<div class="menu-item">
<span class="material-icons menu-icon">people</span>
<span class="menu-label">Mitarbeiter</span>
</div>
<div class="menu-item">
<span class="material-icons menu-icon">settings</span>
<span class="menu-label">Einstellungen</span>
</div>
</nav>
<div class="container">
<section id="main-content">
<!-- Initial content or instruction for the user -->
<h1>Tocknerheld-Dashboard</h1>
<p>Bitte wähle einen Menüpunkt, um in den entsprechenden Bereich zu springen.</p>
</section>
</div>
<script src="/static/js/script.js"></script>
</body>
</html>