Firefox如何得到黑暗主题的searchbar-results [英] Firefox how to get dark themed searchbar-results

问题描述

我在MacOS上使用Firefox Developer Edition主题来减少编程时的眼睛疲劳。

但是，在位置栏中输入时，结果仍然会出现明亮的白色。

有人知道附加元件或CSS让这些结果使用深色背景和浅色文字吗？

解决方案

一般来说，如果您正在寻找一个附加组件将改变这一点，那么一个主题将是适当的。我使用的至少一个主题会对URL栏的自动完成结果进行风格化。如果需要，扩展也可以改变样式。然而，考虑到你不想要一个完全不同的主题，只是对开发版主题的一个小的修改，自己这样做更容易通过应用CSS到配置文件的chrome通过将CSS放在 userChrome.css 。

要自己做，你需要确定适当的元素样式。通常情况下，附加程序

因此，我们可以在配置文件的 userChrome.css ，其需要位于 [profile directory] ​​/ chrome 目录中：

  / * 
 *编辑此文件并将其作为userChrome.css复制到
 * profile-directory / chrome / 
 * / 
 
 / * 
 *此文件可用于自定义Mozilla用户界面的外观
 *您应该考虑使用！important对您希望
 *的规则覆盖默认设置。 
 * / 
 
 / * 
 *不要删除@namespace行 - 正确运行是必需的
 * / 
 / * set默认命名空间到XUL * / 
 @namespace url（http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul）; 
 
 #PopupAutoCompleteRichResult {
 background-color：black！important; 
 -moz-border-top-colors：black！important; 
 -moz-border-top-colors：black！important; 
 -moz-border-left-colors：black！important; 
 -moz-border-right-colors：black！important; 
} 
 
 #PopupAutoCompleteRichResult .autocomplete-richlistbox {
 background-color：black！important; 
} 
 
 #PopupAutoCompleteRichResult .ac-title-text，
 #PopupAutoCompleteRichResult .ac-tags-text，
 / *＃PopupAutoCompleteRichResult .ac-url- * / 
 #PopupAutoCompleteRichResult .ac-action-text {
 color：white; 
} 
  

这会导致URL栏自动完成， ：

I am using the Firefox Developer Edition theme on MacOS to reduce eye strain while programming.

However, results while typing in the location bar still pop up bright white.

Does anyone know of add-ons or CSS to have these results use a dark background and light text?

解决方案

Generally, if you are looking for an add-on which will change this, then a theme would be appropriate. At least one of the themes I use does style the URL Bar's auto-complete results. An extension could also change the styling, if desired. However, given that you are not wanting a completely different theme, just a minor modification to the Developer Edition theme, it is easier to do this yourself by applying CSS to the profile's chrome by placing the CSS in userChrome.css.

To do it for yourself, you need to determine the appropriate elements to style. As is often the case, the add-ons DOM Inspector combined with Element Inspector are quite useful in determining the appropriate elements to style. With those add-ons installed, opening the auto-complete drop-down and Shift-Right-Click results in seeing the DOM for what we want to change:

Thus, we can put the following in the profile's userChrome.css, which needs to be located in the [profile directory]/chrome directory:

/*
 * Edit this file and copy it as userChrome.css into your
 * profile-directory/chrome/
 */

/*
 * This file can be used to customize the look of Mozilla's user interface
 * You should consider using !important on rules which you want to
 * override default settings.
 */

/*
 * Do not remove the @namespace line -- it's required for correct functioning
 */
/* set default namespace to XUL */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#PopupAutoCompleteRichResult {
    background-color:black !important;
    -moz-border-top-colors:black !important;
    -moz-border-top-colors:black !important;
    -moz-border-left-colors:black !important;
    -moz-border-right-colors:black !important;
}

#PopupAutoCompleteRichResult .autocomplete-richlistbox {
    background-color:black !important;
}

#PopupAutoCompleteRichResult .ac-title-text,
#PopupAutoCompleteRichResult .ac-tags-text,
/*#PopupAutoCompleteRichResult .ac-url-text,*/
#PopupAutoCompleteRichResult .ac-action-text {
    color:white;
}

This results in the URL Bar auto-complete having a black background with white text:

这篇关于Firefox如何得到黑暗主题的searchbar-results的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！