Files
HabitTracker/templates/index.html
2025-07-18 23:16:44 +02:00

58 lines
2.4 KiB
HTML

<!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Habit Tracker</title>
<link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
</head>
<body>
<div class="container">
<h1>Habit Tracker</h1>
<div class="add-habit">
<input type="text" id="newHabitName" placeholder="Neue Gewohnheit hinzufügen">
<button onclick="addHabit()">Hinzufügen</button>
</div>
<div id="habitList" class="habit-list">
</div>
</div>
<div id="dateModal" class="modal">
<div class="modal-content">
<span class="close-button" onclick="closeModal()">&times;</span>
<h2 id="modalHabitName"></h2>
<div class="month-navigation">
<button id="prevMonthBtn" onclick="changeMonth(-1)">&lt;</button>
<span id="currentMonthYear"></span>
<button id="nextMonthBtn" onclick="changeMonth(1)">&gt;</button>
</div>
<div class="weekdays-header">
<div>Mo</div>
<div>Di</div>
<div>Mi</div>
<div>Do</div>
<div>Fr</div>
<div>Sa</div>
<div>So</div>
</div>
<div id="modalDateGrid" class="date-grid-modal"></div>
<div class="color-picker-section">
<label for="habitColorPicker">Farbe wählen:</label>
<input type="color" id="habitColorPicker" onchange="updateHabitColor()">
</div>
<div class="daily-target-section">
<label for="habitDailyTarget">Tägliches Ziel:</label>
<input type="number" id="habitDailyTarget" min="1" max="20" onchange="updateDailyTarget()">
<span>x pro Tag</span>
</div>
<div class="modal-actions">
<button id="modalCompleteTodayBtn" onclick="completeHabitForDate(event, currentHabitId, getCurrentDate())">Heute erledigen</button>
<button id="modalEditBtn" onclick="editHabitName()">Bearbeiten</button>
<button id="modalDeleteBtn" onclick="deleteHabitFromModal()">Löschen</button>
</div>
</div>
</div>
<script src="{{ url_for('static', filename='js/script.js') }}"></script>
</body>
</html>