Player size in theater mode no longer fills entire screen window

[SharkMan201]

Bug Report:

⚬ BUG: When choosing forced theater mode, I had the player size configured to fill the entire browser window, but that is no longer happenning, see screenshot below:

⚬ HOW: Open any video and use the different Player size configurations, none of them are filling the screen window.

⚬ EXPECTED (/preferred) behavior: I can't remember the exact configuration I had before but none of them are showing the expected behavior, the closest one to the correct behavior is Old alternative ('Fit to window'), which does fill the entire browser window, but as you can see from the screenshot below it seems buggy as channel name, description and suggested videos overlap the Youtube player.

⚬ Context: I have noticed this issue starting today so it seems like a very recent change either from the extension or from YT side.

Setup:

⚬ ImprovedTube Version: 4.14 ⚬ Browser: Chrome ⚬ Settings: {"add_scroll_to_top":true,"always_show_progress_bar":false,"below_player_pip":false,"below_player_screenshot":false,"channel_default_tab":"/videos","custom_player_size_height":"1080","custom_player_size_width":"1920","day_of_week":false,"description":"normal","forced_theater_mode":true,"ga":1668443720750,"header_hide_right_buttons":false,"header_improve_logo":false,"header_position":"hover","header_transparent":false,"hide_date":false,"hide_details":false,"hide_scroll_for_details":false,"hide_views_count":false,"livechat":"collapsed","player_hide_annotations":false,"player_hide_cards":false,"player_hide_controls":"off","player_hide_endscreen":false,"player_quality":"large","player_size":"fit_to_window","player_transparent_background":false,"scroll_bar":"hidden","theme":"default","theme_primary_color":[200,200,200],"theme_text_color":[25,25,25],"thumbnails_hide":false,"thumbnails_right":false,"up_next_autoplay":false} ⚬ OS: Windows 10

[starobots]

I just noticed this problem, after auto-upgraded the extension to version 4.14. The setting of 'apperance -- player -- player size' has changed. The old 'fit to windows' has a new name called the 'old alternative' doesn't work well right now. I just hoping the fit to windows or even old full windows mode back to us. Thanks for upgrading and hard working on the extension. Thanks again

[hauntingly]

Having the same issue, just appeared out of nowhere.

[PoorChameleon]

I believe this might be a YouTube related change, but you can temporarily fix it by making a stylus userstyle which points to "URLs starting with" https://www.youtube.com/watch?v= and then pasting this inside it: ytd-watch-flexy[theater] #player-wide-container.ytd-watch-flexy { height: 100vh; max-height: none; }

[jamescl131]

Same issue

[RowanBee]

Same issue

[illogique]

it's also crop top and bottom of the video. must be a youtube change because it's also happening with "enhancer for youtube" plugin

[NiGHTsC]

I believe this might be a YouTube related change, but you can temporarily fix it by making a stylus userstyle which points to "URLs starting with" https://www.youtube.com/watch?v= and then pasting this inside it: ytd-watch-flexy[theater] #player-wide-container.ytd-watch-flexy { height: 100vh; max-height: none; }

@PoorChameleon Can you elaborate more? like paste the whole script you used to temp fix?

Thank you.

[Birphon]

Just had this happen to me and it does seem to be an auto update issue

I believe this might be a YouTube related change, but you can temporarily fix it by making a stylus userstyle which points to "URLs starting with" https://www.youtube.com/watch?v= and then pasting this inside it: ytd-watch-flexy[theater] #player-wide-container.ytd-watch-flexy { height: 100vh; max-height: none; }

This works for me! Thank you @PoorChameleon

I believe this might be a YouTube related change, but you can temporarily fix it by making a stylus userstyle which points to "URLs starting with" https://www.youtube.com/watch?v= and then pasting this inside it: ytd-watch-flexy[theater] #player-wide-container.ytd-watch-flexy { height: 100vh; max-height: none; }

