From 8251b317f7b7a2b5f626a02fa3bb540a1495e81d Mon Sep 17 00:00:00 2001
From: silverwind <me@silverwind.io>
Date: Fri, 12 May 2023 06:06:23 +0200
Subject: [PATCH] Improve empty notifications display (#24668)
- Add icon and padding to empty notification list, center it
- Add icon to header
- Remove border below header
#### Before
<img width="1250" alt="Screenshot 2023-05-11 at 23 34 53"
src="https://github.com/go-gitea/gitea/assets/115237/7c1990a1-e48d-40e5-8762-462d8c3ac0ea">
#### After
<img width="1249" alt="Screenshot 2023-05-12 at 00 24 02"
src="https://github.com/go-gitea/gitea/assets/115237/e0bcdf81-8468-4047-b92c-6625f00a22aa">
---
.../user/notification/notification_div.tmpl | 18 ++++++++++++------
1 file changed, 12 insertions(+), 6 deletions(-)
diff --git a/templates/user/notification/notification_div.tmpl b/templates/user/notification/notification_div.tmpl
index b8efd2433e..6047f34580 100644
--- a/templates/user/notification/notification_div.tmpl
+++ b/templates/user/notification/notification_div.tmpl
@@ -1,6 +1,9 @@
<div role="main" aria-label="{{.Title}}" class="page-content user notification" id="notification_div" data-params="{{.Page.GetParams}}" data-sequence-number="{{.SequenceNumber}}">
<div class="ui container">
- <h1 class="ui dividing header">{{.locale.Tr "notification.notifications"}}</h1>
+ <h1 class="ui header gt-df gt-ac">
+ {{svg "octicon-bell" 28 "gt-mr-3 gt-mt-1"}}
+ {{.locale.Tr "notification.notifications"}}
+ </h1>
<div class="ui top attached tabular menu">
{{$notificationUnreadCount := call .NotificationUnreadCount}}
<a href="{{AppSubUrl}}/notifications?q=unread" class="{{if eq .Status 1}}active {{end}}item">
@@ -23,11 +26,14 @@
</div>
<div class="ui bottom attached active tab segment gt-p-3">
{{if eq (len .Notifications) 0}}
- {{if eq .Status 1}}
- {{.locale.Tr "notification.no_unread"}}
- {{else}}
- {{.locale.Tr "notification.no_read"}}
- {{end}}
+ <div class="gt-df gt-ac gt-fc gt-p-4">
+ {{svg "octicon-inbox" 56 "gt-mb-4"}}
+ {{if eq .Status 1}}
+ {{.locale.Tr "notification.no_unread"}}
+ {{else}}
+ {{.locale.Tr "notification.no_read"}}
+ {{end}}
+ </div>
{{else}}
<table class="ui unstackable very compact small table" id="notification_table">
<tbody>