[TASK] improve styling
This commit is contained in:
		| @@ -13,3 +13,4 @@ | ||||
| @import 'components/search'; | ||||
| @import 'components/important'; | ||||
| @import 'components/searchable-table'; | ||||
| @import 'components/notification'; | ||||
|   | ||||
							
								
								
									
										5
									
								
								frontend/scss/components/_notification.scss
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										5
									
								
								frontend/scss/components/_notification.scss
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,5 @@ | ||||
| .notification { | ||||
|     right: -.2rem; | ||||
|     top: -.1rem; | ||||
|     font-size: .5rem; | ||||
| } | ||||
| @@ -28,20 +28,25 @@ | ||||
|     <header class="bg-primary-900 text-white flex justify-center p-3 fixed w-full z-10"> | ||||
|         <div class="max-w-screen-xl w-full flex justify-between items-center"> | ||||
|             <div class="w-1/3 truncate"> | ||||
|                 <a href="/"> | ||||
|                 <a class="flex items-center" href="/"> | ||||
|                     Hü | ||||
|                     {{ loggedin_user.name }} | ||||
|                     {% if loggedin_user.amount_unread_notifications > 0 %} | ||||
|                         <span class="bg-red-100 text-red-800 text-sm font-medium me-2 px-2.5 py-0.5 rounded-full dark:bg-red-900 dark:text-red-300 inline-flex items-center"> | ||||
|                             <svg class="w-3 h-3 me-1.5" | ||||
|                                  aria-hidden="true" | ||||
|                                  xmlns="http://www.w3.org/2000/svg" | ||||
|                                  fill="currentColor" | ||||
|                                  viewBox="0 0 20 20"> | ||||
|                                 <path d="M1.5 8.67v8.58a3 3 0 0 0 3 3h15a3 3 0 0 0 3-3V8.67l-8.928 5.493a3 3 0 0 1-3.144 0L1.5 8.67Z" /> | ||||
|                                 <path d="M22.5 6.908V6.75a3 3 0 0 0-3-3h-15a3 3 0 0 0-3 3v.158l9.714 5.978a1.5 1.5 0 0 0 1.572 0L22.5 6.908Z" /> | ||||
|                             </svg> | ||||
|                         {{ loggedin_user.amount_unread_notifications }}</span> | ||||
|                         <span class="relative inline-flex items-end ms-1"> | ||||
|                             <svg  | ||||
|                                 height="20" | ||||
|                                 width="24" | ||||
|                                 aria-hidden="true" | ||||
|                                 xmlns="http://www.w3.org/2000/svg" | ||||
|                                 fill="currentColor" | ||||
|                                 viewBox="0 0 20 24"> | ||||
|                               <path d="M1.5 8.67v8.58a3 3 0 0 0 3 3h15a3 3 0 0 0 3-3V8.67l-8.928 5.493a3 3 0 0 1-3.144 0L1.5 8.67Z" /> | ||||
|                               <path d="M22.5 6.908V6.75a3 3 0 0 0-3-3h-15a3 3 0 0 0-3 3v.158l9.714 5.978a1.5 1.5 0 0 0 1.572 0L22.5 6.908Z" /> | ||||
|                           </svg> | ||||
|                           <small class="bg-red-500 rounded-full w-3 h-3 inline-flex justify-center items-center absolute p-1 notification"> | ||||
|                             {{ loggedin_user.amount_unread_notifications }} | ||||
|                           </small> | ||||
|                         </span> | ||||
|                     {% endif %} | ||||
|                 </a> | ||||
|             </div> | ||||
|   | ||||
		Reference in New Issue
	
	Block a user
	 Marie Birner
					Marie Birner