Minor markup and css suggestions

hoh

Add the CSS rule

.markdown img{
    image-orientation: from-image;
}

Reasoning:

In the current day of smartphones, it's common to take photos at different device orientation.
When people upload photos from their phone, the image will look fine to them if they use Safari, since Safari automatically compensates for the orientation noted in the EXIF data of the image.
Other browsers don't do that, so the image may be flipped as viewed by others. This may cause confusion for the uploader.
image-orientation: from-image tells the browser to consider the orientation EXIF data, and is supported in Firefox, and in the upcoming Chrome 81.

Impact: Rectifies a reasonably common mistake for Firefox users, and in future versions of Chrome. No effects elsewhere.


[now the default]

Add the attribute

allowfullscreen

to embedded youtube trailers on media pages.

This enables the fullscreen button on the video, which currently does nothing.

Reasoning:

In other cases, it's fine to just follow the link to youtube instead if one wants to focus solely on the video. But for trailers (or entire short films in some cases), it's desirable to not leave the page since one may wish to update the list data afterwards.


Add the CSS rule

.__ns__pop2top{
    z-index: initial;
}

(may need greater specificity or an !important, depending on the implementation)

Reasoning:

Currently, the search overlay appears behind the activity feed, for users of the popular browser extension NoScript, when a piece of media content (mostly webms) is blocked in the feeds.
This is due to a unfortunate coincidence, simultaneously highlighting blocked items and opening the Anilist search.

This is not a bug by NoScript nor Anilist, but the CSS rule it's a simple way to ensure compatibility.

2 Replies