jellyfin/jellyfin-web

Subtitles have a different shadow than my settings

Opened this issue ยท 11 comments

Describe The Bug
When I play something, the subtitles have this shadow that look like a drop shadow, even though I changed it to 'uniform' in the settings.

Steps To Reproduce

  1. Go to personal settings
  2. Click on subtitles
  3. Scroll down to drop shadow
  4. Set to 'Uniform'
  5. Save
  6. Play a video
  7. See error

Expected Behavior
I expected the subtitles to look like the 'uniform' subtitles

Screenshots
This is the subtitle I expect:
image
And this is the subtitle I get:
image

System (please complete the following information):

  • Platform: Windows 10
  • Browser: Firefox
  • Jellyfin Version: 10.9.2

Logs
I don't know if these errors are relevant, but they show up in the browser console.

HLS Error: Type: otherError Details: internalException Fatal: false main.jellyfin.bundle.js:2:73451
ReferenceError: t is not defined 38932f0f-23f6-4806-8cad-44df1f497289:1:100
HLS Error: Type: mediaError Details: bufferFullError Fatal: false 3 main.jellyfin.bundle.js:2:73451
HLS Error: Type: mediaError Details: bufferFullError Fatal: false

Additional Context
The subtitle type in the screenshot is subrip.
Additionally, this error does not occur when using the Jellyfin Media Player desktop app (which is supposed to be a wrapper of the website right?)

Duplicate of #5592

Actually I don't think this is a duplicate... are you using any custom css?

Yeah, I'm using the ultrachromic styles.
This is the custom CSS:

@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/progress/floating.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/titlepage/title_simple-logo.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/type/dark.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/cornerindicator/indicator_floating.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/fields/fields_border.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/login/login_frame.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/episodelist/episodes_compactlist.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/rounding.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/base.css');@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/accentlist.css');@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/fixes.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/smallercast.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/header/header_transparent.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/effects/hoverglow.css');
@import url('https://ctalvio.github.io/Monochromic/backdrop-hack_style.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/fixes.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/smallercast.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/header/header_transparent.css');
@import url('https://cdn.jsdelivr.net/gh/CTalvio/Ultrachromic/effects/hoverglow.css');
@import url('https://ctalvio.github.io/Monochromic/backdrop-hack_style.css');
:root {--accent: 98.00787045,121.00999580324999,204.99450000000002;}
.backdropImage {filter: blur(30px);}
.backdropImage {filter: saturate(120%);}
.backdropImage {filter: contrast(120%);}
.backdropImage {filter: brightness(40%);}
:root {--rounding: 12px;}

I have removed all the custom CSS, and the problem still persists. So I don't think it's caused by the custom CSS.

z1R commented

I'm having the same problem. Also on Firefox.

@z1R are you using any custom css?

z1R commented

@thornbill yes but like the original poster it makes no difference if I remove the custom css or not.

I'm not using any custom CSS and this is reproducible here. Using Firefox.

Same problem here.
The subtitles seem to respond to vertical position change, but not to changes in size/shadow setting.

Same problem here. The subtitles seem to respond to vertical position change, but not to changes in size/shadow setting.

Yup, i'm getting the same. You can change all settings that change the way subtitles display, the only property that changes is the verticial position.

Text size, Text weight, Font, Colour, Shadow all do not work. This is present on Firefox. It seems it works on Edge and Chrome, from what i've tested.

identified the issue, will fix it and raise the PR.

z1R commented

identified the issue, will fix it and raise the PR.

Will this be implemented in the next update?

I would like to add this issue is also present in Safari (macOS).