Firefox 2 におけるテーマの変更点

この記事は Firefox のテーマを Firefox 2 で動作するように更新する必要のある変更箇所を網羅しています。

補足: テーマの更新の仕方については Updating themes for Firefox 2 の記事に書かれています。もし、テーマについて書きたい方があれば、ぜひその経験を記事にしてください!

テーマの更新に必要なブラウザの変更点

テーマの更新に必要な数多くのブラウザ内のファイルが変更、削除されています。以下の一覧表には、更新に必要な XUL ファイルとテーマに関係する CSS ファイルの両方を記載しています。

ファイル名 CSS ファイル 詳細
<tt>browser/base/searchDialog.xul</tt> <tt>browser/base/content/searchDialog.css</tt> Firefox 2 から削除
<tt>feeds/addFeedReader.xul</tt> <tt> feeds/addFeedReader.css </tt> 新しいファイル。フィードリーダを追加するための UI を提供。
<tt>feeds/subscribe.xhtml</tt> <tt>feeds/subscribe.css</tt> 新しいファイル。RSS フィードを購読するための UI を提供。
<tt>preferences/downloads.xul</tt> - Firefox 2 から削除
<tt>preferences/general.xul</tt> - Firefox 2 から削除
<tt>safebrowsing/warning-overlay.xul</tt> <tt>safebrowsing/browser-protection.css</tt> 新しいファイル。疑わしいフィッシングサイトを開いたとき、ブラウザ上に描画されるオーバーレイ。
<tt>search/engineManager.xul</tt> <tt>engineManager.css</tt> 新しいファイル。検索エンジンマネージャの UI。
<tt>toolkit/mozapps/preferences/fontscaling.xul</tt> - Firefox 2 から削除

デフォルトテーマの変更点

以下の一覧表は、Firefox 2 のデフォルトテーマになされたすべての変更箇所です。この情報をあなたのテーマに必要な変更を見つけるための開始点にしてください。

