Enhances user experience with dark‑mode detection, responsive layout, and streamlined role selection workflow
27 lines
3.2 KiB
HTML
27 lines
3.2 KiB
HTML
<div class="bg-white dark:bg-gray-950 border-b border-gray-200 dark:border-gray-600 px-4 py-2 flex items-center gap-1 overflow-x-auto shrink-0">
|
|
<a href="/dashboard/" class="whitespace-nowrap px-3 py-1.5 rounded-lg text-sm font-medium transition-colors {% if request.path == '/dashboard/' %}bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300{% else %}text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800{% endif %}">
|
|
<i class="fas fa-home mr-1.5"></i>Dashboard
|
|
</a>
|
|
<a href="/dashboard/projects/" class="whitespace-nowrap px-3 py-1.5 rounded-lg text-sm font-medium transition-colors {% if '/projects/' in request.path and '/ticket-priorities/' not in request.path %}bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300{% else %}text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800{% endif %}">
|
|
<i class="fas fa-layer-group mr-1.5"></i>Projects
|
|
</a>
|
|
<a href="/dashboard/project-timeline/" class="whitespace-nowrap px-3 py-1.5 rounded-lg text-sm font-medium transition-colors {% if '/project-timeline/' in request.path %}bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300{% else %}text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800{% endif %}">
|
|
<i class="fas fa-calendar-days mr-1.5"></i>Timeline
|
|
</a>
|
|
<a href="/dashboard/project-board/" class="whitespace-nowrap px-3 py-1.5 rounded-lg text-sm font-medium transition-colors {% if '/project-board/' in request.path %}bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300{% else %}text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800{% endif %}">
|
|
<i class="fas fa-columns mr-1.5"></i>Board
|
|
</a>
|
|
<a href="/dashboard/tickets/" class="whitespace-nowrap px-3 py-1.5 rounded-lg text-sm font-medium transition-colors {% if request.path == '/dashboard/tickets/' %}bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300{% else %}text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800{% endif %}">
|
|
<i class="fas fa-ticket mr-1.5"></i>Tickets
|
|
</a>
|
|
<a href="/dashboard/epics/" class="whitespace-nowrap px-3 py-1.5 rounded-lg text-sm font-medium transition-colors {% if '/epics/' in request.path %}bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300{% else %}text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800{% endif %}">
|
|
<i class="fas fa-flag mr-1.5"></i>Epics
|
|
</a>
|
|
<a href="/dashboard/contributions/" class="whitespace-nowrap px-3 py-1.5 rounded-lg text-sm font-medium transition-colors {% if '/contributions/' in request.path %}bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300{% else %}text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800{% endif %}">
|
|
<i class="fas fa-chart-bar mr-1.5"></i>Analytics
|
|
</a>
|
|
<a href="/dashboard/leaderboard/" class="whitespace-nowrap px-3 py-1.5 rounded-lg text-sm font-medium transition-colors {% if '/leaderboard/' in request.path %}bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300{% else %}text-gray-600 dark:text-gray-400 hover:bg-gray-100 dark:hover:bg-gray-800{% endif %}">
|
|
<i class="fas fa-trophy mr-1.5"></i>Leaderboard
|
|
</a>
|
|
</div>
|