PoorChameleon Can you elaborate more? like paste the whole script you used to temp fix?

Thank you.

@NiGHTsC stylus is another extension for Chrome and Firefox. Once installed click the "Manage" button

Then "Write new Style"

And paste the code that PoorChameleon has and then hit save making sure that "Enable" and "Live Preview" are ticked (should be by default)

You can now go to the Improved YouTube extension and change the player size and it should work like how it did before hand

[NiGHTsC]

Wanted to do it with Tampermonkey, but I guess it really need Stylus ;)

Thank you @Birphon!

[evq3-lalala]

You could use FireMonkey (hub for BOTH js and css) which is more active https://addons.mozilla.org/en-US/firefox/addon/firemonkey/

or greasemonkey (only for js) not that active or Stylus (only for css)

[josh-hemphill]

For Chrome I've been using Custom JavaScript for Websites 2 (which does both JS and CSS) since User JavaScript and CSS hasn't seen any updates since 2021

[Huhni]

uBlock Origin, which every sane person should have installed already, can also inject css: youtube.com##ytd-watch-flexy[theater] #player-wide-container.ytd-watch-flexy:style( height: 100vh!important; max-height: none!important; )

[kd-jo]

Same issue. Noticed it immediately today. Definitely a Youtube update that's causing this issue.

[MRiCEQB]

Same here - hoping for a fix

[wooziwoozi]

I can confirm this issue as well on Opera GX and Firefox.

[WMOH-DEV]

same here

[UmbraVivens]

uBlock Origin, which every sane person should have installed already, can also inject css: youtube.com##ytd-watch-flexy[theater] #player-wide-container.ytd-watch-flexy:style( height: 100vh!important; max-height: none!important; )

hi, i added this in my filters and it works, except the video ends up big enough that i can't see the progress bar unless i scroll down

[Rat-bags]

I also have this issue and it's driving me nuts! please fix I love this extension it's by far the best out there just wish fixes would come faster when there is issues

[illogique]

hi, i added this in my filters and it works, except the video ends up big enough that i can't see the progress bar unless i scroll down

put the header bar hidden, or static which is my normal setting but static i got black bar all around video with the workaround code

[jamescl131]

Does the developer comment here usually?

[PTomalak]

Same issue with Firefox, game-breaking bug for me, hope it's feasible to fix soon as I think many users rely on this feature. By the way great work on the extension, I've been using it for years and can't imagine going back to stock YT experience.

[chiming93]

Found this limiting the height of the div.

For quick prototype, it managed to fix the issue.

I'm no means a web dev, so I'll leave this finding to a better dev to come out with a proper fix.

[Johnnycus]

uBlock Origin, which every sane person should have installed already, can also inject css: youtube.com##ytd-watch-flexy[theater] #player-wide-container.ytd-watch-flexy:style( height: 100vh!important; max-height: none!important; )

hi, i added this in my filters and it works, except the video ends up big enough that i can't see the progress bar unless i scroll down

replace height: 100vh!important with height: calc(100vh - 56px)!important to make it visible (56px is the height of the top navbar)

[jamescl131]

Does anyone know if this is still maintained, surprised no mention of a fix coming yet. I know people donate their time to this and we appreciate it. Thanks for helping make Youtube better.

[WPettersson]

It's been 4 days, two of which were a weekend. The repository was lasted updated 5 days ago, so I'd say it's still being maintained yes.

[sentix001]

code worked perfect on ublock thanks what happens now if they update the extension to fix it will the code break the extension?

[ImprovedTube]

23 Participants🥰