ファイル 変更点
<tt>browser/bookmarks/addBookmark.css</tt> 更新。Microsummary 関連の CSS を変更。
<tt>browser/bookmarks/bookmarksProperties.css</tt> 新しいファイル。Microsummary 関連の CSS。
<tt>browser/browser.css</tt> 更新の必要あり。新しい Microsummary のための CSS、検索フィールド、ブックマークメニュー項目のアイコン、その他を追加。
<tt>browser/dropmark-nav-small.png</tt> 新しいファイル。ナビゲーション(戻る、進む) ボタンのドロップダウンメニューの矢印(小さいアイコン使用時)。
<tt>browser/dropmark-nav.png</tt> 新しいファイル。ナビゲーションボタンのドロップダウンメニューの矢印。
<tt>browser/engineManager.css</tt> 新しいファイル。検索エンジンマネージャに使用される CSS。
<tt>browser/feeds/addFeedReader.css</tt> 新しいファイル。新しいフィードリーダを追加するウィンドウに使用される CSS。
<tt>browser/feeds/feedIcon.png</tt> 新しいファイル。RSS フィードアイコン。
<tt>browser/feeds/feedIcon16.png</tt> 新しいファイル。RSS フィードアイコンの 16×16 ピクセル版
<tt>browser/feeds/subscribe.css</tt> 新しいファイル。ニュースフィードを購読するウィンドウに使用される CSS。
<tt>browser/Go-rtl.png</tt> 新しいファイル。URL フィールドの左側に位置する場合の移動アイコン。
<tt>browser/preferences/preferences.css</tt> オプションウィンドウの CSS ファイル。
<tt>browser/safebrowsing/browser-protection.css</tt> 新しいファイル。ユーザに詐欺サイトであることを示す警告ウィンドウと URL バーのアイコンのための CSS。
<tt>browser/safebrowsing/close16x16.png</tt> 新しいファイル。安全なブラウズの警告ウィンドウに閉じるためのボタンとして表示されるアイコン。
<tt>browser/safebrowsing/dim.png</tt> 新しいファイル。安全なブラウズの警告ウィンドウが表示されるときにウィンドウ内のコンテンツを "薄暗くする" ためのグラフィックオーバーレイ。これにはウィンドウ内のコンテンツを透かして見えるように透過色を使用するべきです。
<tt>browser/safebrowsing/tail.png</tt> 新しいファイル。サイトが詐欺かもしれないことを示すときに使用する、吹き出しスタイルウィンドウの "しっぽ"。
<tt>browser/safebrowsing/warning16x16.png</tt> 新しいファイル。安全なブラウズの警告ウィンドウが表示されるときに、URL バーに表示される警告アイコンの 16×16 ピクセル版。
<tt>browser/safebrowsing/warning24x24.png</tt> 新しいファイル。安全なブラウズの警告ウィンドウ内に表示される警告アイコン。
<tt>browser/search-bar-background-mid.png</tt> 新しいファイル。検索バーの中央部分の背景。バーの終端は分割されています。
<tt>browser/search-bar-background.png</tt> 削除されたファイル。
<tt>browser/Search-bar.png</tt> 削除されたファイル。
<tt>browser/Search-go-rtl.png</tt> 新しいファイル。検索バーの左端に位置するときに表示される移動ボタン。
<tt>browser/Search-go.png</tt> 新しいファイル。検索バーの右端に位置するときに表示される移動ボタン。
<tt>browser/Search-provider-bkgnd-rtl.png</tt> 新しいファイル。検索プロバイダアイコンが検索バーの左端に位置するときに、その陰に描画される背景。
<tt>browser/Search-provider-bkgnd.png</tt> 新しいファイル。検索プロバイダアイコンが検索バーの右端に位置するときに、その陰に描画される背景。
<tt>global/about.css</tt> 新しいファイル。アプリケーションの About ダイアログに使用される CSS。
<tt>global/alltabs-box-bkgnd.png</tt> 新しいファイル。タブバーの右端に位置する "すべてのタブ" ドロップダウンメニューの背景。
<tt>global/alltabs-box-overflow-bkgnd.png</tt> 新しいファイル。タブが多すぎてタブバーをスクロールするときの、"すべてのタブ" ドロップダウンメニューの背景。
<tt>global/browser.css</tt> 改訂。メインブラウザウィンドウの新しいスタイルに対応。
<tt>global/globalBindings.xml</tt> 更新。タブごとの閉じるボタンを含むタブバーの変更に対応。
<tt>global/icons/alltabs.png</tt> 現在は未使用。最近のテーマの草案からは削除。
<tt>global/inactivetab-left.png</tt> 削除されたファイル。
<tt>global/inactivetab-right.png</tt> 削除されたファイル。
<tt>global/menu.css</tt> 更新。新しいスタイルを追加。
<tt>global/notification.css</tt> 新しいファイル。ブラウザウィンドウの上部に表示される通知バーのスタイルを定義。
<tt>global/scrollbox/autorepeat-arrow-dn-dis.gif</tt> 新しいファイル。スクロールボックスの a disabled autorepeat down arrow に表示されるアイコン。
<tt>global/scrollbox/autorepeat-arrow-dn.gif</tt> 新しいファイル。スクロールボックスの an autorepeat down arrow に表示されるアイコン。
<tt>global/scrollbox/autorepeat-arrow-up-dis.gif</tt> 新しいファイル。スクロールボックスの a disabled autorepeat up arrow に表示されるアイコン。
<tt>global/scrollbox/autorepeat-arrow-up.gif</tt> 新しいファイル。スクロールボックスの an autorepeat up arrow に表示されるアイコン。
<tt>global/scrollbox.css</tt> 更新の必要あり。新しいスタイルを追加。
<tt>global/tab-arrow-end-bkgnd.png</tt> 新しいファイル。タブバーの右端に位置する、タブバーをスクロールする矢印の背景。
<tt>global/tab-arrow-end.png</tt> 新しいファイル。タブバーの右端に位置する、タブバーをスクロールボタンの矢印。
<tt>global/tab-arrow-start-bkgnd.png</tt> 新しいファイル。タブバーの左端に位置する、タブバーをスクロールする矢印の背景。
<tt>global/tab-arrow-start.png</tt> 新しいファイル。タブバーの左端に位置する、タブバーをスクロールボタンの矢印。
<tt>global/tab-left.png</tt> 新しいファイル。タブの左端。
<tt>global/tab-middle.png</tt> 新しいファイル。タブの中央部分。
<tt>global/tab-right.png</tt> 新しいファイル。タブの右端。
<tt>global/tabbrowser-tabs-bkgnd.png</tt> 新しいファイル。すべてのタブの陰に表示される、タブバーの背景。
<tt>global/toolbar.css</tt> 更新の必要あり。新しいスタイルを追加。
<tt>mozapps/extensions/about.css</tt> 更新。いくつかの全く同じスタイルがあるため、スタイル名を単一化。
<tt>mozapps/extensions/extensions.css</tt> 更新。アドオンマネージャウィンドウの CSS。Firefox 2 のアドオンマネージャの新しい機能に対応。
<tt>mozapps/extensions/itemDisabledFader.png</tt> 新しいファイル。アドオンマネージャで無効化されたアイテムのオーバーレイとして使用する半透明の PNG。
<tt>mozapps/extensions/itemEnabledFader.png</tt> 新しいファイル。アドオンマネージャで有効なアイテムのオーバーレイとして使用する半透明の PNG。
<tt>mozapps/extensions/notifyBadges.png</tt> 新しいファイル。アドオンマネージャウィンドウ内でアドオンの状態を示すためのアイコン。デフォルトテーマでは次のようになります:

