Small subtitles since update

[Royalnaga 1]

All my existing subtitles have suddenly changed to being extreeeeeemly tiny and im trying to figure out a way to solve it without success (its only on the browser version)

Picture (1) Normal settings / Picture (2) Extra large settings 

The placement of the subtitles is just that scene its not a issue as it reverts back to being middle bottom afterwards but still incredibly small

The 1 min trial Theatre shows the subtitle normally (picture 3)

Removed the face just to avoid any unintentional spoilers as its not revelant anyways, Any tips / help would be appreciated

Version 4.7.0.60

Edited May 20, 2022 by Royalnaga

[Abobader 3464]

Hello Royalnaga,

** This is an auto reply **

Please wait for someone from staff support or our members to reply to you.

It's recommended to provide more info, as it explain in this thread:

Thank you.

Emby Team

[Luke 42079]

Hi, do you have any custom css? If so then try removing that.

[Royalnaga 1]

14 minutes ago, Luke said:

Hi, do you have any custom css? If so then try removing that.

Not that i know of honestly i dont even know what that is? Can you tell me how to check?

[seanbuff 1318]

31 minutes ago, Royalnaga said:

Not that i know of honestly i dont even know what that is? Can you tell me how to check?

If you don't know, then it's unlikely you have added any, but worth checking anyway.

[Royalnaga 1]

Sadly empty going to bed now so my response is going to be delayed for 8 hours

[rbjtech 5284]

I'm using external .SRT files.

I wound concur with the OP - 'Normal' is now very small in a browser.   Setting to 'Large' is the equivalent to how 'Normal' used to look. 

Not a huge issue in the great scheme of things as you can set to Large easily enough  - but maybe worth recalibrating back to match the other Apps ?

 

Edited May 20, 2022 by rbjtech

[Royalnaga 1]

11 hours ago, rbjtech said:

I'm using external .SRT files.

I wound concur with the OP - 'Normal' is now very small in a browser.   Setting to 'Large' is the equivalent to how 'Normal' used to look. 

Not a huge issue in the great scheme of things as you can set to Large easily enough  - but maybe worth recalibrating back to match the other Apps ?

 

Ty for this response its good to know that im not the only one running into this issue 

[Rumbah 8]

I have the same problem.

Using Arch Linux Server and Windows 10 Firefox 100 I get these tiny subtitles by default. Even in "Extra Large" it is a little too small for my taste, especially as the border of the letters is thinner, too.

The real problem is that the subtitle setting is not saved. Every time I close the browser and reopen it, it is back to the new "normal" very small subtitles.

Edited May 26, 2022 by Rumbah

[Luke 42079]

Just now, Rumbah said:

 

The real problem is that the subtitle setting is not saved. Every time I close the browser and reopen it, it is back to the new "normal" very small subtitles.

This setting is stored client-side because you might want different options on different screens, so it sounds like you have something clearing your web browsing data.

[Rumbah 8]

Thanks for the fast answer.

Ok, then I guess I'll have to live with the new behaviour and set it every time I use subtitles as when I close my browser, all cookies are killed.

Perhaps a setting to set a new personal default for unknown clients of a user is possible?

 

And should the default be that small? For me it looks like the attached image. In addition to the size I find it hard to read as the shadow effect is not that strong and if I select the outline effect, it is very thin, I guess only one pixel wide.

As seen in Royalnaga's post I find the old text rendering much more readable. The text is much bigger (than even extra large) and the outline is thicker. Or is there a setting to get it to look like the old subtitles with still bigger font and thicker outline?

 

[Luke 42079]

Regarding the small size, I'm going to take another look at it and try to get it to match the browser's native subtitle rendering more closely.

[Rumbah 8]

Thank you.

[visproduction 315]

Browser zoom affects subtitles sizes.  You probably inadvertainly changed your browser zoom.
 

[Rumbah 8]

No, browser zoom is 100% like before. And Windows scaling set to 125% like before. The size of the UI etc. is the same as before, only the subtitles are (much) smaller.

[visproduction 315]

Hmmm, you did check the page with the movie?  Browsers can remember zoom sizes for each page type.  Your home page could be 100%, but the movie page is cached as staying on 67%, for example.

[Royalnaga 1]

6 minutes ago, visproduction said:

Hmmm, you did check the page with the movie?  Browsers can remember zoom sizes for each page type.  Your home page could be 100%, but the movie page is cached as staying on 67%, for example.

Yep no my browser isnt zoomed in or out at all tried multiple different videos to see if that was the case and nope sadly not

[visproduction 315]

So the font-family for Emby is:

font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

 

If your system does not have Roboto, then it goes to the next one on the list.  Each font will look different and have slightly different sizes.  If that is happening, then all the fonts in the site would change.  It seems like you would notice that.  So that's probably not it.  But check your windows font directory or do a browser inspect and see what font is active.  If you are missing some font, you can usually go find it and add it.  Of course any user would not bother doing that.  The idea here is that whatever Windows or Mac has normally installed, is what is used.  So usually you don't need to do anything.  I mention in case somehow some of your Windows fonts were deleted by someone.

===

 

Tweaking your css to force it to do what you want:

