Skip to content

[UI] When a row is not fully filled, some views show centered images and others show left-aligned #7369

@aaronrudkin

Description

@aaronrudkin

This issue respects the following points:

  • This issue is not already reported on GitHub (I've searched it).
  • I agree to follow Jellyfin's Code of Conduct.
  • This report addresses only a single issue; If you encounter multiple issues, kindly create separate reports for each one.

Describe the bug

I reported this on Jellyfin-Media-Player and after 9 months the issue got closed asking me to report it here:

jellyfin/jellyfin-desktop#853

This issue occurs in both the MacOS jellyfin-media-player client and the web client.

If I go to my Movies library with the default 100 films per page and 7 films per line, then after the 98th film there will be two more films left over. Those two films will be left aligned (as in the screenshot). If I go into an actor and look at their "Movies" in my library and I have more than 10 films with the actor, the last two films of the 10 displayed will be left aligned. If I click "More" to see all films with the actor, the films on the final line will be centered instead of left aligned. Another example of center alignment is when editing images for a movie, the overhang posters of the poster set are centered rather than left aligned.

Reproduction Steps

Have a library with at least 100 films and an actor with at least 10 films and a number of films that is not a multiple of 7. In my case, I have 45 Three Stooges films with Curly Howard.

Expected/Actual behaviour

All UI grid views of movie posters should exhibit the same alignment, ideally left aligned because the centering looks terrible.

See screenshots in previous report.

Logs

No response

Server version

10.10.2

Web version

10.10.2

Build version

10.10.2

Platform

MacOS

Browser

N/A

Additional information

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions