|
6 | 6 | {% load i18n %} |
7 | 7 | {% load custom_tags %} |
8 | 8 |
|
| 9 | +<style> |
| 10 | + a { |
| 11 | + color: black; |
| 12 | + } |
| 13 | +</style> |
| 14 | + |
9 | 15 | <nav class="fixed top-0 z-50 w-full bg-white border-b border-[#F7F7F7] border-b-2"> |
10 | 16 | <div class="px-3 py-3 lg:px-5 lg:pl-3"> |
11 | 17 | <div class="flex items-center justify-between"> |
|
19 | 25 | <!-- Logo --> |
20 | 26 | <a href="/newhome" class="flex flex-col ms-2 md:me-24 items-center"> |
21 | 27 | <img src="{% logo 'TRANSPARENT' %}" class="!max-w-[130px] lg:max-w-[200px]" /> |
22 | | - <p class="text-center inline-block text-xl pl-1"> |
| 28 | + <p class="text-center inline-block text-xl pl-1 mb-0"> |
23 | 29 | {% trans 'Report Issues, Win Prizes' %} |
24 | 30 | </p> |
25 | 31 | </a> |
26 | 32 | </div> |
27 | 33 |
|
28 | 34 | <!-- Search Bar --> |
29 | | - <div class="column items-center gap-[8px] invisible lg:visible lg:flex w-0 h-0 lg:w-[auto] lg:h-[auto]"> |
30 | | - <form class="relative px-[34px]" action="/search" method="get"> |
| 35 | + <div class="column items-center gap-[8px] w-0 overflow-clip lg:w-fit lg:flex w-0 h-0 lg:w-[auto] lg:h-[auto]"> |
| 36 | + <form class="relative px-[34px] mb-0" action="/search" method="get"> |
31 | 37 | <i class="fa fa-search absolute left-[13px] top-[6.4px] text-[#9CA3AF] z-10"></i> |
32 | 38 | <input type="text" name="query" placeholder="Search" |
33 | 39 | class="text-base ps-9 scale-[1.4] placeholder-[#9CA3AF] bg-[#EDEDED] outline-none p-2.5 font-semibold rounded-lg"> |
|
43 | 49 | </div> |
44 | 50 |
|
45 | 51 | <!-- User Avatar --> |
46 | | - {% if request.user.is_authenticated %} |
47 | | - <li class="flex justify-center items-center "> |
48 | | - <a href="/accounts/logout" id="user" class="relative flex items-center sm:gap-3 mr-[30px] hover:no-underline"> |
49 | | - {% if request.user.userprofile.avatar %} |
50 | | - <img src="{{ request.user.userprofile.avatar }}" class="h-[30px] w-[30px] rounded-full "> |
51 | | - {% elif request.user.socialaccount_set.all.0.get_avatar_url %} |
52 | | - <img src="{{ request.user.socialaccount_set.all.0.get_avatar_url }}" |
53 | | - class="h-[30px] w-[30px] rounded-full "> |
54 | | - {% else %} |
55 | | - {% gravatar request.user.email 30 '' 'gravatar rounded-full' %} |
56 | | - {% endif %} |
57 | | - <span |
58 | | - class="absolute -right-[17px] -bottom-[25px] lg:-right-[25px] lg:-bottom-[25px] sm:static whitespace-nowrap text-[1.6rem] font-[600]"><span |
| 52 | + {% if request.user.is_authenticated %} |
| 53 | + <a href="/accounts/logout" id="user" class="relative flex row items-center gap-3 mr-[30px] hover:no-underline inline-block"> |
| 54 | + {% if request.user.userprofile.avatar %} |
| 55 | + <img src="{{ request.user.userprofile.avatar }}" class="h-[30px] w-[30px] rounded-full "> |
| 56 | + {% elif request.user.socialaccount_set.all.0.get_avatar_url %} |
| 57 | + <img src="{{ request.user.socialaccount_set.all.0.get_avatar_url }}" |
| 58 | + class="h-[30px] w-[30px] rounded-full "> |
| 59 | + {% else %} |
| 60 | + {% gravatar request.user.email 30 '' 'gravatar rounded-full' %} |
| 61 | + {% endif %} |
| 62 | + <span |
| 63 | + class="text-[1.6rem] font-[600]"><span |
59 | 64 | class="">{{ request.user.username }}</span> ({{ request.user|score|default:"0" }} Pts) |
60 | | - </span> |
61 | | - </a> |
62 | | - </li> |
63 | | - {% else %} |
| 65 | + </span> |
| 66 | + </a> |
| 67 | + {% else %} |
64 | 68 |
|
65 | 69 |
|
66 | | - <!-- Sign up and Log in Buttons --> |
67 | | - <div class="flex column items-center gap-[8px]"> |
68 | | - <a href="/accounts/signup" |
69 | | - class="lg:!inline-block bg-red-500 hover:bg-red-600 h-[38px] py-[8px] px-[25px] whitespace-nowrap !text-2xl font-bold text-white leading-[21px] cursor-pointer hover:text-white hover:no-underline rounded-xl tracking-wide"> |
70 | | - {% trans "Signup" %} |
71 | | - </a> |
72 | | - <a href="/accounts/login" |
73 | | - class="lg:!inline-block bg-red-500 hover:bg-red-600 h-[38px] py-[8px] px-[25px] whitespace-nowrap !text-2xl font-bold text-white leading-[21px] cursor-pointer hover:text-white hover:no-underline rounded-xl tracking-wide"> |
74 | | - {% trans "Login" %} |
75 | | - </a> |
76 | | - </div> |
77 | | - {% endif %} |
| 70 | + <!-- Sign up and Log in Buttons --> |
| 71 | + <div class="flex column items-center gap-[8px]"> |
| 72 | + <a href="/accounts/signup" |
| 73 | + class="lg:!inline-block bg-red-500 hover:bg-red-600 h-[38px] py-[8px] px-[25px] whitespace-nowrap !text-2xl font-bold text-white leading-[21px] cursor-pointer hover:text-white hover:no-underline rounded-xl tracking-wide"> |
| 74 | + {% trans "Signup" %} |
| 75 | + </a> |
| 76 | + <a href="/accounts/login" |
| 77 | + class="lg:!inline-block bg-red-500 hover:bg-red-600 h-[38px] py-[8px] px-[25px] whitespace-nowrap !text-2xl font-bold text-white leading-[21px] cursor-pointer hover:text-white hover:no-underline rounded-xl tracking-wide"> |
| 78 | + {% trans "Login" %} |
| 79 | + </a> |
| 80 | + </div> |
| 81 | + {% endif %} |
78 | 82 |
|
79 | 83 |
|
80 | 84 | </div> |
|
0 commit comments