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.

fix(ui): improve milestone/project header consistency (#7174)

The related CSS `milestone-card` is used in 3 places:
* global milestone view `/milestones`
* per-repo milestone view
* per-user/org projects view

The first two had gaps too small basically provided by whitespace. The latter was using an unusually large gap via tailwind.

Reviewed-on: https://codeberg.org/forgejo/forgejo/pulls/7174
Reviewed-by: Gusted <gusted@noreply.codeberg.org>
Co-authored-by: 0ko <0ko@noreply.codeberg.org>
Co-committed-by: 0ko <0ko@noreply.codeberg.org>

authored by

0ko
0ko
and committed by
Gusted
58ca578f 377052c9

+15 -6
+6 -4
templates/projects/list.tmpl
··· 41 41 <div class="milestone-list"> 42 42 {{range .Projects}} 43 43 <li class="milestone-card"> 44 - <h3 class="flex-text-block tw-m-0 tw-gap-3"> 45 - {{svg .IconName 16}} 46 - <a class="muted tw-break-anywhere" href="{{.Link ctx}}">{{.Title}}</a> 47 - </h3> 44 + <div class="milestone-header"> 45 + <h3> 46 + {{svg .IconName 16}} 47 + <a class="muted tw-break-anywhere" href="{{.Link ctx}}">{{.Title}}</a> 48 + </h3> 49 + </div> 48 50 <div class="milestone-toolbar"> 49 51 <div class="group"> 50 52 <div class="flex-text-block">
+1 -1
templates/repo/issue/milestones.tmpl
··· 21 21 {{range .Milestones}} 22 22 <li class="milestone-card"> 23 23 <div class="milestone-header"> 24 - <h3 class="flex-text-block tw-m-0"> 24 + <h3> 25 25 {{svg "octicon-milestone" 16}} 26 26 <a class="muted" href="{{$.RepoLink}}/milestone/{{.ID}}">{{.Name}}</a> 27 27 </h3>
+1 -1
templates/user/dashboard/milestones.tmpl
··· 73 73 {{range .Milestones}} 74 74 <li class="milestone-card"> 75 75 <div class="milestone-header"> 76 - <h3 class="flex-text-block tw-m-0"> 76 + <h3> 77 77 <span class="ui large label"> 78 78 {{.Repo.FullName}} 79 79 </span>
+7
web_src/css/shared/milestone.css
··· 29 29 justify-content: space-between; 30 30 } 31 31 32 + .milestone-header h3 { 33 + display: flex; 34 + align-items: center; 35 + margin: 0; 36 + gap: 0.5rem; 37 + } 38 + 32 39 .milestone-toolbar { 33 40 padding-top: 5px; 34 41 display: flex;