Vivaldi 1.11 - Window focus customizations stopped working

  • Hello Vivaldi community! Since 1.11, I'm having trouble with a customization I created. I cobbled together some CSS that changes the color of the tabs and behind the tabs in order to match the default Windows color scheme for activated/deactivated title bars. So in other words, i have a bright primary color when the window is focused and a washed out color when the window is blurred. This matches the color scheme of all other windows and also the Vivaldi window's title bar.

    Since 1.11, what seems to happen is that if I open Vivaldi on the start page or new tab page, the code works, but as soon as I open a web page, it stops working, then it stops working even on the previously working pages. Pictures and code below. Thank you so much!

    alt text
    alt text

    Not working:
    alt text

    .color-behind-tabs-on.stacks-on .tab-strip .tab:not(.active) .tab-group-indicator,
    .color-behind-tabs-on .tab-strip .tab:not(.active) {
      background-image: linear-gradient(rgba(247,255,250,0.10), rgba(247,255,250,0.10)), linear-gradient(var(--colorAccentBgFaded), var(--colorAccentBgFaded));
    .color-behind-tabs-on.stacks-on .tab-strip .tab:hover:not(.active) .tab-group-indicator,
    .color-behind-tabs-on .tab-strip .tab:hover:not(.active) {
      background-image: linear-gradient(rgba(247,255,250,0.30), rgba(247,255,250,0.30)), linear-gradient(var(--colorAccentBgFaded), var(--colorAccentBgFaded));
    #browser.isblurred.color-behind-tabs-on.stacks-on .tab-strip .tab:not(.active) .tab-group-indicator .tab-indicator:not(.active) {
      background-image: linear-gradient(rgba(247,255,250,0.88), rgba(247,255,250,0.88)), linear-gradient(var(--colorAccentBgFaded), var(--colorAccentBgFaded));
    #browser.isblurred.color-behind-tabs-on.stacks-on .tab-strip .tab:not(.active) .tab-group-indicator,
    #browser.isblurred.color-behind-tabs-on.stacks-on .tab-strip .tab-group-indicator .tab-indicator:not(.active),
    #browser.isblurred.color-behind-tabs-on .tab-position .tab:not(.active) {
      background-image: linear-gradient(rgba(247,255,250,0.83), rgba(247,255,250,0.83)), linear-gradient(var(--colorAccentBgFaded), var(--colorAccentBgFaded));
      color: var(--colorFg);
    #browser.isblurred.color-behind-tabs-on #tabs-container .trash,
    #browser.isblurred.color-behind-tabs-on .tabs-container,
    #browser.isblurred.color-behind-tabs-on .tab-strip,
    #browser.isblurred.color-behind-tabs-on .vivaldi {
      background-image: linear-gradient(rgba(247,255,250,0.73), rgba(247,255,250,0.73)), linear-gradient(var(--colorAccentBg), var(--colorAccentBg));
    /* ********************************************************************************* */

  • Use three backticks to open and close code ```
    As for your issue, I tested it and it works both on internal and on normal webpages. But I'm on osx....

  • @luetage Thanks for the tip, I added the "ticks" to get the code enclosed.

  • Just to see if it made any difference, I tried running the 1.12.933.3 build and it has the same issue. At least on Windows.

  • OK so I figured out why my CSS is failing. When a tab is loading and it's the active tab, and then you switch to another application so that Vivaldi loses focus , the "isblurred" class is not being applied to the #browser div. Also, the "hasfocus" class is still being applied. Once this happens, focus/blur never changes again until you restart the browser. So this actually looks to be a bug in Vivaldi. I discovered this using the Developer Tools to inspect the browser classes.

    Here are two screenshots. Both times the browser window was not in focus, and you can see "isblurred" is not in the list of classes after the issue pops up.

    alt text

    alt text

  • I kept digging. The events don't fire in javascript either. Using this custom.js file attached to browser.html

    window.focusTester = {
      onFocus: function() {
        console.log('Window Focused');
      onBlur: function() {
        console.log('Window Blurred');
    (function() {
      window.addEventListener('load', function () {
        window.addEventListener('focus', window.focusTester.onFocus, true);
        window.addEventListener('blur', window.focusTester.onBlur, true);
        console.log('focus and blur events added');

    You can see console messages up until you visit the first real web page. (You have to launch Vivaldi with the debug flags that let you inspect the browser itself in the dev console. vivaldi.exe --flag-switches-begin --debug-packed-apps --silent-debugger-extension-api --flag-switches-end)

  • Well, not much activity... Can anybody else confirm this? I submitted a bug report, but it feels like a gigantic black hole since there is no reference number created, nor any way to track the progress or even see if they read it.

  • @thx1200 usually you should get a mail from JIRA when posting a report. Did you provide your valid email?

  • I did provide a valid email -- the same one I use for forums. I checked my email and also junk mail and don't see anything. When I submitted the bug report, it said "thank you for submitting" and such, so I'm reasonably sure it created the issue, but now I don't know.

  • I just submitted a bug report again because I wasn't sure if I did it right the first time. This is all it says!

    **Report a Bug
    Thank you for helping us make Vivaldi better!

    Got more on your mind?
    Come talk to us in our forums, on Twitter and Facebook.**

    How do I know it's being worked on? How do I track the progress?

  • @thx1200 There is no public bugtracker. You receive an email to the address you provided in the form. This means your report has been successfully submitted. If you wanna know the status you can ask in the forums.

  • the problem is that "sometimes" no mail is sent back, I made 2 reports and no jira mail was sent back, in the past 3 weeks.

  • The first time I got no email. This time, I did. Thanks for clearing that up!

    Issue Collector created VB-32595

  • To anybody following this thread, this issue appears to be fixed in the latest 1.12 release.


Looks like your connection to Vivaldi Forum was lost, please wait while we try to reconnect.