loading up the forgejo repo on tangled to test page performance
Merge pull request 'Various improvements to pages: notifications and subscriptions' (#3175) from 0ko/forgejo:meet-your-subscribtions into forgejo
Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/3175
Reviewed-by: Otto <otto@codeberg.org>
+53
-35
+4
-4
templates/repo/issue/view_title.tmpl
+4
-4
templates/repo/issue/view_title.tmpl
···
12
12
<input value="{{.Issue.Title}}" maxlength="255" autocomplete="off">
13
13
</div>
14
14
</h1>
15
-
<div class="issue-title-buttons">
15
+
<div class="top-right-buttons">
16
16
{{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}}
17
-
<button id="edit-title" class="ui small basic button edit-button not-in-edit tw-mr-0">{{ctx.Locale.Tr "repo.issues.edit"}}</button>
17
+
<button id="edit-title" class="ui small basic button edit-button not-in-edit">{{ctx.Locale.Tr "repo.issues.edit"}}</button>
18
18
{{end}}
19
19
{{if not .Issue.IsPull}}
20
-
<a role="button" class="ui small primary button new-issue-button tw-mr-0" href="{{.RepoLink}}/issues/new{{if .NewIssueChooseTemplate}}/choose{{end}}">{{ctx.Locale.Tr "repo.issues.new"}}</a>
20
+
<a role="button" class="ui small primary button new-issue-button" href="{{.RepoLink}}/issues/new{{if .NewIssueChooseTemplate}}/choose{{end}}">{{ctx.Locale.Tr "repo.issues.new"}}</a>
21
21
{{end}}
22
22
</div>
23
23
{{if and (or .HasIssuesOrPullsWritePermission .IsIssuePoster) (not .Repository.IsArchived)}}
24
-
<div class="edit-buttons">
24
+
<div class="top-right-buttons">
25
25
<button id="cancel-edit-title" class="ui small basic button in-edit tw-hidden">{{ctx.Locale.Tr "repo.issues.cancel"}}</button>
26
26
<button id="save-edit-title" class="ui small primary button in-edit tw-hidden tw-mr-0" data-update-url="{{$.RepoLink}}/issues/{{.Issue.Index}}/title" {{if .Issue.IsPull}}data-target-update-url="{{$.RepoLink}}/pull/{{.Issue.Index}}/target_branch"{{end}}>{{ctx.Locale.Tr "repo.issues.save"}}</button>
27
27
</div>
+17
-12
templates/user/notification/notification_div.tmpl
+17
-12
templates/user/notification/notification_div.tmpl
···
1
1
<div role="main" aria-label="{{.Title}}" class="page-content user notification" id="notification_div" data-sequence-number="{{.SequenceNumber}}">
2
2
<div class="ui container">
3
3
{{$notificationUnreadCount := call .NotificationUnreadCount}}
4
-
<div class="tw-flex tw-items-center tw-justify-between tw-mb-[--page-spacing]">
5
-
<div class="small-menu-items ui compact tiny menu">
4
+
<div class="tw-flex tw-items-center tw-justify-between tw-mb-4">
5
+
<div class="ui secondary partial menu">
6
6
<a class="{{if eq .Status 1}}active {{end}}item" href="{{AppSubUrl}}/notifications?q=unread">
7
7
{{ctx.Locale.Tr "notification.unread"}}
8
8
<div class="notifications-unread-count ui label {{if not $notificationUnreadCount}}tw-hidden{{end}}">{{$notificationUnreadCount}}</div>
···
11
11
{{ctx.Locale.Tr "notification.read"}}
12
12
</a>
13
13
</div>
14
-
{{if and (eq .Status 1)}}
15
-
<form action="{{AppSubUrl}}/notifications/purge" method="post">
16
-
{{$.CsrfTokenHtml}}
17
-
<div class="{{if not $notificationUnreadCount}}tw-hidden{{end}}">
18
-
<button class="ui mini button primary tw-mr-0" title="{{ctx.Locale.Tr "notification.mark_all_as_read"}}">
19
-
{{svg "octicon-checklist"}}
20
-
</button>
21
-
</div>
22
-
</form>
23
-
{{end}}
14
+
<div class="tw-flex top-right-buttons">
15
+
<a class="ui tiny button" href="{{AppSubUrl}}/notifications/subscriptions">
16
+
{{ctx.Locale.Tr "notification.subscriptions"}}
17
+
</a>
18
+
{{if and (eq .Status 1)}}
19
+
<form class="{{if not $notificationUnreadCount}}tw-hidden{{end}}" action="{{AppSubUrl}}/notifications/purge" method="post">
20
+
{{$.CsrfTokenHtml}}
21
+
<div>
22
+
<button class="ui mini button primary tw-mr-0" title="{{ctx.Locale.Tr "notification.mark_all_as_read"}}">
23
+
{{svg "octicon-checklist"}}
24
+
</button>
25
+
</div>
26
+
</form>
27
+
{{end}}
28
+
</div>
24
29
</div>
25
30
<div class="tw-p-0">
26
31
<div id="notification_table">
+12
-7
templates/user/notification/notification_subscriptions.tmpl
+12
-7
templates/user/notification/notification_subscriptions.tmpl
···
1
1
{{template "base/head" .}}
2
2
<div role="main" aria-label="{{.Title}}" class="page-content user notification">
3
3
<div class="ui container">
4
-
<div class="ui top attached tabular menu">
5
-
<a href="{{AppSubUrl}}/notifications/subscriptions" class="{{if eq .Status 1}}active {{end}}item">
6
-
{{ctx.Locale.Tr "notification.subscriptions"}}
7
-
</a>
8
-
<a href="{{AppSubUrl}}/notifications/watching" class="{{if eq .Status 2}}active {{end}}item">
9
-
{{ctx.Locale.Tr "notification.watching"}}
4
+
<div class="tw-flex tw-items-center tw-justify-between tw-mb-4">
5
+
<div class="ui secondary partial menu">
6
+
<a href="{{AppSubUrl}}/notifications/subscriptions" class="{{if eq .Status 1}}active {{end}}item">
7
+
{{ctx.Locale.Tr "notification.subscriptions"}}
8
+
</a>
9
+
<a href="{{AppSubUrl}}/notifications/watching" class="{{if eq .Status 2}}active {{end}}item">
10
+
{{ctx.Locale.Tr "notification.watching"}}
11
+
</a>
12
+
</div>
13
+
<a class="ui tiny button" href="{{AppSubUrl}}/notifications">
14
+
{{ctx.Locale.Tr "notifications"}}
10
15
</a>
11
16
</div>
12
-
<div class="ui bottom attached active tab segment">
17
+
<div class="ui bottom active tab segment">
13
18
{{if eq .Status 1}}
14
19
<div class="tw-flex tw-justify-between">
15
20
<div class="tw-flex">
+12
web_src/css/base.css
+12
web_src/css/base.css
···
246
246
user-select: none;
247
247
}
248
248
249
+
.top-right-buttons {
250
+
gap: 0.5rem;
251
+
}
252
+
253
+
.top-right-buttons .ui.button {
254
+
margin-right: 0;
255
+
}
256
+
257
+
.ui.partial.secondary.menu {
258
+
margin-bottom: 0;
259
+
}
260
+
249
261
a {
250
262
color: var(--color-primary);
251
263
cursor: pointer;
+8
-12
web_src/css/repo.css
+8
-12
web_src/css/repo.css
···
595
595
align-items: center;
596
596
}
597
597
598
-
.repository.view.issue .issue-title-buttons,
599
-
.repository.view.issue .edit-buttons {
598
+
.repository.view.issue .top-right-buttons {
600
599
display: flex;
601
600
}
602
601
603
-
.issue-title-buttons {
604
-
gap: 0.5rem;
605
-
}
606
-
607
602
@media (max-width: 767.98px) {
608
603
.repository.view.issue .issue-title {
609
604
flex-direction: column;
610
605
}
611
-
.repository.view.issue .issue-title-buttons,
612
-
.repository.view.issue .edit-buttons {
606
+
.repository.view.issue .top-right-buttons {
613
607
width: 100%;
614
-
justify-content: space-between;
615
-
}
616
-
.repository.view.issue .edit-buttons {
617
608
margin-top: .5rem;
609
+
justify-content: space-between;
618
610
}
619
611
.comment.form .issue-content-left .avatar {
620
612
display: none;
···
628
620
.comment.form .content .form::after {
629
621
display: none;
630
622
}
623
+
624
+
.repository.view.issue .issue-title.edit-active h1 {
625
+
padding-right: 0;
626
+
}
631
627
}
632
628
633
629
.repository.view.issue .issue-title {
···
645
641
font-size: 32px;
646
642
line-height: 40px;
647
643
margin: 0;
648
-
padding-right: 0.25rem;
644
+
padding-right: 0.5rem;
649
645
min-height: var(--repo-header-issue-min-height);
650
646
}
651
647