(and i'm late 🥺) https://www.youtube.com/watch?v=gv2MLlZKarM

Update pending, thanks to @HanzCEO's pullrequest. Thanks for writing/caring/testing @Huhni @Birphon @PoorChameleon - together you almost wrote as much as an awesome tutorial / wikipage(, which we could link inside our extension, etc. )

• Also the whole topic is so uncovered/small still, which is the reason for this repo(drafted): https://github.com/code-charity/CollectiveTweaks
  • Wanna brainstorm?

what happens now if they update the extension to fix it will the code break the extension?

hi @sentix001, rather nothing happens (besides a few electrons) as it is specific. Of course you might remember all you set up and the best for everybody would be hiring somebody and making more/daily updates..

[jamescl131]

Thanks ImprovedTube, we appreciate this extension and glad to see you here.

[MRiCEQB]

Any ETA when this will be shipped to stable? As of 4.20 I still get this issue :(

[SharkMan201]

Any ETA when this will be shipped to stable? As of 4.20 I still get this issue :(

Its working fine for me now & I am on 4.20 as well, are you using the Full Height option ?

[MRiCEQB]

Oh, you are right! It was set to that option but only began to look right after I deselected and reselected it. Thanks !

[starobots]

it's 4.20 there, I select the 'old alternative - fit to window', but it doesn't work. what should I do right now?

[emslima]

I believe this might be a YouTube related change, but you can temporarily fix it by making a stylus userstyle which points to "URLs starting with" https://www.youtube.com/watch?v= and then pasting this inside it: ytd-watch-flexy[theater] #player-wide-container.ytd-watch-flexy { height: 100vh; max-height: none; }

thanks a lot!

[emslima]

Theater mode has broken again...

And now put this inside Style doesn't work anymore: ytd-watch-flexy[theater] #player-wide-container.ytd-watch-flexy { height: 100vh; max-height: none; }

[WMOH-DEV]

@emslima

ytd-watch-flexy[theater] #player-full-bleed-container.ytd-watch-flexy { height: 100vh !important; max-height: none !important; }

at this moment you can use the above code inside Style

[RowanBee]

@emslima

ytd-watch-flexy[theater] #player-full-bleed-container.ytd-watch-flexy { height: 100vh !important; max-height: none !important; }

at this moment you can use the above code inside Style

This is broken for me now as well

[emslima]

broke again 😥

[WMOH-DEV]

    ytd-watch-flexy[theater] #full-bleed-container.ytd-watch-flexy{
        height: 100vh !important;
        max-height: none !important;
    }

😅

[ElmorenohWTF]

@WMOH-DEV That solved the problem for me! Seeing how easy it is to fix it using an userstyle, I hope they fix this bug in the extension soon.

[emslima]

ytd-watch-flexy[theater] #full-bleed-container.ytd-watch-flexy{ height: 100vh !important; max-height: none !important; }

Thaks a lot, see you tomorrow or the day after tomorrow, again😉

[UmbraVivens]

the workaround codes still leave some space under the video when i go fullscreen, where i can see the video title

[ZornTaov]

For people with problems of there being a gap at the bottom or the video extends past the bottom of the window, try adjusting the 100vh to 99vh or 101vh. I think fractions work, too? just increase or decrease that number till it fits better.

[sunilkumaredappal]

ok

On Fri, 1 Sept 2023 at 13:53, Brian Hoem @.***> wrote:

For people with problems of there being a gap at the bottom or the video extends past the bottom of the window, try adjusting the 100vh to 99vh or 101vh. I think fractions work, too? just increase or decrease that number till it fits better.

— Reply to this email directly, view it on GitHub https://github.com/code-charity/youtube/issues/1710#issuecomment-1702363337, or unsubscribe https://github.com/notifications/unsubscribe-auth/AKLZSK3WHYPZ4JYR5T45LQTXYGLPPANCNFSM6AAAAAAZXQ35EI . You are receiving this because you are subscribed to this thread.Message ID: @.***>

[josh-hemphill]

A better way to do it is to use calc() to adjust by pixels, it's what some solutions use already. e.g. height: calc(100vh - 12px) But in the case shown above, it's height is limited by it already being max width, if you increase the height more, you could cut off some of the sides.