notification-badge #409
@ -35,20 +35,20 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="flex items-center">
|
<div class="flex items-center">
|
||||||
{% if loggedin_user.amount_unread_notifications > 0 %}
|
{% if loggedin_user.amount_unread_notifications > 0 %}
|
||||||
<a href="/#notification" class="relative inline-flex items-end ms-2 me-3">
|
<a href="/#notification"
|
||||||
<svg
|
class="relative inline-flex items-end ms-2 me-3">
|
||||||
height="20"
|
<svg height="20"
|
||||||
width="24"
|
width="24"
|
||||||
aria-hidden="true"
|
aria-hidden="true"
|
||||||
xmlns="http://www.w3.org/2000/svg"
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
fill="currentColor"
|
fill="currentColor"
|
||||||
viewBox="0 0 20 24">
|
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="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" />
|
<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>
|
</svg>
|
||||||
<small class="bg-red-500 rounded-full w-3 h-3 inline-flex justify-center items-center absolute p-1 notification">
|
<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 }}
|
{{ loggedin_user.amount_unread_notifications }}
|
||||||
</small>
|
</small>
|
||||||
</a>
|
</a>
|
||||||
{% endif %}
|
{% endif %}
|
||||||
<a href="#"
|
<a href="#"
|
||||||
|
@ -2,7 +2,11 @@
|
|||||||
{% extends "base" %}
|
{% extends "base" %}
|
||||||
{% block content %}
|
{% block content %}
|
||||||
<div class="max-w-screen-lg w-full">
|
<div class="max-w-screen-lg w-full">
|
||||||
<h1 class="h1">Ruder<wbr/>assistent</h1>
|
<h1 class="h1">
|
||||||
|
Ruder
|
||||||
|
<wbr />
|
||||||
|
assistent
|
||||||
|
</h1>
|
||||||
<div class="grid gap-3 my-5">
|
<div class="grid gap-3 my-5">
|
||||||
<div class="m-auto">
|
<div class="m-auto">
|
||||||
<a href="/planned"
|
<a href="/planned"
|
||||||
@ -11,9 +15,15 @@
|
|||||||
<span class="text-xl px-3">Geplante Ausfahrten</span>
|
<span class="text-xl px-3">Geplante Ausfahrten</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div id="notification" class="bg-white dark:bg-primary-900 text-black dark:text-white rounded-md block shadow mt-5"
|
<div id="notification"
|
||||||
|
class="bg-white dark:bg-primary-900 text-black dark:text-white rounded-md block shadow mt-5"
|
||||||
role="alert">
|
role="alert">
|
||||||
<h2 class="h2">Nachrichten</h2>
|
<h2 class="h2">Nachrichten</h2>
|
||||||
|
{% if notifications | length > 10 %}
|
||||||
|
<div class="text-yellow-800 dark:text-yellow-300 text-center p-3">
|
||||||
|
Du hast viele ungelesene Benachrichtigungen. Um deine Oberfläche übersichtlich zu halten und wichtige Updates nicht zu verpassen, nimm dir bitte einen Moment Zeit, sie zu überprüfen und als gelesen zu markieren (✓).
|
||||||
|
</div>
|
||||||
|
{% endif %}
|
||||||
<div class="divide-y">
|
<div class="divide-y">
|
||||||
{% for notification in notifications %}
|
{% for notification in notifications %}
|
||||||
{% if not notification.read_at %}
|
{% if not notification.read_at %}
|
||||||
|
Loading…
Reference in New Issue
Block a user