Skip to content

Commit

Permalink
Fix long name ui issues and label ui issue (#23541)
Browse files Browse the repository at this point in the history
This PR fixes some ui problems as mentioned in the two issues below.
1. Long file path has no word break

## Before
<img width="1357" alt="截屏2023-03-17 17 49 43"
src="https://user-images.githubusercontent.com/17645053/225873491-27c7bf9a-d5d5-4065-9e4a-ff228e935abf.png">

## After
<img width="1248" alt="截屏2023-03-17 17 51 22"
src="https://user-images.githubusercontent.com/17645053/225873562-93b87af7-9c83-43f8-aa0d-36a9174d25ac.png">
on mobile
<img width="408" alt="截屏2023-03-17 17 51 15"
src="https://user-images.githubusercontent.com/17645053/225873554-1b8c8999-1dfc-4251-a7fc-20ecd3444cb0.png">


2. Texts in labels  
## Before
<img width="1219" alt="截屏2023-03-17 17 49 24"
src="https://user-images.githubusercontent.com/17645053/225873369-812b1b52-c104-4e32-988f-c3e55ad2f844.png">

## After
<img width="1259" alt="截屏2023-03-17 17 51 31"
src="https://user-images.githubusercontent.com/17645053/225873317-9717fd2c-e9e1-4a00-a27d-6bdc5933c3ca.png">
with two labels
<img width="1258" alt="截屏2023-03-17 17 51 53"
src="https://user-images.githubusercontent.com/17645053/225873323-13198192-71de-472d-8e78-6fd86ddba3d9.png">
In explore and star pages
<img width="896" alt="截屏2023-03-17 18 25 00"
src="https://user-images.githubusercontent.com/17645053/225878962-9e26e3aa-cff0-451c-9133-19f4ad1507a4.png">

<img width="913" alt="截屏2023-03-17 18 25 09"
src="https://user-images.githubusercontent.com/17645053/225878967-6adaa414-136e-43c2-87d0-7e46a0da112e.png">

3. Long name repository on creating new fork page
## Before
<img width="919" alt="截屏2023-03-17 17 50 01"
src="https://user-images.githubusercontent.com/17645053/225873723-5c4ea137-3b51-4074-a458-ef442e330ddf.png">

## After
<img width="907" alt="截屏2023-03-17 17 50 37"
src="https://user-images.githubusercontent.com/17645053/225873772-fc4a52c3-49c6-4ca6-903d-a13707f2a98b.png">

<img width="383" alt="截屏2023-03-17 17 50 48"
src="https://user-images.githubusercontent.com/17645053/225873779-6de1dfde-5c05-4ae9-89e1-85c25b3a1682.png">

Closes #23535
Closes #23534
  • Loading branch information
HesterG committed Mar 18, 2023
1 parent 48f6805 commit d42015e
Show file tree
Hide file tree
Showing 6 changed files with 20 additions and 5 deletions.
2 changes: 1 addition & 1 deletion templates/explore/repo_list.tmpl
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
<a class="name" href="{{.Link}}">
{{if or $.PageIsExplore $.PageIsProfileStarList}}{{if .Owner}}{{.Owner.Name}} / {{end}}{{end}}{{.Name}}
</a>
<div class="labels gt-df gt-ac gt-fw">
<div class="labels gt-df gt-ac gt-fw gt-mr-3">
{{if .IsArchived}}
<span class="ui basic label">{{$.locale.Tr "repo.desc.archived"}}</span>
{{end}}
Expand Down
2 changes: 1 addition & 1 deletion templates/repo/pulls/fork.tmpl
Original file line number Diff line number Diff line change
Expand Up @@ -37,7 +37,7 @@

<div class="inline field">
<label>{{.locale.Tr "repo.fork_from"}}</label>
<a href="{{.ForkRepo.Link}}">{{.ForkRepo.FullName}}</a>
<a href="{{.ForkRepo.Link}}" class="gt-dib">{{.ForkRepo.FullName}}</a>
</div>
<div class="inline required field {{if .Err_RepoName}}error{{end}}">
<label for="repo_name">{{.locale.Tr "repo.repo_name"}}</label>
Expand Down
5 changes: 5 additions & 0 deletions web_src/css/explore.css
Original file line number Diff line number Diff line change
Expand Up @@ -41,6 +41,11 @@
margin-bottom: 0.5rem;
}

.ui.repository.list .repo-title .labels {
word-break: normal;
flex-shrink: 0;
}

.ui.repository.branches .info {
font-size: 12px;
color: var(--color-text-light);
Expand Down
7 changes: 4 additions & 3 deletions web_src/css/form.css
Original file line number Diff line number Diff line change
Expand Up @@ -479,7 +479,8 @@ textarea:focus,

.repository.new.repo form .selection.dropdown,
.repository.new.migrate form .selection.dropdown,
.repository.new.fork form .selection.dropdown {
.repository.new.fork form .selection.dropdown,
.repository.new.fork form .field a {
vertical-align: middle;
width: 50% !important;
}
Expand All @@ -491,6 +492,7 @@ textarea:focus,
.repository.new.repo form input,
.repository.new.migrate form input,
.repository.new.fork form input,
.repository.new.fork form .field a,
.repository.new.repo form .selection.dropdown,
.repository.new.migrate form .selection.dropdown,
.repository.new.fork form .selection.dropdown {
Expand All @@ -500,8 +502,7 @@ textarea:focus,
.repository.new.migrate form .field button,
.repository.new.fork form .field button,
.repository.new.repo form .field a,
.repository.new.migrate form .field a,
.repository.new.fork form .field a {
.repository.new.migrate form .field a {
margin-bottom: 1em;
width: 100%;
}
Expand Down
4 changes: 4 additions & 0 deletions web_src/css/repository.css
Original file line number Diff line number Diff line change
Expand Up @@ -214,6 +214,10 @@
font-size: 1.2em;
}

.repository.file.list .repo-path {
word-break: break-word;
}

.repository.file.list .repo-path .section,
.repository.file.list .repo-path .divider {
display: inline;
Expand Down
5 changes: 5 additions & 0 deletions web_src/css/user.css
Original file line number Diff line number Diff line change
Expand Up @@ -67,6 +67,11 @@
margin-top: 25px;
}

.user.profile .ui.repository.list .repo-title .labels {
word-break: normal;
flex-shrink: 0;
}

.user.profile #loading-heatmap {
margin-bottom: 1em;
}
Expand Down

0 comments on commit d42015e

Please sign in to comment.