<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Login & Registrierung</title>
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
<!-- The modal for the alert -->
<div id="custom-alert" class="custom-alert">
<div class="alert-content">
<span id="alert-message"></span>
<button id="close-alert" class="close-btn">OK</button>
</div>
</div>
<div class="container">
<h1>Willkommen! Bitte melden Sie sich an oder registrieren Sie sich.</h1>
<div class="form-wrapper">
<form id="registerForm">
<h2>Registrierung</h2>
<input type="text" id="regUsername" placeholder="Benutzername" required>
<input type="email" id="regEmail" placeholder="E-Mail" required>
<input type="password" id="regPassword" placeholder="Passwort" required>
<button type="submit">Registrieren</button>
</form>
<form id="loginForm">
<h2>Login</h2>
<input type="email" id="loginEmail" placeholder="E-Mail" required>
<input type="password" id="loginPassword" placeholder="Passwort" required>
<button type="submit">Anmelden</button>
</form>
</div>
</div>
<script type="module" src="js/shared_functions.js"></script>
<script type="module" src="js/auth.js"></script>
</body>
</html>