“userChrome.css”的版本间的差异

来自FiveYellowMice's Wiki
跳到导航 跳到搜索
（添加窗口未被聚焦时的按钮图标。）
 
第4行： 第4行：
  
 
# 因为 background 无法在 CSS 中作为渐变的属性，切换窗口聚焦时没有渐变。
 
# 因为 background 无法在 CSS 中作为渐变的属性，切换窗口聚焦时没有渐变。
−
# 因为 Breeze 的按钮图标是用 C++ 直接画的，而 breeze-gtk 提供的 PNG 图片没有包含非聚焦窗口的按钮图标，所以窗口在没有聚焦时按钮还是白色的。
+
 
−
# Firefox 会莫名其妙的让 <code>-moz-appearance: none</code> 的 <code>toolbarbutton</code> 在被点击时往右下角挪动一点，暂时还没有解决方法。
 
 
<syntaxhighlight lang="css">
 
<syntaxhighlight lang="css">
 
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
 
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
第16行： 第15行：
 
#TabsToolbar:-moz-window-inactive {
 
#TabsToolbar:-moz-window-inactive {
 
   background: #eff0f1 !important;
 
   background: #eff0f1 !important;
−
   color: #797f83 !important;
+
   color: #7f8c8d !important;
 +
}
 +
 
 +
#navigator-toolbox[inFullscreen="true"] #TabsToolbar {
 +
  background: #eff0f1 !important;
 +
  color: #424446 !important;
 
}
 
}
  
第31行： 第35行：
 
}
 
}
  
−
#titlebar-min .toolbarbutton-icon {
+
.titlebar-min .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize@2.png") !important;
 
}
 
}
  
−
#titlebar-min:hover .toolbarbutton-icon {
+
.titlebar-min:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-backdrop@2.png") !important;
 +
}
 +
 
 +
.titlebar-min:hover .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-hover@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-hover@2.png") !important;
 
}
 
}
  
−
#titlebar-min:active .toolbarbutton-icon {
+
.titlebar-min:hover:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-hover-backdrop@2.png") !important;
 +
}
 +
 
 +
.titlebar-min:active .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-active@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-active@2.png") !important;
 
}
 
}
  
−
#titlebar-max .toolbarbutton-icon {
+
.titlebar-min:active:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-active-backdrop@2.png") !important;
 +
}
 +
 
 +
.titlebar-max .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize@2.png") !important;
 
}
 
}
  
−
#titlebar-max:hover .toolbarbutton-icon {
+
.titlebar-max:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-backdrop@2.png") !important;
 +
}
 +
 
 +
.titlebar-max:hover .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-hover@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-hover@2.png") !important;
 
}
 
}
  
−
#titlebar-max:active .toolbarbutton-icon {
+
.titlebar-max:hover:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-hover-backdrop@2.png") !important;
 +
}
 +
 
 +
.titlebar-max:active .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-active@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-active@2.png") !important;
 
}
 
}
  
−
window[sizemode="maximized"] #titlebar-max .toolbarbutton-icon {
+
.titlebar-max:active:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-active-backdrop@2.png") !important;
 +
}
 +
 
 +
.titlebar-restore .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized@2.png") !important;
 
}
 
}
  
−
window[sizemode="maximized"] #titlebar-max:hover .toolbarbutton-icon {
+
.titlebar-restore:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-backdrop@2.png") !important;
 +
}
 +
 
 +
.titlebar-restore:hover .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-hover@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-hover@2.png") !important;
 
}
 
}
  
−
window[sizemode="maximized"] #titlebar-max:active .toolbarbutton-icon {
+
.titlebar-restore:hover:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-hover-backdrop@2.png") !important;
 +
}
 +
 
 +
.titlebar-restore:active .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-active@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-active@2.png") !important;
 
}
 
}
  
−
#titlebar-close .toolbarbutton-icon {
+
.titlebar-restore:active:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-active-backdrop@2.png") !important;
 +
}
 +
 
 +
.titlebar-close .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close@2.png") !important;
 
}
 
}
  
−
#titlebar-close:hover .toolbarbutton-icon {
+
.titlebar-close:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-backdrop@2.png") !important;
 +
}
 +
 
 +
.titlebar-close:hover .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-hover@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-hover@2.png") !important;
 
}
 
}
  
−
#titlebar-close:active .toolbarbutton-icon {
+
.titlebar-close:hover:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-hover-backdrop@2.png") !important;
 +
}
 +
 
 +
.titlebar-close:active .toolbarbutton-icon {
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-active@2.png") !important;
 
   background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-active@2.png") !important;
 +
}
 +
 +
.titlebar-close:active:-moz-window-inactive .toolbarbutton-icon {
 +
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-active-backdrop@2.png") !important;
 
}
 
}
 
</syntaxhighlight>
 
</syntaxhighlight>

2020年7月10日 (五) 16:43的最新版本

此 userChrome.css 使 Firefox 在 KDE 上得到类似 Breeze 主题的外观。需要 /usr/share/themes/Breeze-Dark/assets 中包含有 breeze-gtk 提供的 PNG 按钮图标。

未解决的问题：

  1. 因为 background 无法在 CSS 中作为渐变的属性，切换窗口聚焦时没有渐变。
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

#TabsToolbar {
  background: linear-gradient(#556068, #475057) !important;
  color: white !important;
}

#TabsToolbar:-moz-window-inactive {
  background: #eff0f1 !important;
  color: #7f8c8d !important;
}

#navigator-toolbox[inFullscreen="true"] #TabsToolbar {
  background: #eff0f1 !important;
  color: #424446 !important;
}

.titlebar-button {
  -moz-appearance: none !important;
}

.titlebar-button .toolbarbutton-icon {
  height: 18px !important;
  min-height: 18px !important;
  width: 18px !important;
  min-width: 18px !important;
  background-size: contain !important;
}

.titlebar-min .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize@2.png") !important;
}

.titlebar-min:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-backdrop@2.png") !important;
}

.titlebar-min:hover .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-hover@2.png") !important;
}

.titlebar-min:hover:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-hover-backdrop@2.png") !important;
}

.titlebar-min:active .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-active@2.png") !important;
}

.titlebar-min:active:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-minimize-active-backdrop@2.png") !important;
}

.titlebar-max .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize@2.png") !important;
}

.titlebar-max:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-backdrop@2.png") !important;
}

.titlebar-max:hover .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-hover@2.png") !important;
}

.titlebar-max:hover:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-hover-backdrop@2.png") !important;
}

.titlebar-max:active .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-active@2.png") !important;
}

.titlebar-max:active:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-active-backdrop@2.png") !important;
}

.titlebar-restore .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized@2.png") !important;
}

.titlebar-restore:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-backdrop@2.png") !important;
}

.titlebar-restore:hover .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-hover@2.png") !important;
}

.titlebar-restore:hover:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-hover-backdrop@2.png") !important;
}

.titlebar-restore:active .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-active@2.png") !important;
}

.titlebar-restore:active:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-maximize-maximized-active-backdrop@2.png") !important;
}

.titlebar-close .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close@2.png") !important;
}

.titlebar-close:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-backdrop@2.png") !important;
}

.titlebar-close:hover .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-hover@2.png") !important;
}

.titlebar-close:hover:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-hover-backdrop@2.png") !important;
}

.titlebar-close:active .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-active@2.png") !important;
}

.titlebar-close:active:-moz-window-inactive .toolbarbutton-icon {
  background-image: url("/usr/share/themes/Breeze-Dark/assets/titlebutton-close-active-backdrop@2.png") !important;
}
取自“https://wiki.fiveyellowmice.com/index.php?title=userChrome.css&oldid=151”