Tweak repo topics bar (#25769)

Minor tweaks to repo topics:

- Use gap instead of margin to align "Manage Topics" when no topics
present
- Add margin to description instead

Before:

<img width="1232" alt="Screenshot 2023-07-08 at 13 08 15"
src="https://github.com/go-gitea/gitea/assets/115237/a5d3586c-6cbf-4b74-8137-11d91f2cbb45">
<img width="1233" alt="Screenshot 2023-07-08 at 13 08 05"
src="https://github.com/go-gitea/gitea/assets/115237/59b18d93-e4cb-4f2b-9bc2-d6aa63f93827">

After:

<img width="1232" alt="Screenshot 2023-07-08 at 13 08 42"
src="https://github.com/go-gitea/gitea/assets/115237/470d42ad-3f7e-40f9-b0a1-203b4af77eb9">
<img width="1231" alt="Screenshot 2023-07-08 at 13 08 32"
src="https://github.com/go-gitea/gitea/assets/115237/42d18048-748c-4a3f-ab89-3403866cef34">

---------
This commit is contained in:
silverwind 2023-07-08 20:12:30 +02:00 committed by GitHub
parent 52b3052757
commit f8bb1018ae
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 4 deletions

View file

@ -29,9 +29,9 @@
</div>
{{end}}
</div>
<div class="gt-df gt-ac gt-fw gt-mt-3" id="repo-topics">
{{range .Topics}}<a class="ui repo-topic large label topic" href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=1">{{.Name}}</a>{{end}}
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}}<button id="manage_topic" class="btn interact-fg gt-ml-2 gt-font-12">{{.locale.Tr "repo.topic.manage_topics"}}</button>{{end}}
<div class="gt-df gt-ac gt-fw gt-gap-2" id="repo-topics">
{{range .Topics}}<a class="ui repo-topic large label topic gt-m-0" href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=1">{{.Name}}</a>{{end}}
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}}<button id="manage_topic" class="btn interact-fg gt-font-12">{{.locale.Tr "repo.topic.manage_topics"}}</button>{{end}}
</div>
{{end}}
{{if and .Permission.IsAdmin (not .Repository.IsArchived)}}

View file

@ -231,6 +231,7 @@
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 5px;
}
@media (max-width: 767.68px) {
@ -2777,7 +2778,6 @@ tbody.commit-list {
#repo-topics .repo-topic {
font-weight: var(--font-weight-normal);
cursor: pointer;
margin: 2px;
}
#new-dependency-drop-list.ui.selection.dropdown {