Image:notifyBadges.png

  • はじめのアイコン(緑色) は、アドオンが更新可能であることを示す。
  • 2番目のアイコン(黄色) は、"不許可リストの項目に含まれているため、確認が必要"。
  • 3番目のアイコン(赤色) は、アドオンがユーザによって、またはアプリケーションと互換性が無いために無効化されていることを示す。
  • 4番目のアイコン(青色) は、"(これが何を意味するのか分かりません)"。【訳注: 未使用?】
<tt>mozapps/extensions/question.png</tt> 新しいファイル。アドオンマネージャで更新を確認するときに使用されるアイコン。更新が見つからない場合は、ウィンドウ上部に表れるメッセージ帯の左側に表示されます。
<tt>mozapps/extensions/update.css</tt> Firefox の更新ウィザードの CSS。更新ウィザードのデザインが変更されたため、スタイルは少ない。
<tt>mozapps/extensions/viewButtons.png</tt> 新しいファイル。アドオンマネージャで利用可能なときに表示される各ビューのアイコン。デフォルトテーマでは次のようになります:

Image:viewButtons.png
上段のアイコンは以下のものが利用できないときの淡色表示版です。はじめのアイコンは拡張機能ビュー用。2番目のアイコンはテーマビュー用。3番目はロケール用、4番目はプラグイン用、5番目は更新用。6番目はインストール用です。

<tt>mozapps/pref</tt> このディレクトリ全体は、すでに Firefox 2 で使用されていないため、削除するべきです。

<tt>browser</tt> の変更点

<tt>bookmarks/addBookmark.css</tt>

<tt>addBookmarks.css</tt> ファイルの最初に、必ず次の行を追加してください:

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");

また、Microsummary ピッカーの体裁を提供するため、いくつかの Microsummary 関連の CSS も追加する必要があります。これらは、Microsammary が利用可能でないときに、ピッカーが編集可能なメニューリストではなく、通常のテキストボックスに見えるようするために使用されます。

  • menulist#name[droppable="false"]
  • menulist#name[droppable="false"] > .menulist-editable-box
  • menulist#name[droppable="false"] > .menulist-editable-box > html|*.textbox-input
  • menulist#name[droppable="false"] > .menulist-dropmarker
  • menulist#name[droppable="false"] > menupopup

このファイルは <tt> addBookmark2.xul</tt> をスタイル付けします。

<tt>bookmarks/bookmarksProperties.css</tt>

Firefox 2 で追加された新しいファイルです。<tt>addBookmark.css</tt> に追加したものと同じ内容の CSS コードです。このファイルは <tt>bookmarksProperties.xul</tt> をスタイル付けします。

