Skip to content

Commit

Permalink
Add word-break to repo description in home page (go-gitea#27924)
Browse files Browse the repository at this point in the history
In go-gitea#25315, @denyskon fixed UI on mobile view.
But for the repo description, on desktop view there's no word-break. 
So maybe we can just add `gt-word-break` to fix it on both mobile view
and desktop view.

Before:
desktop view:

![image](https://github.com/go-gitea/gitea/assets/18380374/a7659f5b-fbe9-400a-8cc2-cca44778556e)
mobile view:

![image](https://github.com/go-gitea/gitea/assets/18380374/611f1b81-58ac-4213-b165-5c73e24ca79e)

After:
desktop view:

![image](https://github.com/go-gitea/gitea/assets/18380374/f21bf3a7-f6aa-457d-9bfa-5c57659c68b1)
mobile view(almost same?)

![image](https://github.com/go-gitea/gitea/assets/18380374/ad2d1a4d-1172-402c-b5fc-5e910657847d)

---------

Co-authored-by: silverwind <me@silverwind.io>
  • Loading branch information
2 people authored and fuxiaohei committed Jan 17, 2024
1 parent 6e6b8fa commit f04e2b1
Show file tree
Hide file tree
Showing 2 changed files with 4 additions and 4 deletions.
2 changes: 1 addition & 1 deletion templates/repo/home.tmpl
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
{{template "base/alert" .}}
{{template "repo/code/recently_pushed_new_branches" .}}
{{if and (not .HideRepoInfo) (not .IsBlame)}}
<div class="ui repo-description">
<div class="ui repo-description gt-word-break">
<div id="repo-desc" class="gt-font-16">
{{$description := .Repository.DescriptionHTML $.Context}}
{{if $description}}<span class="description">{{$description | RenderCodeBlock}}</span>{{else if .IsRepositoryAdmin}}<span class="no-description text-italic">{{ctx.Locale.Tr "repo.no_desc"}}</span>{{end}}
Expand Down
6 changes: 3 additions & 3 deletions web_src/css/repo.css
Original file line number Diff line number Diff line change
Expand Up @@ -211,14 +211,14 @@
display: flex;
justify-content: space-between;
align-items: center;
gap: 5px;
margin-bottom: 5px;
}

@media (max-width: 767.68px) {
@media (max-width: 767.98px) {
.repository.file.list .repo-description {
flex-direction: column;
gap: 8px;
align-items: normal;
align-items: stretch;
}
}

Expand Down

0 comments on commit f04e2b1

Please sign in to comment.