Avatar for Username

Шукати в статтях підтримки

Остерігайтеся нападів зловмисників. Mozilla ніколи не просить вас зателефонувати, надіслати номер телефону у повідомленні або поділитися з кимось особистими даними. Будь ласка, повідомте про підозрілі дії за допомогою меню “Повідомити про зловживання”

Докладніше

Ця тема перенесена в архів. Якщо вам потрібна допомога, запитайте.

Change color of blank page before renderization

  • 2 відповіді
  • 1 має цю проблему
  • 86 переглядів
  • Остання відповідь від rgomes

rgomes
rgomes
more options

I spend 12+ hours a day in front of a computer and blank pages hurt my eyes. I use dark mode wherever possible.

I've changed the background color of about:blank already and it works as I expected.

However, when a request is fired to load a web page, there's a quick transition which may paint the canvas totally blank before starting rendering the requested page. Since this transition may take a couple of seconds sometimes in my environment, the screen flashes blank onto my face, really hurting my eyes used to most of things dark most of the time.

Is there a way to configure the color of this transitioning blank page, please?

Thanks a lot in advance. :-)

I spend 12+ hours a day in front of a computer and blank pages hurt my eyes. I use dark mode wherever possible. I've changed the background color of about:blank already and it works as I expected. However, when a request is fired to load a web page, there's a quick transition which may paint the canvas totally blank before starting rendering the requested page. Since this transition may take a couple of seconds sometimes in my environment, the screen flashes blank onto my face, really hurting my eyes used to most of things dark most of the time. Is there a way to configure the color of this transitioning blank page, please? Thanks a lot in advance. :-)

Обране рішення

Answering my own question:

I've created userChrome.css like this: 

@-moz-document url(chrome://browser/content/browser.xhtml)
{
  #main-window,
  browser[type="content-primary"],
  browser[type="content"],
  tabbrowser#content,
  #content,
  browser[type="content"] > html
  {
     background: #202020 !important;
  }
}

and I've created userContent.css like this: 

@-moz-document url("about:newtab") {
  body {
    background-color: #202020 !important;
  }
}

@-moz-document url("about:blank") {
  body {
    background-color: #202020 !important;
  }
}

@-moz-document url(chrome://browser/content/browser.xhtml) {
  browser[type="content-primary"] {
    background: #202020 !important
  }
}
Читати цю відповідь у контексті 👍 0

Усі відповіді (2)

rgomes
rgomes Власник питання
more options

Duplicate of https://support.mozilla.org/en-US/questions/1269392

rgomes
rgomes Власник питання
more options

Вибране рішення

Answering my own question:

I've created userChrome.css like this: 

@-moz-document url(chrome://browser/content/browser.xhtml)
{
  #main-window,
  browser[type="content-primary"],
  browser[type="content"],
  tabbrowser#content,
  #content,
  browser[type="content"] > html
  {
     background: #202020 !important;
  }
}

and I've created userContent.css like this: 

@-moz-document url("about:newtab") {
  body {
    background-color: #202020 !important;
  }
}

@-moz-document url("about:blank") {
  body {
    background-color: #202020 !important;
  }
}

@-moz-document url(chrome://browser/content/browser.xhtml) {
  browser[type="content-primary"] {
    background: #202020 !important
  }
}

Змінено cor-el