補足: この CSS は将来的に別々のファイルに移動され、両方から参照されます。

<tt>browser.css</tt>

以下のスタイルは Firefox 1.5 で使用され、Firefox 2 では使用されていないものなので削除してください:

  • #bookmarks-button:active
  • #copy-button:active
  • #cut-button:active
  • #downloads-button:active
  • #forward-button[buttondown="true"]
  • #history-button:active
  • #home-button:active
  • #mail-button
  • #mail-button:active
  • #mail-button[disabled="true"]
  • #mail-button[open="true"]
  • #new-tab-button:active
  • #new-tab-button[checked="true"]
  • #new-window-button:active
  • #new-window-button[checked="true"]
  • #paste-button:active
  • #print-button:active
  • #reload-button:active
  • #stop-button:active
  • .messageButton
  • .messageImage
  • .messageText
  • browsermessage
  • toolbar[iconsize="small"] #bookmarks-button:active
  • toolbar[iconsize="small"] #copy-button:active
  • toolbar[iconsize="small"] #cut-button:active
  • toolbar[iconsize="small"] #downloads-button:active
  • toolbar[iconsize="small"] #history-button:active
  • toolbar[iconsize="small"] #home-button:active
  • toolbar[iconsize="small"] #mail-button
  • toolbar[iconsize="small"] #mail-button:active
  • toolbar[iconsize="small"] #mail-button[disabled="true"]
  • toolbar[iconsize="small"] #mail-button[open="true"]
  • toolbar[iconsize="small"] #new-tab-button:active
  • toolbar[iconsize="small"] #new-window-button:active
  • toolbar[iconsize="small"] #paste-button:active
  • toolbar[iconsize="small"] #print-button:active
  • toolbar[iconsize="small"] #reload-button:active
  • toolbar[iconsize="small"] #stop-button:active
  • toolbar[mode="icons"] .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-1 > .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-1 > stack > toolbarbutton > .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-icon

