From db0a5b0133f6e014ec28ef8caef3c9244252a769 Mon Sep 17 00:00:00 2001 From: silverwind Date: Fri, 19 May 2023 14:48:50 +0200 Subject: [PATCH 01/28] Rework notifications list --- .../user/notification/notification_div.tmpl | 180 +++++++++--------- web_src/css/base.css | 19 +- web_src/css/helpers.css | 9 + web_src/css/user.css | 13 +- 4 files changed, 119 insertions(+), 102 deletions(-) diff --git a/templates/user/notification/notification_div.tmpl b/templates/user/notification/notification_div.tmpl index 6693b2e57d0ad..3d98e776059a2 100644 --- a/templates/user/notification/notification_div.tmpl +++ b/templates/user/notification/notification_div.tmpl @@ -24,7 +24,7 @@ {{end}} -
+
{{if eq (len .Notifications) 0}}
{{svg "octicon-inbox" 56 "gt-mb-4"}} @@ -35,101 +35,101 @@ {{end}}
{{else}} - - - {{range $notification := .Notifications}} - {{$issue := .Issue}} - {{$repo := .Repository}} - - - - - - - - {{end}} - -
- {{if eq .Status 3}} - {{svg "octicon-pin" 16 "text blue"}} - {{else if not $issue}} - {{svg "octicon-repo" 16 "text grey"}} - {{else if $issue.IsPull}} - {{if $issue.IsClosed}} - {{if $issue.GetPullRequest.HasMerged}} - {{svg "octicon-git-merge" 16 "text purple"}} - {{else}} - {{svg "octicon-git-pull-request" 16 "text red"}} - {{end}} +
+ {{$locale := .locale}} + {{range $notification := .Notifications}} +
+
+ {{if eq .Status 3}} + {{svg "octicon-pin" 16 "text blue"}} + {{else if not .Issue}} + {{svg "octicon-repo" 16 "text grey"}} + {{else if .Issue.IsPull}} + {{if .Issue.IsClosed}} + {{if .Issue.GetPullRequest.HasMerged}} + {{svg "octicon-git-merge" 16 "text purple"}} {{else}} - {{svg "octicon-git-pull-request" 16 "text green"}} + {{svg "octicon-git-pull-request" 16 "text red"}} {{end}} {{else}} - {{if $issue.IsClosed}} - {{svg "octicon-issue-closed" 16 "text red"}} - {{else}} - {{svg "octicon-issue-opened" 16 "text green"}} - {{end}} + {{svg "octicon-git-pull-request" 16 "text green"}} + {{end}} + {{else}} + {{if .Issue.IsClosed}} + {{svg "octicon-issue-closed" 16 "text red"}} + {{else}} + {{svg "octicon-issue-opened" 16 "text green"}} {{end}} -
- - {{if $issue}} - #{{$issue.Index}} - {{$issue.Title | RenderEmoji $.Context | RenderCodeBlock}} + {{end}} + + +
+ {{.Repository.FullName}} #{{.Issue.Index}} +
+
+ + {{if .Issue}} + #{{.Issue.Index}} - {{.Issue.Title | RenderEmoji $.Context | RenderCodeBlock}} {{else}} - {{$repo.FullName}} + {{.Repository.FullName}} {{end}} - -
- {{$repo.FullName}} - - {{if ne .Status 3}} -
- {{$.CsrfTokenHtml}} - - - -
- {{end}} - 		- {{if or (eq .Status 1) (eq .Status 3)}} -
- {{$.CsrfTokenHtml}} - - - - -
- {{else if eq .Status 2}} -
- {{$.CsrfTokenHtml}} - - - - -
- {{end}} -
+ +
+ +
+ {{TimeSinceUnix .Issue.UpdatedUnix $locale}} +
+
+ {{if ne .Status 3}} +
+ {{$.CsrfTokenHtml}} + + + +
+ {{end}} + {{if or (eq .Status 1) (eq .Status 3)}} +
+ {{$.CsrfTokenHtml}} + + + + +
+ {{else if eq .Status 2}} +
+ {{$.CsrfTokenHtml}} + + + + +
+ {{end}} +
+
+ {{end}} + {{end}} {{template "base/paginate" .}} diff --git a/web_src/css/base.css b/web_src/css/base.css index 6c6c5381ad73e..161d8efe36eda 100644 --- a/web_src/css/base.css +++ b/web_src/css/base.css @@ -369,6 +369,7 @@ a.muted:hover [class*="color-text"], a.silenced:hover { color: inherit; + text-decoration: none; } .delete-button, @@ -1413,6 +1414,18 @@ img.ui.avatar, color: var(--color-text-light) !important; } +.text.light { + color: var(--color-text-light) !important; +} + +.text.light-2 { + color: var(--color-text-light-2) !important; +} + +.text.light-3 { + color: var(--color-text-light-3) !important; +} + .text.light.grey { color: var(--color-grey-light) !important; } @@ -2207,7 +2220,11 @@ a.ui.active.label:hover { } .button.button-ghost:hover { - color: var(--color-primary); + background: var(--color-primary-alpha-20); +} + +.button.button-ghost:active { + background: var(--color-primary-alpha-50); } .two-toggle-buttons .button:not(.active):first-of-type { diff --git a/web_src/css/helpers.css b/web_src/css/helpers.css index d84fd4ba80c01..68f126b322b10 100644 --- a/web_src/css/helpers.css +++ b/web_src/css/helpers.css @@ -75,6 +75,8 @@ Gitea's private styles use `g-` prefix. .gt-whitespace-pre-wrap { white-space: pre-wrap !important; } .gt-object-contain { object-fit: contain !important; } .gt-self-center { align-self: center !important; } +.gt-self-start { align-self: flex-start !important; } +.gt-self-end { align-self: flex-end !important; } .gt-overflow-x-auto { overflow-x: auto !important; } .gt-overflow-x-scroll { overflow-x: scroll !important; } @@ -246,6 +248,13 @@ Gitea's private styles use `g-` prefix. .gt-shrink-0 { flex-shrink: 0 !important; } +.gt-font-13 { font-size: 13px !important } +.gt-font-14 { font-size: 14px !important } +.gt-font-15 { font-size: 15px !important } +.gt-font-16 { font-size: 16px !important } +.gt-font-17 { font-size: 17px !important } +.gt-font-18 { font-size: 18px !important } + @media (max-width: 767px) { .gt-db-small { display: block !important; } .gt-w-100-small { width: 100% !important; } diff --git a/web_src/css/user.css b/web_src/css/user.css index a7106599dfe7d..4717a25346b18 100644 --- a/web_src/css/user.css +++ b/web_src/css/user.css @@ -129,10 +129,6 @@ background: var(--color-box-body); } -#notification_table { - border: none; -} - #readme_profile { padding: 10px; border-radius: 0.28571429rem; @@ -140,11 +136,6 @@ border: 1px solid var(--color-secondary); } -#notification_table tr { - cursor: default; -} - -#notification_table td a { - width: 100%; - display: inline-block; +.notifications-item:hover { + background: var(--color-hover); } From d7fb689a38bbadb3b498415504ce5527dcd38792 Mon Sep 17 00:00:00 2001 From: silverwind Date: Fri, 19 May 2023 14:55:19 +0200 Subject: [PATCH 02/28] remove title --- templates/user/notification/notification_div.tmpl | 4 ---- 1 file changed, 4 deletions(-) diff --git a/templates/user/notification/notification_div.tmpl b/templates/user/notification/notification_div.tmpl index 3d98e776059a2..fe56175c2042c 100644 --- a/templates/user/notification/notification_div.tmpl +++ b/templates/user/notification/notification_div.tmpl @@ -1,9 +1,5 @@
-

- {{svg "octicon-bell" 28 "gt-mr-3 gt-mt-1"}} - {{.locale.Tr "notification.notifications"}} -

{{$notificationUnreadCount := call .NotificationUnreadCount}} From ebc5cb1df4921b0cb85522062c9c9bcc323a445a Mon Sep 17 00:00:00 2001 From: silverwind Date: Fri, 19 May 2023 15:09:59 +0200 Subject: [PATCH 03/28] replace tabs with menu items --- .../user/notification/notification_div.tmpl | 48 ++++++++++--------- web_src/css/user.css | 6 +++ 2 files changed, 31 insertions(+), 23 deletions(-) diff --git a/templates/user/notification/notification_div.tmpl b/templates/user/notification/notification_div.tmpl index fe56175c2042c..119e332819322 100644 --- a/templates/user/notification/notification_div.tmpl +++ b/templates/user/notification/notification_div.tmpl @@ -1,14 +1,16 @@
-
- {{$notificationUnreadCount := call .NotificationUnreadCount}} - - {{.locale.Tr "notification.unread"}} -
{{$notificationUnreadCount}}
- - - {{.locale.Tr "notification.read"}} - + {{$notificationUnreadCount := call .NotificationUnreadCount}} +
+
+ + {{.locale.Tr "notification.unread"}} +
{{$notificationUnreadCount}}
+ + + {{.locale.Tr "notification.read"}} + +
{{if and (eq .Status 1)}}
{{$.CsrfTokenHtml}} @@ -20,18 +22,18 @@
{{end}}
-
- {{if eq (len .Notifications) 0}} -
- {{svg "octicon-inbox" 56 "gt-mb-4"}} - {{if eq .Status 1}} - {{.locale.Tr "notification.no_unread"}} - {{else}} - {{.locale.Tr "notification.no_read"}} - {{end}} -
- {{else}} -
+
+
+ {{if eq (len .Notifications) 0}} +
+ {{svg "octicon-inbox" 56 "gt-mb-4"}} + {{if eq .Status 1}} + {{.locale.Tr "notification.no_unread"}} + {{else}} + {{.locale.Tr "notification.no_read"}} + {{end}} +
+ {{else}} {{$locale := .locale}} {{range $notification := .Notifications}}
@@ -125,8 +127,8 @@
{{end}} -
- {{end}} + {{end}} +
{{template "base/paginate" .}}
diff --git a/web_src/css/user.css b/web_src/css/user.css index 4717a25346b18..2697e1f7ebdf7 100644 --- a/web_src/css/user.css +++ b/web_src/css/user.css @@ -136,6 +136,12 @@ border: 1px solid var(--color-secondary); } +#notification_table { + background: var(--color-box-body); + border: 1px solid var(--color-secondary); + border-radius: var(--border-radius); +} + .notifications-item:hover { background: var(--color-hover); } From e7089f052de3d8cd00f78ed8e23c3239535a4d23 Mon Sep 17 00:00:00 2001 From: silverwind Date: Fri, 19 May 2023 15:14:01 +0200 Subject: [PATCH 04/28] tweak notification icon line height --- web_src/css/base.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web_src/css/base.css b/web_src/css/base.css index 161d8efe36eda..89632c8eadd46 100644 --- a/web_src/css/base.css +++ b/web_src/css/base.css @@ -2552,7 +2552,7 @@ a.ui.basic.label:hover { border-radius: 1em; font-size: 11px; font-weight: 700; - line-height: .67em; + line-height: .7; } .rss-icon { From e5b9c9b1fe74f9326b84e4134043ced3bcc113ee Mon Sep 17 00:00:00 2001 From: silverwind Date: Fri, 19 May 2023 15:23:40 +0200 Subject: [PATCH 05/28] remove unnecessary class --- templates/user/notification/notification_div.tmpl | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/templates/user/notification/notification_div.tmpl b/templates/user/notification/notification_div.tmpl index 119e332819322..08596ee861c59 100644 --- a/templates/user/notification/notification_div.tmpl +++ b/templates/user/notification/notification_div.tmpl @@ -12,7 +12,7 @@
{{if and (eq .Status 1)}} -
+ {{$.CsrfTokenHtml}}
{{else}} - {{end}} diff --git a/templates/user/notification/notification_div.tmpl b/templates/user/notification/notification_div.tmpl index f6ede614891af..31f5de74d7825 100644 --- a/templates/user/notification/notification_div.tmpl +++ b/templates/user/notification/notification_div.tmpl @@ -83,7 +83,7 @@ {{$.CsrfTokenHtml}} -
{{range .Topics}}{{.Name}}{{end}} - {{if and .Permission.IsAdmin (not .Repository.IsArchived)}}{{end}} + {{if and .Permission.IsAdmin (not .Repository.IsArchived)}}{{end}}
{{end}} {{if and .Permission.IsAdmin (not .Repository.IsArchived)}} diff --git a/web_src/css/base.css b/web_src/css/base.css index f4b3a124241a4..a716e3e6f81ff 100644 --- a/web_src/css/base.css +++ b/web_src/css/base.css @@ -2210,7 +2210,7 @@ a.ui.active.label:hover { border-left: none; } -/* a ghost button can be used as inline text, it doesn't have obvious styles */ +/* a ghost button is a button without border */ .button.button-ghost { background: transparent; border: none; @@ -2227,6 +2227,20 @@ a.ui.active.label:hover { background: var(--color-primary-alpha-50); } +/* a link button that look and acts like a link */ +.button.button-link { + background: transparent !important; + border: none; + color: inherit; + margin: 0; + padding: 0; +} + +.button.button-link:hover { + color: var(--color-primary); + text-decoration: underline; +} + .two-toggle-buttons .button:not(.active):first-of-type { border-right: none; } From 5350fd44adf380c666de95400c689b38bfdc6b73 Mon Sep 17 00:00:00 2001 From: silverwind Date: Fri, 19 May 2023 19:30:46 +0200 Subject: [PATCH 11/28] add link button to devtest --- templates/devtest/gitea-ui.tmpl | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/templates/devtest/gitea-ui.tmpl b/templates/devtest/gitea-ui.tmpl index c00d12217db92..827880c055d6b 100644 --- a/templates/devtest/gitea-ui.tmpl +++ b/templates/devtest/gitea-ui.tmpl @@ -21,7 +21,8 @@
-
This is a button
+
This is a button
+
This is a button