loading up the forgejo repo on tangled to test page performance
Fix rerun icon on action view component (#25531)
Right now rerun icon on action view component will not be seen when
duration text length is long, because the wrapper `job-brief-info` has a
fixed width, and the svg is squeezed. The way to fix this in this PR is
to change width to `fit-content` and exchange position of duration text
and rerun svg.
Before (rerun svg not shown on hover):
<img width="1401" alt="Screen Shot 2023-06-27 at 12 53 41"
src="https://github.com/go-gitea/gitea/assets/17645053/bb3f62ec-8c56-4dbc-96f1-718b50426d91">
After:
<img width="1409" alt="Screen Shot 2023-06-27 at 12 50 59"
src="https://github.com/go-gitea/gitea/assets/17645053/620aa02c-2326-408d-a763-453f48f42c40">
+2
-2
+2
-2
web_src/js/components/RepoActionView.vue
+2
-2
web_src/js/components/RepoActionView.vue
···
38
38
<span class="job-brief-name gt-mx-3 gt-ellipsis">{{ job.name }}</span>
39
39
</a>
40
40
<span class="job-brief-info">
41
-
<span class="step-summary-duration">{{ job.duration }}</span>
42
41
<SvgIcon name="octicon-sync" role="button" :data-tooltip-content="locale.rerun" class="job-brief-rerun gt-mx-3" @click="rerunJob(index)" v-if="job.canRerun && onHoverRerunIndex === job.id"/>
42
+
<span class="step-summary-duration">{{ job.duration }}</span>
43
43
</span>
44
44
</div>
45
45
</div>
···
590
590
.job-brief-item .job-brief-link {
591
591
display: flex;
592
592
width: 100%;
593
+
min-width: 0;
593
594
}
594
595
595
596
.job-brief-item .job-brief-link span {
···
610
611
.job-brief-item .job-brief-info {
611
612
display: flex;
612
613
align-items: center;
613
-
width: 55px;
614
614
}
615
615
616
616
/* ================ */