core
/
gitea
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Make user profile image show full image on mobile (#19840) 

* Make user profile image show full image on mobile
This commit is contained in:
Eekle 2022-06-10 12:06:34 +01:00 committed by GitHub
parent 52c2e82813
commit 4f1fb0f697
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
templates/user/profile.tmpl
View File

@ -4,15 +4,17 @@
<div class="ui stackable grid"> <div class="ui stackable grid">
<div class="ui five wide column"> <div class="ui five wide column">
<div class="ui card"> <div class="ui card">
<div id="profile-avatar" class="content df"/>
{{if eq .SignedUserName .Owner.Name}} {{if eq .SignedUserName .Owner.Name}}
<a class="image tooltip" href="{{AppSubUrl}}/user/settings" id="profile-avatar" data-content="{{.i18n.Tr "user.change_avatar"}}" data-position="bottom center"> <a class="image tooltip" href="{{AppSubUrl}}/user/settings" data-content="{{.i18n.Tr "user.change_avatar"}}" data-position="bottom center">
{{avatar .Owner 290}} {{avatar .Owner 290}}
</a> </a>
{{else}} {{else}}
<span class="image" id="profile-avatar"> <span class="image">
{{avatar .Owner 290}} {{avatar .Owner 290}}
</span> </span>
{{end}} {{end}}
</div>
<div class="content word-break profile-avatar-name"> <div class="content word-break profile-avatar-name">
{{if .Owner.FullName}}<span class="header text center">{{.Owner.FullName}}</span>{{end}} {{if .Owner.FullName}}<span class="header text center">{{.Owner.FullName}}</span>{{end}}
<span class="username text center">{{.Owner.Name}}</span> <span class="username text center">{{.Owner.Name}}</span>

15
web_src/less/_user.less
View File

@ -44,27 +44,20 @@
} }
} }
} }
#profile-avatar { #profile-avatar {
background: none; background: none;
padding: 1rem 1rem .25rem; padding: 1rem 1rem .25rem;
justify-content: center;
img { img {
width: 100%; width: 100%;
height: auto; height: auto;
object-fit: contain; object-fit: contain;
margin: 0; margin: 0;
} @media @mediaSm {
width: 30vw;
@media @mediaSm {
height: 250px;
overflow: hidden;
img {
max-height: 767px;
max-width: 767px;
} }
} }
} }
@media @mediaSm { @media @mediaSm {