Fix various overflows on actions view (#30344)

Fix a number of text overflow issues in actions view and run list. Also
improve mobile view of run list.

Fixes: https://github.com/go-gitea/gitea/issues/30328

<img width="782" alt="Screenshot 2024-04-08 at 23 10 16"
src="3d9f9f88-3eab-44a0-8144-30c2b58b24cb">
<img width="935" alt="Screenshot 2024-04-08 at 23 17 46"
src="581d73ea-a31d-416b-be3a-47313b879b12">
<img width="1008" alt="Screenshot 2024-04-08 at 23 49 05"
src="c5d10565-f285-477f-8659-1caf94797647">
<img width="397" alt="Screenshot 2024-04-08 at 23 55 30"
src="368aaa75-1903-4058-9d75-d1fe91c564d6">

(cherry picked from commit b9f69b4a4d1d6b5b1f94852f6dfcae41b30658ff)
This commit is contained in:
silverwind 2024-04-15 21:46:52 +02:00 committed by Gergely Nagy
parent b691a3e6b8
commit ac0a20365b
No known key found for this signature in database
3 changed files with 43 additions and 13 deletions

View file

@ -1,4 +1,4 @@
<div class="flex-list">
<div class="flex-list run-list">
{{if not .Runs}}
<div class="empty-placeholder">
{{svg "octicon-no-entry" 48}}
@ -28,14 +28,14 @@
</div>
<div class="flex-item-trailing">
{{if .RefLink}}
<a class="ui label tw-px-1 tw-mx-0" href="{{.RefLink}}">{{.PrettyRef}}</a>
<a class="ui label run-list-ref gt-ellipsis" href="{{.RefLink}}">{{.PrettyRef}}</a>
{{else}}
<span class="ui label tw-px-1 tw-mx-0">{{.PrettyRef}}</span>
<span class="ui label run-list-ref gt-ellipsis">{{.PrettyRef}}</span>
{{end}}
</div>
<div class="run-list-item-right">
<div class="run-list-meta">{{svg "octicon-calendar" 16}}{{TimeSinceUnix .Updated ctx.Locale}}</div>
<div class="run-list-meta">{{svg "octicon-stopwatch" 16}}{{.Duration}}</div>
<div class="run-list-item-right">
<div class="run-list-meta">{{svg "octicon-calendar" 16}}{{TimeSinceUnix .Updated ctx.Locale}}</div>
<div class="run-list-meta">{{svg "octicon-stopwatch" 16}}{{.Duration}}</div>
</div>
</div>
</div>
{{end}}