diff options
| author |  tobi <31960611+tsmethurst@users.noreply.github.com> | 2025-04-11 12:05:26 +0200 |
|---|---|---|
| committer |  GitHub <noreply@github.com> | 2025-04-11 12:05:26 +0200 |
| commit | be9e307418fdd60273f3a202a75249cbdaf4b499 (patch) | |
| tree | 4cf678b862a99434c4fe023ef008b8d4cf750ad2 /web/source/css | |
| parent | [feature] Implement /oauth/revoke for token revocation (#3983) (diff) | |
| download | gotosocial-be9e307418fdd60273f3a202a75249cbdaf4b499.tar.xz | |
[chore] render avatar in photoswipe slide, remove repeated alt text (#3985)
* [chore] render avatar in photoswipe slide, remove repeated alt text
* bwap bwap
Diffstat (limited to 'web/source/css')
| -rw-r--r-- | web/source/css/_profile-header.css | 42 |
1 files changed, 23 insertions, 19 deletions
diff --git a/web/source/css/_profile-header.css b/web/source/css/_profile-header.css index cba67ffa1..3b14edab8 100644 --- a/web/source/css/_profile-header.css +++ b/web/source/css/_profile-header.css @@ -20,8 +20,20 @@ .profile .profile-header { background: $profile-bg; border-radius: $br; - overflow: hidden; - margin-bottom: 1rem; + + /* + Link to open media in slide + should fill entire media wrapper. + */ + a.photoswipe-slide { + display: inline-block; + height: 100%; + width: 100%; + + &:focus-visible { + outline: $button-focus-outline; + } + } .moved-to { padding: 1rem; @@ -30,8 +42,10 @@ .header-image-wrapper { position: relative; - padding-top: 33.33%; /* aspect-ratio 1/3 */ - + aspect-ratio: 3; + height: 100%; + width: 100%; + img { position: absolute; top: 0; @@ -66,6 +80,7 @@ margin: 1rem; margin-top: calc(-1 * $overlap); gap: 0 1rem; + padding-bottom: 1rem; .avatar-image-wrapper { grid-area: avatar; @@ -82,22 +97,11 @@ width: $avatar-size; /* - Link to open media in slide - should fill entire media wrapper. + Offset to avoid clashing with + thick border around avatars. */ - a.photoswipe-slide { - display: inline-block; - height: 100%; - width: 100%; - - /* - Offset to avoid clashing with - thick border around avatars. - */ - &:focus-visible { - outline: $button-focus-outline; - outline-offset: 0.25rem; - } + a.photoswipe-slide:focus-visible { + outline-offset: 0.25rem; } .avatar { |