以下のスタイルは、Firefox 2 とあなたのテーマの互換性を保つために追加する必要のあるものです:

  • #back-button .toolbarbutton-menubutton-dropmarker
  • #back-button:hover
  • #back-button:hover .toolbarbutton-menubutton-dropmarker
  • #back-button:hover:active
  • #back-button:hover:active .toolbarbutton-menubutton-dropmarker
  • #back-button[buttondown="true"] > .toolbarbutton-menubutton-dropmarker
  • #back-button[buttonover="true"]
  • #back-button[buttonover="true"] > .toolbarbutton-menubutton-dropmarker
  • #back-button[disabled="true"] .toolbarbutton-menubutton-dropmarker
  • #back-button[open="true"]
  • #bookmarks-button:hover
  • #bookmarks-button:hover:active
  • #bookmarks-button[checked="true"]
  • #copy-button:hover
  • #copy-button:hover:active
  • #cut-button:hover
  • #cut-button:hover:active
  • #downloads-button:hover
  • #downloads-button:hover:active
  • #feed-button[chromedir="rtl"][feeds]:active
  • #feed-button[chromedir="rtl"][feeds]:hover
  • #feed-button[feeds]:active
  • #feed-button[feeds]:hover
  • #forward-button .toolbarbutton-menubutton-dropmarker
  • #forward-button:hover
  • #forward-button:hover .toolbarbutton-menubutton-dropmarker
  • #forward-button:hover:active
  • #forward-button:hover:active .toolbarbutton-menubutton-dropmarker
  • #forward-button[buttondown="true"] > .toolbarbutton-menubutton-dropmarker
  • #forward-button[buttonover="true"]
  • #forward-button[buttonover="true"] > .toolbarbutton-menubutton-dropmarker
  • #forward-button[disabled="true"] .toolbarbutton-menubutton-dropmarker
  • #go-button:hover
  • #go-button[chromedir="rtl"]
  • #history-button:hover:active
  • #history-button:hover:active
  • #history-button[checked="true"]
  • #home-button:hover
  • #home-button:hover:active
  • #new-tab-button:hover
  • #new-tab-button:hover:active
  • #new-window-button:hover
  • #new-window-button:hover:active
  • #paste-button:hover
  • #paste-button:hover:active
  • #print-button:hover
  • #print-button:hover:active
  • #reload-button:hover
  • #reload-button:hover:active
  • #searchbar[empty="true"] .searchbar-textbox
  • #stop-button:hover
  • #stop-button:hover:active
  • #urlbar-icons-spacer
  • #urlbar-spacer
  • #urlbar[level="high"] #lock-icon:active
  • #urlbar[level="high"] #lock-icon:hover
  • #urlbar[level="low"] #lock-icon:active
  • #urlbar[level="low"] #lock-icon:hover
  • .autocomplete-treebody::-moz-tree-cell(suggesthint)
  • .autocomplete-treebody::-moz-tree-cell-text(suggestfirst, treecolAutoCompleteComment)
  • .autocomplete-treebody::-moz-tree-cell-text(suggesthint, treecolAutoCompleteComment)
  • .bookmark-item[livemark]
  • .openintabs-menuitem
  • .toolbarbutton-icon
  • .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button:hover
  • toolbar[iconsize="small"] #back-button:hover .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button:hover:active
  • toolbar[iconsize="small"] #back-button:hover:active .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button[buttondown="true"] > .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button[buttonover="true"] > .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #back-button[disabled="true"] .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #bookmarks-button:hover
  • toolbar[iconsize="small"] #bookmarks-button:hover:active
  • toolbar[iconsize="small"] #copy-button:hover
  • toolbar[iconsize="small"] #copy-button:hover:active
  • toolbar[iconsize="small"] #cut-button:hover
  • toolbar[iconsize="small"] #cut-button:hover:active
  • toolbar[iconsize="small"] #downloads-button:hover
  • toolbar[iconsize="small"] #downloads-button:hover:active
  • toolbar[iconsize="small"] #forward-button .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #forward-button:hover
  • toolbar[iconsize="small"] #forward-button:hover .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #forward-button:hover:active
  • toolbar[iconsize="small"] #forward-button:hover:active .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #forward-button[buttondown="true"] > .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #forward-button[buttonover="true"] > .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #forward-button[disabled="true"] .toolbarbutton-menubutton-dropmarker
  • toolbar[iconsize="small"] #history-button:hover
  • toolbar[iconsize="small"] #history-button:hover:active
  • toolbar[iconsize="small"] #home-button:hover
  • toolbar[iconsize="small"] #home-button:hover:active
  • toolbar[iconsize="small"] #home-button[disabled="true"]
  • toolbar[iconsize="small"] #new-tab-button:hover
  • toolbar[iconsize="small"] #new-tab-button:hover:active
  • toolbar[iconsize="small"] #new-window-button:hover
  • toolbar[iconsize="small"] #new-window-button:hover:active
  • toolbar[iconsize="small"] #paste-button:hover
  • toolbar[iconsize="small"] #paste-button:hover:active
  • toolbar[iconsize="small"] #print-button:hover
  • toolbar[iconsize="small"] #print-button:hover:active
  • toolbar[iconsize="small"] #reload-button:hover
  • toolbar[iconsize="small"] #reload-button:hover:active
  • toolbar[iconsize="small"] #stop-button:hover
  • toolbar[iconsize="small"] #stop-button:hover:active
  • toolbarbutton.bookmark-item-microsummarized

また、他のスタイルも変更する必要があります。

<tt>searchbar.css</tt>

以下のスタイルは、Firefox 2 では使用されていないので削除してください:

  • .searchbar-dropmarker

以下のスタイルは、Firefox 2 とあなたのテーマの互換性を保つために追加する必要のあるものです:

  • #search-container[chromedir="rtl"] .search-go-button
  • #search-container[chromedir="rtl"] .searchbar-engine-button
  • .search-go-button
  • .search-go-button:hover
  • .search-go-button:hover:active
  • .search-go-button[disabled="true"]
  • .searchbar-engine-button
  • .searchbar-engine-button:hover
  • .searchbar-engine-button[addengines="true"]
  • .searchbar-engine-button[open="true"]
  • .searchbar-engine-menuitem[selected="true"] > .menu-iconic-text
  • .searchbar-left

