peterstockings/bloodpressure
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add profile image to navbar

Browse Source
This commit is contained in:
Peter Stockings
2024-12-24 11:21:50 +11:00
parent 5fdda885e5
commit 312da29ffb
1 changed files with 31 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

35
app/templates/_layout.html
View File

@@ -13,16 +13,43 @@
<!-- Navbar -->
<nav class="bg-blue-600 text-white p-4">
<div class="container mx-auto flex justify-between items-center">
<!-- Logo -->
<a href="/" class="text-2xl font-bold">BP Tracker</a>
<div>
<!-- Navigation Links -->
<div class="flex items-center space-x-4">
{% if current_user.is_authenticated %}
<a rel="prefetch" href="{{ url_for('main.dashboard') }}" class="px-4 py-2 hover:underline">Dashboard</a>
<a rel="prefetch" href="{{ url_for('user.profile') }}" class="px-4 py-2 hover:underline">Profile</a>
<a href="{{ url_for('auth.logout') }}" class="px-4 py-2 bg-red-500 rounded hover:bg-red-600">Logout</a>
<!-- Profile with Photo or Default Icon -->
<a rel="prefetch" href="{{ url_for('user.profile') }}"
class="relative flex items-center space-x-2 group">
{% if current_user.profile and current_user.profile.profile_pic %}
<img src="data:image/png;base64,{{ current_user.profile.profile_pic }}" alt="Profile Picture"
class="w-8 h-8 rounded-full border-2 border-white object-cover group-hover:scale-105 transition">
{% else %}
<!-- Default SVG Icon -->
<div
class="w-8 h-8 bg-gray-300 rounded-full flex items-center justify-center border-2 border-white">
<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="w-5 h-5 text-gray-600"
viewBox="0 0 24 24">
<path
d="M12 12c2.76 0 5-2.24 5-5s-2.24-5-5-5-5 2.24-5 5 2.24 5 5 5zm0 2c-2.67 0-8 1.34-8 4v2h16v-2c0-2.66-5.33-4-8-4z" />
</svg>
</div>
{% endif %}
<span class="hidden sm:inline text-sm font-medium group-hover:underline">Profile</span>
</a>
<a href="{{ url_for('auth.logout') }}" class="px-4 py-2 bg-red-500 rounded hover:bg-red-600">
Logout
</a>
{% else %}
<a href="{{ url_for('auth.login') }}" class="px-4 py-2 hover:underline">Login</a>
<a href="{{ url_for('auth.signup') }}"
class="px-4 py-2 bg-white text-blue-600 rounded hover:bg-gray-200">Signup</a>
class="px-4 py-2 bg-white text-blue-600 rounded hover:bg-gray-200">
Signup
</a>
{% endif %}
</div>
</div>