diff options
author | 2024-07-21 14:22:08 +0200 | |
---|---|---|
committer | 2024-07-21 14:22:08 +0200 | |
commit | 027a93facc73b78e3c3747ab796f4a14b1b4936f (patch) | |
tree | 51838cd9fdf607ad46fdfa77a9424fdd8f5cd98d /web/source | |
parent | [bugfix] update common get target account / status doing refresh async (#3124) (diff) | |
download | gotosocial-027a93facc73b78e3c3747ab796f4a14b1b4936f.tar.xz |
[feature/frontend] Respect `prefers-reduced-motion` for avatars, headers, and emojis (#3118)
* [feature/frontend] Respect `prefers-reduced-motion` for avatars, headers, and emojis
* go fmt
* fix tests
* use static version of instance thumbnail when appropriate
* use prefers-reduced-motion
* simplify account conversion a bit
* fix c&p error
Diffstat (limited to 'web/source')
-rw-r--r-- | web/source/css/base.css | 26 | ||||
-rw-r--r-- | web/source/css/index.css | 3 | ||||
-rw-r--r-- | web/source/css/page.css | 3 | ||||
-rw-r--r-- | web/source/css/status.css | 8 |
4 files changed, 18 insertions, 22 deletions
diff --git a/web/source/css/base.css b/web/source/css/base.css index 522820f15..630e4a6d2 100644 --- a/web/source/css/base.css +++ b/web/source/css/base.css @@ -187,18 +187,20 @@ input, select, textarea, .input { margin: -0.2em 0.02em 0; object-fit: contain; vertical-align: middle; - transition: 0.1s; - - /* - Enlarge emojis on hover to give - viewer a good look at them. - */ - &:hover, &:active { - transform: scale(2); - background-color: $bg; - box-shadow: $boxshadow; - border: $boxshadow-border; - border-radius: $br-inner; + + @media (prefers-reduced-motion: no-preference) { + /* + Enlarge emojis on hover to give + viewer a good look at them. + */ + transition: 0.1s; + &:hover, &:active { + transform: scale(2); + background-color: $bg; + box-shadow: $boxshadow; + border: $boxshadow-border; + border-radius: $br-inner; + } } } diff --git a/web/source/css/index.css b/web/source/css/index.css index 59909ec33..382cd68c6 100644 --- a/web/source/css/index.css +++ b/web/source/css/index.css @@ -30,7 +30,8 @@ line-height: 2rem; } - & > img { + img, + picture { align-self: center; max-height: 6rem; } diff --git a/web/source/css/page.css b/web/source/css/page.css index cc1d4efe3..642586048 100644 --- a/web/source/css/page.css +++ b/web/source/css/page.css @@ -48,7 +48,8 @@ gap: 1rem; justify-content: center; - img { + img, + picture { align-self: center; /* diff --git a/web/source/css/status.css b/web/source/css/status.css index 5c7400654..21dc3416e 100644 --- a/web/source/css/status.css +++ b/web/source/css/status.css @@ -193,14 +193,6 @@ main { font-size: 1rem; line-height: initial; } - - img { - max-width: 100%; - margin: 5px auto; - } - img[alt~="!center"] { - display: block; - } } .poll { |