diff options
| author | Eekle <96976531+Eekle@users.noreply.github.com> | 2022-06-10 12:06:34 +0100 |
|---|---|---|
| committer | GitHub <noreply@github.com> | 2022-06-10 19:06:34 +0800 |
| commit | 4f1fb0f6971e3cd2ea679a58ff1e8bea88f29198 (patch) | |
| tree | a00c448e754820e6c75f74af6a56c9024dcef9f5 | |
| parent | 52c2e82813c2519cd08c9ecd66ef7b0815682770 (diff) | |
| download | gitea-4f1fb0f6971e3cd2ea679a58ff1e8bea88f29198.tar.gz gitea-4f1fb0f6971e3cd2ea679a58ff1e8bea88f29198.zip | |
Make user profile image show full image on mobile (#19840)
* Make user profile image show full image on mobile
| -rw-r--r-- | templates/user/profile.tmpl | 6 | ||||
| -rw-r--r-- | web_src/less/_user.less | 15 |
2 files changed, 8 insertions, 13 deletions
diff --git a/templates/user/profile.tmpl b/templates/user/profile.tmpl index abcc227bec..8f67f1cee1 100644 --- a/templates/user/profile.tmpl +++ b/templates/user/profile.tmpl @@ -4,15 +4,17 @@ <div class="ui stackable grid"> <div class="ui five wide column"> <div class="ui card"> + <div id="profile-avatar" class="content df"/> {{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}} </a> {{else}} - <span class="image" id="profile-avatar"> + <span class="image"> {{avatar .Owner 290}} </span> {{end}} + </div> <div class="content word-break profile-avatar-name"> {{if .Owner.FullName}}<span class="header text center">{{.Owner.FullName}}</span>{{end}} <span class="username text center">{{.Owner.Name}}</span> diff --git a/web_src/less/_user.less b/web_src/less/_user.less index e192986819..4576d1c9e7 100644 --- a/web_src/less/_user.less +++ b/web_src/less/_user.less @@ -44,27 +44,20 @@ } } } - #profile-avatar { background: none; padding: 1rem 1rem .25rem; - + justify-content: center; img { width: 100%; height: auto; object-fit: contain; margin: 0; - } - - @media @mediaSm { - height: 250px; - overflow: hidden; - - img { - max-height: 767px; - max-width: 767px; + @media @mediaSm { + width: 30vw; } } + } @media @mediaSm { |