loading up the forgejo repo on tangled to test page performance
0
fork

Configure Feed

Select the types of activity you want to include in your feed.

Minor dashboard tweaks, fix flex-list margins (#26829)

Some small dashboard tweaks:

- Remove margin-bottom from divider so first item does not appear to
have un-equal margins
- Restore previous icon color
- Add slight margin-right to icon

Before:
<img width="783" alt="Screenshot 2023-08-31 at 00 10 28"
src="https://github.com/go-gitea/gitea/assets/115237/b75f70d7-8704-4afb-866d-fea0484c52d4">

After:
<img width="783" alt="Screenshot 2023-08-31 at 00 10 08"
src="https://github.com/go-gitea/gitea/assets/115237/50ed0c47-6f7c-449e-a054-13091369d43f">

---------

Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>

authored by

silverwind
wxiaoguang
and committed by
GitHub
9b76df53 c0ab7070

+39 -23
+11 -2
templates/devtest/flex-list.tmpl
··· 2 2 <link rel="stylesheet" href="{{AssetUrlPrefix}}/css/devtest.css?v={{AssetVersion}}"> 3 3 <div class="page-content devtest"> 4 4 <div class="ui container"> 5 - <h1 class="gt-border-secondary-bottom">Flex List (standalone)</h1> 5 + <h1>Flex List (standalone)</h1> 6 + <div class="divider"></div> 6 7 <div class="flex-list"> 7 8 <div class="flex-item"> 8 9 <div class="flex-item-leading"> ··· 85 86 </div> 86 87 </div> 87 88 88 - <div class="divider gt-my-0"></div> 89 + <div class="divider"></div> 89 90 90 91 <h1>Flex List (with "ui segment")</h1> 91 92 <div class="ui attached segment"> ··· 99 100 <div class="flex-list"> 100 101 <div class="flex-item">item 1</div> 101 102 <div class="flex-item">item 2</div> 103 + </div> 104 + </div> 105 + 106 + <h1>If parent provides the padding/margin space:</h1> 107 + <div class="gt-border-secondary gt-py-4"> 108 + <div class="flex-list flex-space-fitted"> 109 + <div class="flex-item">item 1 (no padding top)</div> 110 + <div class="flex-item">item 2 (no padding bottom)</div> 102 111 </div> 103 112 </div> 104 113 </div>
+4 -2
templates/package/shared/list.tmpl
··· 12 12 <button class="ui primary button">{{.locale.Tr "explore.search"}}</button> 13 13 </div> 14 14 </form> 15 - <div class="{{if .PackageDescriptors}}flex-list{{end}} gt-pt-4"> 15 + <div> 16 16 {{range .PackageDescriptors}} 17 + <div class="flex-list"> 17 18 <div class="flex-item"> 18 19 <div class="flex-item-main"> 19 20 <div class="flex-item-title"> ··· 34 35 </div> 35 36 </div> 36 37 </div> 38 + </div> 37 39 {{else}} 38 40 {{if not .HasPackages}} 39 41 <div class="empty center"> ··· 46 48 <p>{{.locale.Tr "packages.empty.documentation" "https://docs.gitea.com/usage/packages/overview/" | Safe}}</p> 47 49 </div> 48 50 {{else}} 49 - <p>{{.locale.Tr "packages.filter.no_result"}}</p> 51 + <p class="gt-py-4">{{.locale.Tr "packages.filter.no_result"}}</p> 50 52 {{end}} 51 53 {{end}} 52 54 {{template "base/paginate" .}}
+4 -2
templates/package/shared/versionlist.tmpl
··· 18 18 <button class="ui primary button">{{.locale.Tr "explore.search"}}</button> 19 19 </div> 20 20 </form> 21 - <div class="{{if .PackageDescriptors}}flex-list{{end}} gt-pt-4"> 21 + <div> 22 22 {{range .PackageDescriptors}} 23 + <div class="flex-list"> 23 24 <div class="flex-item"> 24 25 <div class="flex-item-main"> 25 26 <a class="flex-item-title" href="{{.FullWebLink}}">{{.Version.LowerVersion}}</a> ··· 28 29 </div> 29 30 </div> 30 31 </div> 32 + </div> 31 33 {{else}} 32 - <p>{{.locale.Tr "packages.filter.no_result"}}</p> 34 + <p class="gt-py-4">{{.locale.Tr "packages.filter.no_result"}}</p> 33 35 {{end}} 34 36 {{template "base/paginate" .}} 35 37 </div>
+1 -1
templates/repo/actions/runs_list.tmpl
··· 1 - <div class="flex-list gt-m-0"> 1 + <div class="flex-list"> 2 2 {{if eq (len .Runs) 0}} 3 3 <div class="empty center"> 4 4 {{svg "octicon-no-entry" 48}}
+1 -1
templates/repo/settings/deploy_keys.tmpl
··· 11 11 </div> 12 12 </h4> 13 13 <div class="ui attached segment"> 14 - <div class="{{if not .HasError}}gt-hidden{{end}} gt-mb-4" id="add-deploy-key-panel"> 14 + <div class="{{if not .HasError}}gt-hidden{{end}}" id="add-deploy-key-panel"> 15 15 <form class="ui form" action="{{.Link}}" method="post"> 16 16 {{.CsrfTokenHtml}} 17 17 <div class="field">
+1 -1
templates/shared/issuelist.tmpl
··· 1 - <div id="issue-list" class="flex-list gt-pt-4"> 1 + <div id="issue-list" class="flex-list"> 2 2 {{$approvalCounts := .ApprovalCounts}} 3 3 {{range .Issues}} 4 4 <div class="flex-item flex-item-baseline">
+1 -1
templates/user/dashboard/feeds.tmpl
··· 116 116 <div class="flex-item-body">{{TimeSince .GetCreate $.locale}}</div> 117 117 </div> 118 118 <div class="flex-item-trailing"> 119 - {{svg (printf "octicon-%s" (ActionIcon .GetOpType)) 32}} 119 + {{svg (printf "octicon-%s" (ActionIcon .GetOpType)) 32 "text grey gt-mr-2"}} 120 120 </div> 121 121 </div> 122 122 {{end}}
+1 -3
templates/user/profile.tmpl
··· 17 17 </div> 18 18 {{end}} 19 19 {{template "user/heatmap" .}} 20 - <div class="feeds"> 21 - {{template "user/dashboard/feeds" .}} 22 - </div> 20 + {{template "user/dashboard/feeds" .}} 23 21 {{else if eq .TabName "stars"}} 24 22 <div class="stars"> 25 23 {{template "explore/repo_search" .}}
+1 -1
templates/user/settings/keys_gpg.tmpl
··· 5 5 </div> 6 6 </h4> 7 7 <div class="ui attached segment"> 8 - <div class="{{if not .HasGPGError}}gt-hidden{{end}} gt-mb-4" id="add-gpg-key-panel"> 8 + <div class="{{if not .HasGPGError}}gt-hidden{{end}}" id="add-gpg-key-panel"> 9 9 <form class="ui form{{if .HasGPGError}} error{{end}}" action="{{.Link}}" method="post"> 10 10 {{.CsrfTokenHtml}} 11 11 <input type="hidden" name="title" value="none">
+1 -1
templates/user/settings/keys_ssh.tmpl
··· 7 7 </div> 8 8 </h4> 9 9 <div class="ui attached segment"> 10 - <div class="{{if not .HasSSHError}}gt-hidden{{end}} gt-mb-4" id="add-ssh-key-panel"> 10 + <div class="{{if not .HasSSHError}}gt-hidden{{end}}" id="add-ssh-key-panel"> 11 11 <form class="ui form" action="{{.Link}}" method="post"> 12 12 {{.CsrfTokenHtml}} 13 13 <div class="field {{if .Err_Title}}error{{end}}">
-7
web_src/css/dashboard.css
··· 95 95 position: static; 96 96 } 97 97 } 98 - 99 - .feeds code { 100 - padding: 2px 4px; 101 - border-radius: var(--border-radius); 102 - background-color: var(--color-markup-code-block); 103 - word-break: break-all; 104 - }
+13 -1
web_src/css/shared/flex-list.css
··· 91 91 border-top: 1px solid var(--color-secondary); 92 92 } 93 93 94 - /* Fomantic UI segment has default "padding: 1em", so here it removes the padding-top and padding-bottom accordingly */ 94 + /* Fomantic UI segment has default "padding: 1em", so here it removes the padding-top and padding-bottom accordingly. 95 + Developers could also use "flex-space-fitted" class to remove the first item's padding-top and the last item's padding-bottom */ 96 + .flex-list.flex-space-fitted > .flex-item:first-child, 95 97 .ui.segment > .flex-list:first-child > .flex-item:first-child { 96 98 padding-top: 0; 97 99 } 98 100 101 + .flex-list.flex-space-fitted > .flex-item:last-child, 99 102 .ui.segment > .flex-list:last-child > .flex-item:last-child { 100 103 padding-bottom: 0; 101 104 } 105 + 106 + /* If there is a divider besides the flex-list, some padding/margin are not needs */ 107 + .divider + .flex-list > .flex-item:first-child { 108 + padding-top: 0; 109 + } 110 + 111 + .flex-list + .divider { 112 + margin-top: 0; 113 + }