もちろん、他のスタイルへ変更することもできます。

<tt>preferences/preferences.css</tt>

以下のスタイルは、Firefox 2 では使用されていないので削除してください:

  • #browserStartupHomepage
  • #browserStartupHomepage
  • #paneDownloads description
  • #paneGeneral description
  • radio[pane=paneDownloads]
  • radio[pane=paneDownloads]:active

以下のスタイルは、Firefox 2 とあなたのテーマの互換性を保つために追加する必要のあるものです:

  • #paneContent description
  • #paneMain description
  • #paneSecurity description
  • radio[pane=paneAdvanced]:hover
  • radio[pane=paneAdvanced][selected="true"]
  • radio[pane=paneContent]:hover
  • radio[pane=paneContent][selected="true"]
  • radio[pane=paneFeeds]
  • radio[pane=paneFeeds]:active
  • radio[pane=paneFeeds]:hover
  • radio[pane=paneFeeds][selected="true"]
  • radio[pane=paneGeneral]:hover
  • radio[pane=paneGeneral][selected="true"]
  • radio[pane=paneMain]
  • radio[pane=paneMain]:active
  • radio[pane=paneMain]:hover
  • radio[pane=paneMain][selected="true"]
  • radio[pane=panePrivacy]:hover
  • radio[pane=panePrivacy][selected="true"]
  • radio[pane=paneSecurity]
  • radio[pane=paneSecurity]:active
  • radio[pane=paneSecurity]:hover
  • radio[pane=paneSecurity][selected="true"]
  • radio[pane=paneTabs]:hover
  • radio[pane=paneTabs][selected="true"]

もちろん、他のスタイルへ変更することもできます。

<tt>feeds/addFeedReader.css</tt>

Firefox 2 で追加された新しいファイルです。これは、<tt>browser/feeds/addFeedReader.xul</tt> で定義された、新しいフィードリーダを追加するウィンドウのテーマです。

  • #imageBox
    • フィードアイコンを表示する枠。
  • #content
    • ウィンドウのコンテンツエリアのためのスタイル。
  • #siteLabel
    • サイトラベルのためのスタイル。

<tt>feeds/subscribe.css</tt>

Firefox 2 で追加された新しいファイルです。これは、<tt>browser/feeds/subscribe.xhtml</tt> で使用される、RSS フィードを購読するウィンドウのテーマです。

  • #application
  • #feedBody
  • #feedChangeSubscribeOptions
  • #feedError
  • #feedHeader
  • #feedHeader[firstrun="true"]
  • #feedHeader[firstrun="true"] #feedIntroText
  • #feedHeader[firstrun="true"] #feedSubscribeLine
  • #feedIntroText
  • #feedSubscribeDoneChangingOptions
  • #feedSubscribeHandleText
  • #feedSubscribeHandler
  • #feedSubscribeLine
  • #feedSubscribeOptions
  • #feedSubscribeOptionsGroup
  • #feedSubscribeOptionsGroupTitle
  • #feedTitleContainer
  • #feedTitleImage
  • #feedTitleLink
  • #readerContainer
  • #readerGroup
  • #readers
  • #readers > listitem
  • .feedEntryContent
  • .feedSubscribeButton
  • .feedSubscribeButton .button-icon
  • .feedSubscribeLink
  • .feedSubscribeLinkBox
  • .field
  • .link
  • .link:hover:active
  • .plain
  • .plain > .button-box
  • .plain:focus > .button-box
  • .styleLessBorderLess

デフォルトテーマには、a[href] img および body, h1, h2, html のためのスタイルも含まれます。

<tt>safebrowser/browser-protection.css</tt>

