SomeEgrets
@SomeEgrets

there's likely a reasonably easy(?) way to make these comply with the site setting for this!

i don't know what it is right now and i'm swamped at work so i can't research it at the moment. i don't think we can use media queries with inline CSS, but i wouldn't be surprised if there's a class we can inherit from the site to switch between them...

(tbh i only have a surface level knowledge of frontend webdev so someone smarter than me can probably contribute here...)


You must log in to comment.

in reply to @SomeEgrets's post:

There is a prefers-reduced-motion media query in CSS that is inherited from system settings and which can also be accessed through JavaScript.

However, media queries don't work in Cohost's CSS crimes and it doesn't appear that the setting is exposed anywhere in the website's code as a class or attribute to inherit from (and I don't think you could do that with only inline CSS anyway).

There might be some cursed solution that uses the way that Cohost's animations (as used in CSS crimes) are disabled if you have prefers-reduced-motion on. Use an animation that runs once to swap a static image for a gif??

That's an idea, but I think you'd still need to author a custom @keyframes rule to swap out the image, which isn't possible with in inline CSS.

I suppose some absolute mad-thing could use an animation on an element with two offset images (one animated, one not), stop the animation mid-iteration, use step to remove the visual transition between them, and then mask out the one not in using overflow or clip-path or similar.

That seems insane to me, but it might work, maybe.