resolution another CSS size breakpoint for large screens

[computerprep 148]

I work on a 27" Thunderbolt display often... and it'd be nice if we could get another breakpoint for .scalableCard.portraitCard posters...

 

something around the 2000px mark for 10% width is what I'm thinking, but it might need to be specific to non-retina displays. So the media query should include -webkit pixel ratios and min-resolution.

kinda like this. https://css-tricks.com/snippets/css/retina-display-media-query/

 

Currently on this screen, poster images are coming out at 311x511px, real life 2.75x4.125" ... they're just monsters.

 

Smaller subset of people, but that group of people will grow as technology gives us larger screens for less $$

Edited August 15, 2016 by computerprep

[anderbytes 140]

@@Luke, I was going to open a new thread for a similar matter, but instead I'll complement @@computerprep request.

 

My screen is 1600x900, and when I try to view items details, it seems that Emby puts a max width to content that leaves two huge blank areas beside posters and everything (full size.jpg).

 

- If I resize window to smaller sizes, it gets auto-adjusted (as seen in attached small.jpg, medium.jpg and large.jpg)

- If I do custom CSS, like .detailPageContent { max-width: 90%; }  , I can force that the whole window is used, but that is not good because images gets stretched and appears very blurry.

 

 

     All sections are impacted by this width limit: Main info, Cast & crew, Check these out... , Details, Media info...

 

 

Could you please take a look?

[anderbytes 140]

"Fix me! I'm a bad, bad bug !"

Edited August 19, 2016 by anderbytes

[computerprep 148]

it seems that Emby puts a max width to content that leaves two huge blank areas beside posters and everything

I need time check this out oh a computer before giving a more detailed response, but we "should" be able to solve this properly with custom CSS.

 

Again, I'll see what I can finagle.

 

Ultimately, your issue might be best solved with custom CSS. In the world of UI/UX design, you want to keep the total number of characters per line pretty low. Otherwise the average human eye/brain had a hard time tracking to the next line and is more likely to lose interest ave not truly absorb the information they're reading.

 

The content passes already break the "rule" ... But they do it in a similar way to Netflix, Hulu, and others.

 

All thus is just to say that removing the margins on the right and left will have very adverse effects to must users. These pages could be organized better, but simply removing the margins is not ideal to implement for everyone.

 

I like the critical eye, though. Keep posting when you find things that could be improved.

 

I'll try to look at writing some better custom CSS for you early next week.

[anderbytes 140]

Well, if you consider that main screen and library browser already fill the screen beautifully, I just don't see why this screen can't be that way, too.

 

About quantity of lines, I already suggested in the past that the number of lines be also customizable. For me, only 1 line would be perfect.

Edited August 19, 2016 by anderbytes

[anderbytes 140]

Oh.. and more. I saw that server calculates how many photos it returns in real time, so other than what I did with CSS above, don't know what can be done...

[anderbytes 140]

@@Luke, just remembering that Emby TV (https://tv.emby.media) and Emby Theater already arranges everything beautifully.

 

This way, I really believe this is some sort of bug