Firefox 2 で追加された新しいファイルです。ブラウザ防御機能のテーマです。以下のスタイルは、ユーザが疑わしいフィッシングサイトを開いたときに表れるウィンドウに対応するために、テーマに含まれている必要があります:

  • #safebrowsing-dim-area-canvas
  • #safebrowsing-page-canvas
  • #safebrowsing-palm-close
  • #safebrowsing-palm-close-container
  • #safebrowsing-palm-google-logo
  • #safebrowsing-palm-message
  • #safebrowsing-palm-message-actionbox
  • #safebrowsing-palm-message-content
  • #safebrowsing-palm-message-tail
  • #safebrowsing-palm-message-tail-container
  • #safebrowsing-palm-message-titlebox
  • .safebrowsing-palm-bigtext
  • .safebrowsing-palm-fixed-width
  • .safebrowsing-palm-paragraph
  • .safebrowsing-palm-smalltext

以下のスタイルは、URL バー内の、サイトが安全かどうか示すアイコンの表示に使用されます:

  • #safebrowsing-urlbar-icon
  • #safebrowsing-urlbar-icon[level="safe"]
  • #safebrowsing-urlbar-icon[level="warn"]

<tt>engineManager.css</tt>

以下のスタイルは、テーマに含まれている必要があります。Firefox 2 で追加された新しいファイルです。

  • #engineList treechildren::-moz-tree-image(engineName)

<tt>global</tt>の変更点

<tt>about.css</tt>

Firefox 2 のための新しいファイルです。これは Firefox の about ダイアログのテーマです。少なくとも以下のスタイルを提供する必要があります:

  • #aboutLogoContainer
  • #aboutPageContainer
  • #version

デフォルトテーマには、body および html, img, ul, ul > li のためのスタイルも含まれます。

<tt>browser.css</tt>

以下のスタイルは Firefox 1.5 で使用され、Firefox 2 では削除されています:

  • tab:focus
  • tab[beforeselected="true"] > .tab-image-right
  • tab[selected="true"] > .tab-image-left
  • tab[selected="true"] > .tab-image-middle
  • tab[selected="true"] > .tab-image-right

以下は、Firefox 2 で追加された新しいスタイルです:

  • .alltabs-item > .menu-iconic-left > .menu-iconic-icon
  • .alltabs-item[busy] > .menu-iconic-left > .menu-iconic-icon
  • .alltabs-item[selected="true"]
  • .tab-close-button
  • .tab-close-button > .toolbarbutton-icon
  • .tab-close-button-placeholder
  • .tab-close-button:hover
  • .tab-close-button:hover:active
  • .tabbrowser-arrowscrollbox > .scrollbutton-down
  • .tabbrowser-arrowscrollbox > .scrollbutton-down:hover
  • .tabbrowser-arrowscrollbox > .scrollbutton-up
  • .tabbrowser-arrowscrollbox > .scrollbutton-up:hover
  • .tabbrowser-tab > .tab-close-button
  • .tabbrowser-tab:not([selected="true"]) > .tab-close-button
  • .tabbrowser-tab:not([selected="true"]):hover > .tab-close-button
  • .tabbrowser-tab[selected="true"] > .tab-close-button
  • .tabbrowser-tab[selected="true"] > .tab-close-button:hover
  • .tabbrowser-tab[selected="true"] > .tab-close-button:hover:active
  • .tabbrowser-tabs[overflow="true"] .tabs-alltabs-box
  • .tabs-alltabs-box
  • .tabs-alltabs-box:hover
  • .tabs-alltabs-box[flash="true"]
  • tab > .tab-image-left
  • tab > .tab-image-middle
  • tab > .tab-image-middle > .tab-text
  • tab > .tab-image-right
  • tab:focus > .tab-image-middle > .tab-text
  • tab:hover:not([selected="true"]) > .tab-image-left
  • tab:hover:not([selected="true"]) > .tab-image-middle
  • tab:hover:not([selected="true"]) > .tab-image-right
  • tab:not([selected="true"]) > .tab-image-left
  • tab:not([selected="true"]) > .tab-image-middle
  • tab[selected="true"] .tab-image-middle > .tab-text

もちろん、他のスタイルへ変更することもできます。

<tt>menu.css</tt>

以下のスタイルは、Firefox 2 では使用されておらず、削除されています:

  • menulist > menupopup > menuitem[_moz-menuactive="true"]