The .css for the video subtitles is:

.videoPlayerContainer > div > div > div

If you wanted to override all the variable settings, you could put this in custom css and then the subtitles would always do whatever you set here. 

This defeats the admin controls, which is not ideal.

/* video subtitles */
.videoPlayerContainer > div > div > div {
	font-size: 22px !important;
	color:yellow !important;
	text-shadow: 2px 2px 1px #fff !important; /* shadow right, bottom, blur, color */
	font-family:Arial !important;
	top:-12px !important; /* move up (top negative) or down (top positive) Usually not needed. */
	word-spacing: 0.6em; /* optionally increase spacing between words. 0.1 movement is noticable */
	background-color:#333; /* dark gray - you can pick any color */
	padding: 4px 20px !important; /* top/botton, left/right extra padding for background color */
	opacity:0.9; /* optional see through the subtitles */
	border: 1px #446587 solid; /* optional border around the background color */
	border-radius: 0.3em !important; /* optional change in rounded corners of background.  It is already set to 0.25em. */
}

If you make any css updates, you may need to clear the browser cache before you see the changes.  Usually !important changes are recognized without a browser cache clear, but it varies.

===

.srt files can force a font size, color changes, but it's sort of obvious if you look at the file.  Normally that is only done for the subtitle creator putting a credit at the start of the film.
===

Finally be aware, once you take the first step to custom css, it is like jumping down the rabbit hole.  The passage of time will vanish and you will start to lose track of what is large or small.  Ha!

Hope that helps.

Edited May 29, 2022 by visproduction

[Royalnaga 1]

1 hour ago, visproduction said:

So the font-family for Emby is:

font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";

 

If your system does not have Roboto, then it goes to the next one on the list.  Each font will look different and have slightly different sizes.  If that is happening, then all the fonts in the site would change.  It seems like you would notice that.  So that's probably not it.  But check your windows font directory or do a browser inspect and see what font is active.  If you are missing some font, you can usually go find it and add it.  Of course any user would not bother doing that.  The idea here is that whatever Windows or Mac has normally installed, is what is used.  So usually you don't need to do anything.  I mention in case somehow some of your Windows fonts were deleted by someone.

===

 

Tweaking your css to force it to do what you want:

The .css for the video subtitles is:

.videoPlayerContainer > div > div > div

If you wanted to override all the variable settings, you could put this in custom css and then the subtitles would always do whatever you set here. 

This defeats the admin controls, which is not ideal.

/* video subtitles */
.videoPlayerContainer > div > div > div {
	font-size: 22px !important;
	color:yellow !important;
	text-shadow: 2px 2px 1px #fff !important; /* shadow right, bottom, blur, color */
	font-family:Arial !important;
	top:-12px !important; /* move up (top negative) or down (top positive) Usually not needed. */
	word-spacing: 0.6em; /* optionally increase spacing between words. 0.1 movement is noticable */
	background-color:#333; /* dark gray - you can pick any color */
	padding: 4px 20px !important; /* top/botton, left/right extra padding for background color */
	opacity:0.9; /* optional see through the subtitles */
	border: 1px #446587 solid; /* optional border around the background color */
	border-radius: 0.3em !important; /* optional change in rounded corners of background.  It is already set to 0.25em. */
}

If you make any css updates, you may need to clear the browser cache before you see the changes.  Usually !important changes are recognized without a browser cache clear, but it varies.

===

.srt files can force a font size, color changes, but it's sort of obvious if you look at the file.  Normally that is only done for the subtitle creator putting a credit at the start of the film.
===

Finally be aware, once you take the first step to custom css, it is like jumping down the rabbit hole.  The passage of time will vanish and you will start to lose track of what is large or small.  Ha!

Hope that helps.

Thank you very much this altleast allows me to get it larger then the max preset emby sizes (that were just small) i went with a very dumbed down version of your custom css:

/* video subtitles */
.videoPlayerContainer > div > div > div {
	font-size: 60px !important;
	color:white !important;
	text-shadow: 0px 0px 0px #fff !important; /* shadow right, bottom, blur, color */
	font-family:Arial !important;
	top:-12px !important; /* move up (top negative) or down (top positive) Usually not needed. */*/
}

Its working perfectly for what i want im now just adjusting the font-size to my "perfect" size

[visproduction 315]

Good, I'm glad that worked.  text-shadow is normally there a little because you might run into subtitles on top of snow, for example.  All 0 means you have no text shadow at all.

 

[Klugh 0]

I have the same problem. Since updating from 4.6 to 4.7. ASUSTOR. Same problem with Emby server on Windows, same problem at different resolutions, browsers and PCs. Updated to 4.8.0.0 beta but same there.

I also noticed that the subtitles are displayed in the correct size for maybe one tenth of a second (given if there is a subtitle at that time), but after that it changes to the very small size.

A temporary solution to have subtitles to scale according to the the viewport's smaller dimension I now use this simple css:

/* video subtitles */
.videoPlayerContainer > div > div > div {
    font-size: 5vmin !important;
}

 

[Rumbah 8]

Thanks for the fix in the latest version, works great for me.

[Luke 42079]

Thanks for the feedback.