[Bug]: Vibrancy not applied in fullscreen (macOS)

[Spiderpig86]

Is there an existing issue for this?

• [X] I have searched the existing issues

Current Behavior

Using Vscode 1.71.2, when I change the window to use fullscreen mode (f11), vibrancy disappears. It appears again once it is no longer fullscreen.

Expected Behavior

Vibrancy should still be applied on the window even in fullscreen mode.

Steps To Reproduce

1. Hit f11 or enter fullscreen on Vscode.

Environment

- OS: Windows 10
- VSCode: 1.71.2
- Extension: 1.1.9

Anything else?

No response

[ynsgnr]

I think this functions as intended, Windows and MacOS disables vibrancy on full screen to improve focus

[illixion]

I think this functions as intended, Windows and MacOS disables vibrancy on full screen to improve focus

Can confirm, this is likely intentional Electron behavior, you could maximize the window as an alternative.

[EmreSURK]

Nope, it is not. Both Safari and Finder are still vibrant. Blur radius becomes very large but they are still being affected by the desktop wallpaper. You can see a slightly different colors for different wallpaper images.

As an alternative, we may put theme color on the background. Here is an issue I opened for this: https://github.com/illixion/vscode-vibrancy-continued/issues/47

[MrConnorKenway]

This is intended. If you look at Default Dark.css, you will find

.monaco-workbench.fullscreen {
    background-color: #202020 !important; /* make the background-color non transparent when in fullscreen */
}

To reenable vibrancy in fullscreen mode, change it to

.monaco-workbench.fullscreen {
    background-color: transparent !important;
}

[illixion]

@EmreSURK

Nope, it is not. Both Safari and Finder are still vibrant. Blur radius becomes very large but they are still being affected by the desktop wallpaper.

I believe what you're seeing is not transparency, but rather wallpaper tinting, which is a macOS setting that is on by default. With that setting off, there is no transparency.

@MrConnorKenway

This is intended. If you look at Default Dark.css, you will find

Good catch, though after checking this on macOS, it doesn't appear to actually enable transparency. Instead it just takes the background color average and applies that. I'll look into this later, but feel free to use the Vibrancy custom import feature in the meantime.

[EmreSURK]

@illixion Yes, apparently you are right. Good Point. I checked the image pixel colors with Digital Color Meter if there is a slight difference we can not release it. No, no different, only one color.

[minhiu]

This is intended. If you look at Default Dark.css, you will find

.monaco-workbench.fullscreen {
  background-color: #202020 !important; /* make the background-color non transparent when in fullscreen */
}

To reenable vibrancy in fullscreen mode, change it to

.monaco-workbench.fullscreen {
  background-color: transparent !important;
}

I have a dumb question but how do we modify this css file in VSCode?

[illixion]

This is intended. If you look at Default Dark.css, you will find

.monaco-workbench.fullscreen {
    background-color: #202020 !important; /* make the background-color non transparent when in fullscreen */
}

To reenable vibrancy in fullscreen mode, change it to

.monaco-workbench.fullscreen {
    background-color: transparent !important;
}

I have a dumb question but how do we modify this css file in VSCode?

You can use the import feature for that. Create a CSS file somewhere on the disk with your desired contents, copy the full path (on Windows, Shift+Right click then choose Copy as path) and add it to your VSCode config under Vibrancy settings as described here: https://github.com/illixion/vscode-vibrancy-continued#vscode_vibrancyimports

If you're on Windows, you'll also need to replace all backslashes with forward slashes.