また、Firefox 2 のテーマでは以下のスタイルが追加されています:

  • .menu-iconic-icon
  • menubar > menu
  • menubar > menu[_moz-menuactive="true"][open="true"]
  • menuitem[type="checkbox"] > .menu-iconic-left
  • menuitem[type="radio"] > .menu-iconic-left

他のスタイルの定義へ変更することもできます。

<tt>notification.css</tt>

Firefox 2 で追加された新しいファイルです。これは、ポップアップのブロックやプラグインが必要なことなどをユーザに知らせる、ブラウザ最上部にある通知バーに使用されます。通知バーのメッセージは厳格に、情報、警告、危険の 3 段階があります。以下のスタイルを必ず定義してください:

  • .messageButton
  • .messageCloseButton
  • .messageImage
  • .messageText
  • .notification-inner
  • notification
  • notification[type="info"]
  • notification[type="warning"]
  • notification[type="critical"]

<tt>scrollbox.css</tt>

以下の新しいスタイルは、Firefox 2 でこのファイルに追加されました:

  • .autorepeatbutton-down[disabled="true"]
  • .autorepeatbutton-down[orient="horizontal"]
  • .autorepeatbutton-down[orient="horizontal"][disabled="true"]
  • .autorepeatbutton-up[disabled="true"]
  • .autorepeatbutton-up[orient="horizontal"]
  • .autorepeatbutton-up[orient="horizontal"][disabled="true"]
  • .scrollbutton-down
  • .scrollbutton-down > .toolbarbutton-text
  • .scrollbutton-down[disabled="true"]
  • .scrollbutton-down[orient="horizontal"]
  • .scrollbutton-down[orient="horizontal"][disabled="true"]
  • .scrollbutton-up
  • .scrollbutton-up > .toolbarbutton-text
  • .scrollbutton-up[disabled="true"]
  • .scrollbutton-up[orient="horizontal"]
  • .scrollbutton-up[orient="horizontal"][disabled="true"]
  • toolbar[mode="icons"] .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-1 > .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-1 > stack > toolbarbutton > .toolbarbutton-text
  • toolbar[mode="text"] .toolbarbutton-icon

他のスタイルへ変更することもできます。

<tt>mozapps</tt>の変更点

<tt>extensions/about.css</tt>

以下の Firefox 1.5 からのスタイルは、Firefox 2 では使用されていないので削除してください:

  • #contributorsBox
  • #creatorBox
  • #extensionContributors
  • #extensionContributors
  • #extensionCreatorLabel

以下のスタイルが追加されました:

  • .indent
  • .sectionTitle

他のスタイルへ変更することもできます。

<tt>extensions/update.css</tt>

以下のスタイルは、Firefox 2 では使用されていないので削除してください:

  • #foundList
  • #statusbar-updates
  • .updateCategoryBox
  • .updateCategoryContent
  • .updateCategoryIcon
  • .updateCategoryLabel[selected="true"]
  • .updateIcon
  • .updateIcon[severity="0"]
  • .updateIcon[severity="1"]
  • .updateIcon[severity="2"]
  • .updateIndicator > label
  • .updateIndicator[updateCount="0"]
  • .updateItemChecked
  • .updateItemChecked .checkbox-label-box
  • .updateItemFromLabel
  • .updateItemIcon
  • .updateItemIcon
  • .updateItemName
  • .updateItemNameRow
  • .updateItemURL
  • .warning
  • radio[type="update-type"]
  • radiogroup[type="update-types"]
  • toolbarbutton[type="updates"]
  • toolbarbutton[type="updates"] > .toolbarbutton-icon
  • toolbarbutton[type="updates"][severity="0"] > .toolbarbutton-icon
  • toolbarbutton[type="updates"][severity="1"] > .toolbarbutton-icon
  • toolbarbutton[type="updates"][severity="2"] > .toolbarbutton-icon
  • toolbarbutton[type="updates"][updateCount="0"]
  • updateitem

また、以下のスタイルが追加されました:

  • .alertBox
  • .throbber

ドキュメントのタグと貢献者

タグ: 
 このページの貢献者: Mgjbot, Marsf
 最終更新者: Mgjbot,