草案
本页尚未完工.
本文包含了更新FireFox主题以使其可以在Firefox 3下良好表现所需进行的一些改动。
Note: We could use an article called Updating themes for Firefox 3 that would serve as a how-to guide for updating themes. If anyone with theming experience would like to write one, please do!
默认主题的改动
下表列出了Firefox 3默认主题的一些改动。你可以对照此表,确认你所需要做出的改动。
所有文件
所有平台
文件 | 变更 |
<tt>browser/themes/*/browser/browser.css</tt> | The width of the drag and drop indicator is no longer calculated during the drag (tabbrowser.xml). Instead a '-moz-margin-start' property must be added to .tab-drop-indicator-bar, with a value that is half of the width of the indicator image. Also, the visibility of the indicator is now controlled by setting collapsed in tabbrowser.xml. As a result, the 'display' property should be removed from .tab-drop-indicator-bar (including for dragging="true"). |
Mac OS X
文件 | 变动信息 |
<tt>browser/themes/pinstripe/browser/tabbrowser/tabDragIndicator.png</tt> | 删除了图片边缘多余的空白,现在图片尺寸变小。也许会对其他使用此图片的Mac平台下的主题产生影响。 |
<tt>browser/themes/pinstripe/browser/browser.css</tt> | .tabbrowser-tab[first-tab="true"] > .tab-image-left不再具有margin-left属性,现在使用定义了相同宽度的.tabs-left元素来替代。在FireFox 2的默认皮肤Winstripe中已经作此处理。 |
<tt>browser</tt>的改动
<tt>global</tt>的改动
所有平台
“跳转到”按钮现在被放置在地址栏内部,所以此按钮所用的图片(<tt>chrome://browser/skin/Go-arrow.png</tt>)需要设计的小一些。控制“跳转到”及其他地址栏中所用到的按钮的显示及隐藏的CSS规则为:
#urlbar[pageproxystate="invalid"] > #urlbar-icons > :not(#go-button) , #urlbar[pageproxystate="valid"] > #urlbar-icons > #go-button { visibility: collapse; }
增加的图片
增加了以下图片:
- <tt>chrome://global/skin/icons/information-16.png</tt>
- Used when presenting information notices。
- <tt>chrome://global/skin/icons/warning-16.png</tt>
- 用作显示警告窗口。
移除的图片
以下图片被移除:
- <tt>chrome://mozapps/skin/extensions/question.png</tt>
- 不再使用。
Mac OS X
为Mac OS X平台上的Firefox 3制作的皮肤需要在<tt>chrome://global/skin/wizard.css</tt>末尾增加两条CSS规则:
.wizard-buttons-btm { padding:Xpx; } .wizard-label-box { display: none; }
此处的数字 X ,即<tt>.wizard-buttons-btm</tt>中的padding值,需要和<tt>.wizard-buttons-box-2</tt>中的margin值相同。
图片变动
chrome://global/skin/icons/loading_16.gif 被chrome://global/skin/icons/loading_16.png 替代。