54 lines
2.6 KiB
HTML
54 lines
2.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>OpenTimeTracker</title>
|
|
<style>
|
|
body { font-family: -apple-system, system-ui, sans-serif; background: #f4f4f9; color: #333; margin: 0; padding: 0; }
|
|
nav { background: #2c3e50; padding: 1rem; color: white; display: flex; justify-content: space-between; }
|
|
nav a { color: white; text-decoration: none; margin-left: 15px; font-weight: bold; }
|
|
.container { max-width: 800px; margin: 2rem auto; padding: 0 1rem; }
|
|
.card { background: white; padding: 1.5rem; border-radius: 10px; box-shadow: 0 2px 5px rgba(0,0,0,0.1); margin-bottom: 1.5rem; }
|
|
.btn { padding: 0.5rem 1rem; border: none; border-radius: 5px; cursor: pointer; color: white; background: #3498db; }
|
|
.btn-danger { background: #e74c3c; }
|
|
input[type="text"], input[type="password"] { width: 100%; padding: 0.5rem; margin-bottom: 1rem; box-sizing: border-box; }
|
|
/* Grid for Activities */
|
|
.activity-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 1rem; }
|
|
.activity-card {
|
|
height: 100px; display: flex; align-items: center; justify-content: center;
|
|
border-radius: 10px; color: white; font-weight: bold; cursor: pointer; text-align: center;
|
|
flex-direction: column; transition: transform 0.1s;
|
|
}
|
|
.activity-card:active { transform: scale(0.98); }
|
|
.timer-display { font-size: 3rem; font-weight: bold; text-align: center; margin: 1rem 0; }
|
|
.active-section { border: 2px solid #27ae60; background: #ecfdf5; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<nav>
|
|
<div class="brand">OpenTimeTracker</div>
|
|
<div>
|
|
{% if session.user_id %}
|
|
<a href="{{ url_for('index') }}">Tracker</a>
|
|
<a href="{{ url_for('logbook') }}">Logbook</a>
|
|
<a href="{{ url_for('logout') }}">Logout</a>
|
|
{% else %}
|
|
<a href="{{ url_for('login') }}">Login</a>
|
|
<a href="{{ url_for('register') }}">Register</a>
|
|
{% endif %}
|
|
</div>
|
|
</nav>
|
|
<div class="container">
|
|
{% with messages = get_flashed_messages() %}
|
|
{% if messages %}
|
|
{% for message in messages %}
|
|
<div style="background: #fff3cd; padding: 10px; border-radius: 5px; margin-bottom: 15px;">{{ message }}</div>
|
|
{% endfor %}
|
|
{% endif %}
|
|
{% endwith %}
|
|
{% block content %}{% endblock %}
|
|
</div>
|
|
</body>
|
|
</html>
|