notification-badge #401
@ -28,11 +28,14 @@
|
|||||||
<header class="bg-primary-900 text-white flex justify-center p-3 fixed w-full z-10">
|
<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="max-w-screen-xl w-full flex justify-between items-center">
|
||||||
<div class="w-1/3 truncate">
|
<div class="w-1/3 truncate">
|
||||||
<a class="flex items-center" href="/">
|
<a href="/">
|
||||||
Hü
|
Hü
|
||||||
{{ loggedin_user.name }}
|
{{ loggedin_user.name }}
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
<div class="flex items-center">
|
||||||
{% if loggedin_user.amount_unread_notifications > 0 %}
|
{% if loggedin_user.amount_unread_notifications > 0 %}
|
||||||
<span class="relative inline-flex items-end ms-1">
|
<a href="/#notification" class="relative inline-flex items-end ms-2 me-3">
|
||||||
<svg
|
<svg
|
||||||
height="20"
|
height="20"
|
||||||
width="24"
|
width="24"
|
||||||
@ -46,11 +49,8 @@
|
|||||||
<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>
|
||||||
</span>
|
|
||||||
{% endif %}
|
|
||||||
</a>
|
</a>
|
||||||
</div>
|
{% endif %}
|
||||||
<div>
|
|
||||||
<a href="#"
|
<a href="#"
|
||||||
class="inline-flex justify-center rounded-md bg-primary-600 mx-1 px-3 py-2 text-sm font-semibold text-white hover:bg-primary-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-600 cursor-pointer"
|
class="inline-flex justify-center rounded-md bg-primary-600 mx-1 px-3 py-2 text-sm font-semibold text-white hover:bg-primary-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary-600 cursor-pointer"
|
||||||
data-sidebar="true"
|
data-sidebar="true"
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
{% 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">Ruderassistent</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,7 +11,7 @@
|
|||||||
<span class="text-xl px-3">Geplante Ausfahrten</span>
|
<span class="text-xl px-3">Geplante Ausfahrten</span>
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
<div 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>
|
||||||
<div class="divide-y">
|
<div class="divide-y">
|
||||||
@ -27,7 +27,7 @@
|
|||||||
<div>
|
<div>
|
||||||
{% if not notification.read_at %}
|
{% if not notification.read_at %}
|
||||||
<a href="/notification/{{ notification.id }}/read" class="inline-block">
|
<a href="/notification/{{ notification.id }}/read" class="inline-block">
|
||||||
<button class="btn btn-alert bg-red-100 dark:bg-red-900" type="button">
|
<button class="btn btn-primary" type="button">
|
||||||
✓
|
✓
|
||||||
<span class="sr-only">Notification gelesen</span>
|
<span class="sr-only">Notification gelesen</span>
|
||||||
</button>
|
</button>
|
||||||
@ -38,8 +38,8 @@
|
|||||||
{% endif %}
|
{% endif %}
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
<details class="py-3 bg-gray-200 dark:bg-primary-950 rounded-b-md">
|
<details class="py-3 border-t rounded-b-md">
|
||||||
<summary class="px-3">Vergangene Nachrichten (14 Tage)</summary>
|
<summary class="px-3 cursor-pointer">Vergangene Nachrichten (14 Tage)</summary>
|
||||||
<div class="divide-y text-sm">
|
<div class="divide-y text-sm">
|
||||||
{% for notification in notifications %}
|
{% for notification in notifications %}
|
||||||
{% if notification.read_at %}
|
{% if notification.read_at %}
|
||||||
|
Loading…
Reference in New Issue
Block a user