Files
telegram-film-wunsch-bot/public/index.html

88 lines
3.5 KiB
HTML

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Raymand - Telegram Bot</title>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="styles.css">
</head>
<body>
<header>
<div class="header-content">
<div class="logo">🤖 Raymand</div>
<nav>
<ul>
<li><a href="index.html" class="active">Home</a></li>
<li><a href="help.html">Hilfe</a></li>
<li><a href="contact.html">Kontakt</a></li>
</ul>
</nav>
</div>
</header>
<main class="container">
<div class="card">
<h2 class="welcome-title">Wunsch absenden</h2>
<p class="subtitle">Sag uns, was du sehen möchtest! Wähle eine Kategorie und gib den Titel ein.</p>
<form id="wishForm">
<div class="form-group">
<label for="category">Kategorie</label>
<select id="category" required>
<option value="" disabled selected>Wähle eine Kategorie...</option>
<option value="Film">🎬 Film</option>
<option value="4K Filme">📀 4K Filme</option>
<option value="Serie">📺 Serie</option>
<option value="Anime">📖 Anime</option>
<option value="Disney">✨ Disney</option>
<option value="Medizin">⚕️ Medizin</option>
<option value="Survival">🏕️ Survival</option>
<option value="WWE">🏆 WWE</option>
<option value="Musik">🎵 Musik</option>
<option value="Bollywood">🎬 Bollywood</option>
<option value="Hörspiele & Comics">🎧 Hörspiele & Comics</option>
<option value="PC Games">💻 PC Games</option>
</select>
</div>
<div class="form-group">
<label for="link">Link (Optional)</label>
<input type="url" id="link" placeholder="https://cover.spotify.com/...">
</div>
<div class="form-group">
<label for="title">Titel</label>
<input type="text" id="title" required placeholder="z.B. Inception">
</div>
<button type="submit" id="submitBtn" class="btn-primary">Wunsch senden ✨</button>
</form>
</div>
</main>
<footer>
<div class="footer-content">
<div class="footer-left">
<p class="bot-version">v2.10</p>
</div>
<div class="footer-center">
<p>&copy; 2024 M_Viper. Alle Rechte vorbehalten.</p>
</div>
<div class="footer-right">
<a href="https://git.viper.ipv64.net" target="_blank" aria-label="Gitea">💻</a>
</div>
</div>
</footer>
<div class="modal-overlay" id="popupOverlay"></div>
<div class="modal" id="popup">
<div class="modal-icon" id="modalIcon"></div>
<h3 id="modalTitle">Status</h3>
<p id="popupMessage"></p>
<button class="btn-secondary" id="closePopup">Schließen</button>
</div>
<script src="script.js"></script>
</body>
</html>