feat: navbar new css

This commit is contained in:
2025-05-29 00:02:09 +02:00
parent 9d6ef9f5ff
commit 68d717aab8

View File

@@ -1,73 +1,37 @@
{% load static %}
<!DOCTYPE html>
<html lang="de">
<head>
<head>
<meta charset="UTF-8">
<title>{% block title %}TicketSystem{% endblock %}</title>
<title>
{% block title %}TicketSystem{% endblock %}
</title>
<link href="{% static 'css/tailwind.css' %}" rel="stylesheet">
<style>
body {
margin: 0;
font-family: sans-serif;
background-color: #f8f9fa;
}
.navbar {
background-color: #343a40;
color: white;
padding: 1rem 0;
}
.navbar-container {
max-width: 700px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: flex-start;
}
.navbar a {
color: white;
text-decoration: none;
margin: 0 1rem;
}
.navbar-right form {
display: inline;
}
.navbar-right button {
background: none;
border: none;
color: white;
cursor: pointer;
font-size: 1rem;
}
</style>
</head>
<body>
<div class="navbar">
<div class="navbar-container">
<div class="navbar-left">
<a href="{% url 'home' %}">🏠 Start</a>
<a href="{% url 'ticket-list' %}">📋 Tickets</a>
<a href="{% url 'assigned-tickets' %}">🧾 Meine Tickets</a>
</head>
<body class="bg-gray-100">
<nav class="bg-gray-700 text-white py-4">
<div class="max-w-4xl mx-auto flex justify-between items-center px-4">
<div class="flex space-x-4">
<a href="{% url 'home' %}" class="text-white hover:text-gray-300">🏠 Start</a>
<a href="{% url 'ticket-list' %}" class="text-white hover:text-gray-300">📋 Tickets</a>
<a href="{% url 'assigned-tickets' %}"
class="text-white hover:text-gray-300">🧾 Meine Tickets</a>
</div>
<div class="navbar-right">
<div class="flex items-center space-x-4">
{% if user.is_authenticated %}
👤 {{ user.username }}
<form method="post" action="{% url 'logout' %}">
<span class="text-white">👤 {{ user.username }}</span>
<form method="post" action="{% url 'logout' %}" class="inline">
{% csrf_token %}
<button type="submit">🚪 Logout</button>
<button type="submit" class="text-white hover:text-gray-300">🚪 Logout</button>
</form>
{% endif %}
</div>
</div>
</div>
<div class="container" style="max-width: 900px; margin: 2rem auto;">
</nav>
<!-- Global Container -->
<div class="max-w-4xl mx-auto mt-8 px-4">
{% block content %}
{% endblock %}
</div>
</body>
</body>
</html>