1
1
mirror of https://github.com/go-gitea/gitea synced 2025-02-26 06:44:19 +00:00
Hester Gong d42015e6eb
Fix long name ui issues and label ui issue ()
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 
Closes 
2023-03-18 17:07:59 +01:00

179 lines
2.8 KiB
CSS

.user.profile .ui.card .header {
display: block;
font-weight: 600;
font-size: 1.3rem;
margin-top: -0.2rem;
line-height: 1.3rem;
}
.user.profile .ui.card .profile-avatar-name {
border-top: none;
text-align: center;
}
.user.profile .ui.card .extra.content {
padding: 0;
}
.user.profile .ui.card .extra.content ul {
margin: 0;
padding: 0;
}
.user.profile .ui.card .extra.content ul li {
padding: 10px;
list-style: none;
}
.user.profile .ui.card .extra.content ul li:not(:last-child) {
border-bottom: 1px solid var(--color-secondary);
}
.user.profile .ui.card .extra.content ul li .svg {
margin-left: 1px;
margin-right: 5px;
}
.user.profile .ui.card .extra.content ul li.follow .ui.button {
width: 100%;
}
.user.profile .ui.card #profile-avatar {
background: none;
padding: 1rem 1rem 0.25rem;
justify-content: center;
}
.user.profile .ui.card #profile-avatar img {
width: 100%;
height: auto;
object-fit: contain;
margin: 0;
}
@media (max-width: 767px) {
.user.profile .ui.card #profile-avatar img {
width: 30vw;
}
}
@media (max-width: 767px) {
.user.profile .ui.card {
width: 100%;
}
}
.user.profile .ui.repository.list {
margin-top: 25px;
}
.user.profile .ui.repository.list .repo-title .labels {
word-break: normal;
flex-shrink: 0;
}
.user.profile #loading-heatmap {
margin-bottom: 1em;
}
.user.profile .ui.secondary.stackable.pointing.menu {
flex-wrap: wrap;
}
.user.followers .header.name {
font-size: 20px;
line-height: 24px;
vertical-align: middle;
}
.user.followers .follow .ui.button {
padding: 8px 15px;
}
.user.notification .svg {
float: left;
font-size: 2em;
}
.user.notification .svg.green {
color: var(--color-green);
}
.user.notification .svg.red {
color: var(--color-red);
}
.user.notification .svg.purple {
color: var(--color-purple);
}
.user.notification .svg.blue {
color: var(--color-blue);
}
.user.notification .content {
float: left;
margin-left: 7px;
}
.user.notification table form {
display: inline-block;
}
.user.notification table button {
padding: 3px 3px 3px 5px;
}
.user.notification table tr {
cursor: pointer;
}
.user .button.adopt,
.user .button.delete {
margin-top: -15px;
margin-bottom: -15px;
}
.user .button.adopt .label,
.user .button.delete .label {
vertical-align: middle;
}
.user.link-account:not(.icon) {
padding-top: 15px;
padding-bottom: 5px;
}
.user.settings .iconFloat {
float: left;
}
.user-orgs {
display: flex;
flex-flow: row wrap;
padding: 0;
margin: -3px !important;
}
.user-orgs li {
display: flex;
border-bottom: 0 !important;
padding: 3px !important;
width: 20%;
max-width: 60px;
}
.user-badges {
display: grid;
grid-template-columns: repeat(auto-fill, 64px);
gap: 2px;
}
.user-badges img {
object-fit: contain;
}
#notification_div .tab.segment {
overflow-x: auto;
}