Zmiany w motywie graficznym w Firefoksie 2
z Mozilla Developer Center, polskiego centrum programistów Mozilli.
Artykuł ten prezentuje zmiany jakie trzeba wprowadzić, aby zaktualizowany motyw działał prawidłowo w Firefoksie 2.
Uwaga: Moglibyśmy użyć artykułu o nazwie Uaktualnianie motywów dla Firefoksa 2, który byłby przewodnikiem o modernizowaniu motywów. Jeśli ktoś z doświadczeniem w tworzeniu motywów chciałby taki artykuł napisać, prosimy aby to zrobił!
Spis treści |
[edytuj] Zmiany przeglądarki wymagające aktualizacji motywu
Poniżej znajduje się liczba zmian i plików usuniętych w przeglądarce, które wymagają zmian w Twoim motywie. Poniższa tabela stanowi listę zmienionych plików XUL i odpowiedniego dla motywu pliku CSS, które najprawdopodobniej będziesz musiał zaktualizować.
| Nazwa pliku | Plik CSS | Szczegóły |
| browser/base/searchDialog.xul | browser/base/content/searchDialog.css | Usunięty z Firefoksa 2. |
| feeds/addFeedReader.xul | feeds/addFeedReader.css | Nowy plik, który prezentuje UI dla dodanego nowego czytnika kanałów. |
| feeds/subscribe.xhtml | feeds/subscribe.css | Nowy plik, który prezentuje UI dla subskrypcji kanałów RSS. |
| preferences/downloads.xul | - | Usunięty z Firefoksa 2. |
| preferences/general.xul | - | Usunięty z Firefoksa 2. |
| safebrowsing/warning-overlay.xul | safebrowsing/browser-protection.css | Nowy plik zawierający nakładkę, która zostaje nałożona na przeglądarkę, gdy próbujesz odwiedzić stronę podejrzaną o phishing. |
| search/engineManager.xul | engineManager.css | Nowy plik zawierający UI dla silnika okna menedżera wyszukiwania. |
| toolkit/mozapps/preferences/fontscaling.xul | - | Usunięty z Firefoksa 2. |
[edytuj] Zmiany w domyślnym motywie
Poniższa tabela zawiera listę zmian dokonanych w domyślnym motywie w Firefoksie 2. Możesz użyć tych informacji jako punktu początkowego w poszukiwaniu zmian, jakie musisz wprowadzić.
| Plik | Opis zmian |
| browser/bookmarks/addBookmark.css | Zaktualizowany, aby uwzględnić zmiany w CSS związane z mikropodsumowaniami. |
| browser/bookmarks/bookmarksProperties.css | Nowy plik; zawiera CSS związany z mikropodsumowaniami. |
| browser/browser.css | Wymaga aktualizacji, aby uwzględnić nowy CSS dla mikropodsumowań, pól wyszukiwania, obrazkowych elementów menu zakładek i innych. |
| browser/dropmark-nav-small.png | Nowy plik; jest on stosowany jako strzałka do menu rozwijalnych na przyciskach nawigacyjnych, w przypadku stosowania małych ikon. |
| browser/dropmark-nav.png | Nowy plik; stosowany jako strzałka do menu rozwijalnych na przyciskach nawigacyjnych. |
| browser/engineManager.css | Nowy plik; CSS zastosowany dla Menedżera wyszukiwarek. |
| browser/feeds/addFeedReader.css | Nowy plik; CSS zastosowany dla okna dodającego nowy czytnik kanałów. |
| browser/feeds/feedIcon.png | Nowy plik; ikona kanału RSS. |
| browser/feeds/feedIcon16.png | Nowy plik; wersja 16x16 pikseli ikony kanału RSS. |
| browser/feeds/subscribe.css | Nowy plik; CSS stosowany dla okna subskrypcji kanału wiadomości. |
| browser/Go-rtl.png | Nowy plik; Ikona Idź używana wtedy, gdy jest ona pozycjonowana względem lewego końca pola adresu. |
| browser/preferences/preferences.css | Plik stosowany do wyświetlania okna preferencji. |
| browser/safebrowsing/browser-protection.css | Nowy plik; CSS dla okna pojawiającego się, aby ostrzec użytkownika przed stroną, która może być niebezpieczna, jak również ikona na pasku URL oznaczająca oznacza stronę, która może być szkodliwa. |
| browser/safebrowsing/close16x16.png | Nowy plik; jest to ikona wyświetlona jako przycisk zamykający w oknie ostrzegającym przed szkodliwą stroną. |
| browser/safebrowsing/dim.png | Nowy plik; jest to obrazek nakładany na zawartość okna, aby je przyciemnić, kiedy okno ostrzegające przed niebezpieczną stroną zostaje wyświetlone. Obrazek powinien używać przezroczystości, aby umożliwić zobaczenie przez niego zawartości strony. |
| browser/safebrowsing/tail.png | Nowy plik; jest to "ogonek" okna w stylu chmurki stosowanego do oznaczenia strony, która może być szkodliwa. |
| browser/safebrowsing/warning16x16.png | Nowy plik; jest to wersja 16x16 pikseli ikonki wyświetlanej na pasku URL, gdy wyświetlane jest okno bezpiecznego przeglądania. |
| browser/safebrowsing/warning24x24.png | Nowy plik; jest to ikona ostrzegająca, wyświetlana wewnątrz okna bezpiecznego przeglądania. |
| browser/search-bar-background-mid.png | Nowy plik; tło środkowej części paska wyszukiwania. Końce paska są teraz zawarte w oddzielnych plikach. |
| browser/search-bar-background.png | Plik usunięty. |
| browser/Search-bar.png | Plik usunięty. |
| browser/Search-go-rtl.png | Nowy plik; przycisk przejdź wyświetlany wtedy, gdy znajduje się on na lewym końcu paska wyszukiwania. |
| browser/Search-go.png | Nowy plik; przycisk przejdź wyświetlany wtedy, gdy znajduje się on na prawym końcu paska wyszukiwania. |
| browser/Search-provider-bkgnd-rtl.png | Nowy plik; tło rysowane pod ikoną dostawcy wyszukiwania, gdy jest ona wyświetlana po lewej stronie paska wyszukiwania. |
| browser/Search-provider-bkgnd.png | Nowy plik; tło rysowane pod ikoną dostawcy wyszukiwania, gdy jest ona wyświetlana po prawej stronie paska wyszukiwania. |
| global/about.css | Nowy plik; CSS stosowany w oknie o programie. |
| global/alltabs-box-bkgnd.png | Nowy plik; tło dla rozwijalnego menu z wszystkimi kartami po prawej stronie paska z kartami. |
| global/alltabs-box-overflow-bkgnd.png | Nowy plik; tło rozwijalnego menu z wszystkimi kartami, kiedy otwartych jest wystarczająco kart, aby aktywować przewijanie paska kart. |
| global/browser.css | Zmieniony, by obsługiwać nowe style głównego okna przeglądarki. |
| global/globalBindings.xml | Zaktualizowany, by obsługiwać zmiany w pasku kart, w tym przyciski zamykające na każdej karcie. |
| global/icons/alltabs.png | Nie jest używany; pozostałość po starszych szkicach motywu. |
| global/inactivetab-left.png | Plik usunięty. |
| global/inactivetab-right.png | Plik usunięty. |
| global/menu.css | Zaktualizowany, by zawierać nowe style. |
| global/notification.css | Nowy plik; definiuje style stosowane przez pasek powiadomienia pojawiający się na górze okna przeglądarki, aby przekazać użytkownikowi informacje typu "wyskakujące okienko zostało zamknięte". |
| global/scrollbox/autorepeat-arrow-dn-dis.gif | Nowy plik; ikona wyświetlona dla wyłączonej strzałki w dół autopowtarzania w pudełku przewijania. |
| global/scrollbox/autorepeat-arrow-dn.gif | Nowy plik; ikona wyświetlona dla strzałki w dół autopowtarzania w pudełku przewijania. |
| global/scrollbox/autorepeat-arrow-up-dis.gif | New file; ikona wyświetlona dla wyłączonej strzałki w górę autopowtarzania w pudełku przewijania. |
| global/scrollbox/autorepeat-arrow-up.gif | Nowy plik; ikona wyświetlona dla strzałki w górę autopowtarzania w pudełku przewijania. |
| global/scrollbox.css | Musi zostać zaktualizowany, by zawierać nowe style. |
| global/tab-arrow-end-bkgnd.png | Nowy plik; tło dla strzałki przewijania paska kart po prawej stronie paska kart. |
| global/tab-arrow-end.png | Nowy plik; strzałka rysowana w pasku kart przewijania na końcu po prawej stronie paska kart. |
| global/tab-arrow-start-bkgnd.png | Nowy plik; tło dla strzałki przewijania paska kart po lewej stronie paska kart. |
| global/tab-arrow-start.png | Nowy plik; strzałka rysowana w pasku kart przewijania na końcu po lewej stronie w pasku kart. |
| global/tab-left.png | Nowy plik; lewy brzeg karty. |
| global/tab-middle.png | Nowy plik; środek karty. |
| global/tab-right.png | Nowy plik; prawy brzeg karty. |
| global/tabbrowser-tabs-bkgnd.png | Nowy plik; tło dla paska kart, wyświetlone za wszystkimi kartami. |
| global/toolbar.css | Musi zostać zaktualizowany, aby zawierać nowe style. |
| mozapps/extensions/about.css | Zaktualizowany poprzez uproszczenie zbioru nazw stylów, gdyż niektóre style są identyczne. |
| mozapps/extensions/extensions.css | CSS dla okna menedżera dodatków. Zaktualizowany, aby obsługiwać nowe możliwości menadżera dodatków Firefoksa 2. |
| mozapps/extensions/itemDisabledFader.png | Nowy plik; półprzezroczysty PNG zastosowany jako nakładka na górne pozycje, które są wyłączone w menedżerze dodatków. |
| mozapps/extensions/itemEnabledFader.png | Nowy plik; półprzezroczysty PNG zastosowany jako nakładka na górne pozycje, które są włączone w menedżerze dodatków. |
| mozapps/extensions/notifyBadges.png | Nowy plik; zawiera ikony użyte do oznaczenia ikon dodatków w oknie menedżera rozszerzeń w celu wskazania ich statusu. Tak wyglądają w domyślnym motywie:
|
| mozapps/extensions/question.png | Nowy plik; zastosowany w Menedżerze dodatków, podczas sprawdzania aktualizacji. Jeśli nie zostaną znalezione żadne aktualizacje, ikona zostanie wyświetlona z lewej strony paska wiadomości, która pojawia się w poprzek górnej części okna. |
| mozapps/extensions/update.css | Ten plik, który określa skórkę menedżera aktualizacji, posiada mniej stylów w związku z przeprojektowaniem menedżera aktualizacji. |
| mozapps/extensions/viewButtons.png | Nowy plik; zawiera ikony dla każdego z widoków dostępnych w menedżerze dodatków. W domyślnym motywie wygląda on podobnie do poniższego:
|
| mozapps/pref | Katalog nie istnieje w Firefoksie 2 i należy go usunąć. |
[edytuj] Zmiany w browser
[edytuj] bookmarks/addBookmark.css
Plik addBookmarks.css powinien posiadać dodane na początku następujące linie kodu:
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");
@namespace html url("http://www.w3.org/1999/xhtml");
Dodane musi zostać również trochę kodu CSS związanego z mikropodsumowaniami, aby dostarczyć formatowanie do zbieracza mikropodsumowań. Style te są używane, aby zbieracz przypominał bardziej zwykłe pole tekstowe zamiast edytowalnego menu, gdy nie ma dostępnych mikropodsumowań.
-
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
Ten plik nadaje styl plikowi addBookmark2.xul.
[edytuj] bookmarks/bookmarksProperties.css
To jest nowy plik w Firefoksie 2 i powinien zawierać ten sam kod, jaki dodaliśmy do addBookmark.css. Ten plik nadaje style w pliku bookmarksProperties.xul.
Uwaga: Ten arkusz CSS może zostać przeniesiony do osobnego pliku, który będzie się odnosił do obu plików w przyszłości.
[edytuj] browser.css
Następujące style stosowane w motywach Firefoksa 1.5, nie będą dłużej stosowane w Firefoksie 2 i powinny zostać usunięte z Twojego motywu:
-
#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
Następujące style trzeba dodać do Twojego motywu, aby był on kompatybilny z Firefoksem 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
Możesz potrzebować wprowadzić zmiany także w innych stylach.
[edytuj] searchbar.css
Następujące style nie będą dłużej stosowane w Firefoksie 2 i powinny zostać usunięte z Twojego motywu:
-
.searchbar-dropmarker
Następujące style należy dodać do Twojego motywu, aby był on kompatybilny z Firefoksem 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
Możesz oczywiście wprowadzić też zmiany w innych stylach.
[edytuj] preferences/preferences.css
Następujące style nie będą dłużej stosowane w Firefoksie 2 i powinny zostać usunięte:
-
#browserStartupHomepage -
#browserStartupHomepage -
#paneDownloads description -
#paneGeneral description -
radio[pane=paneDownloads] -
radio[pane=paneDownloads]:active
Następujące style należy dodać do Twojego motywu, aby był on kompatybilny z Firefoksem 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"]
Możesz oczywiście wprowadzić też zmiany w innych stylach.
[edytuj] feeds/addFeedReader.css
To jest nowy plik w Firefoksie 2. Określa on wygląd okna stosowanego do dodania nowej przeglądarki RSS, jest ono definiowane w pliku browser/feeds/addFeedReader.xul.
-
#imageBox- Pudełko, które wyświetli ikonę kanału.
-
#content- Informacja o stylu obszaru zawartości okna.
-
#siteLabel- Informacja o stylu etykiety strony.
[edytuj] feeds/subscribe.css
Ten plik jest nowy w Firefoksie 2. Określa on wygląd okna służącego do subskrypcji wątka RSS, które znajduje się w browser/feeds/subscribe.xhtml.
-
#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
Domyślny motyw zawiera także style dla a[href] img, body, h1, h2 i html.
[edytuj] safebrowser/browser-protection.css
Ten plik, nowy w Firefoksie 2, opisuje wygląd mechanizmów ochrony przeglądania (safebrowsing). Poniższe style muszą zostać zaimplementowane, aby obsługiwać okno pojawiające się, gdy użytkownik przegląda stronę podejrzewaną o phishing:
-
#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
Następujące style są używane do wyświetlenia na pasku adresu URL wskaźnika czy strona jest bezpieczna, czy nie:
-
#safebrowsing-urlbar-icon -
#safebrowsing-urlbar-icon[level="safe"] -
#safebrowsing-urlbar-icon[level="warn"]
[edytuj] engineManager.css
Następujące style muszą zostać zaimplementowane. Ten plik jest nowy w Firefoksie 2.
-
#engineList treechildren::-moz-tree-image(engineName)
[edytuj] Zmiany w global
[edytuj] about.css
To jest nowy plik w Firefoksie 2. Definiuje on wygląd okna "O programie Firefox" i musi on zawierać co najmniej poniższe style:
-
#aboutLogoContainer -
#aboutPageContainer -
#version
Domyślny styl zawiera również następujące style: body, html, img, ul i ul > li.
[edytuj] browser.css
Następujące style z Firefoksa 1.5, nie będą dłużej stosowane w Firefoksie 2 i powinny zostać usunięte:
-
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
Następujące style są nowe w Firefoksie 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
Możesz oczywiście wprowadzić też zmiany w innych stylach.
[edytuj] menu.css
Następujące style nie będą dłużej stosowane w Firefoksie 2 i zostały usunięte.
-
menulist > menupopup > menuitem[_moz-menuactive="true"]
Motyw Firefoksa 2 dodaje następujące nowe style:
-
.menu-iconic-icon -
menubar > menu -
menubar > menu[_moz-menuactive="true"][open="true"] -
menuitem[type="checkbox"] > .menu-iconic-left -
menuitem[type="radio"] > .menu-iconic-left
Możesz oczywiście wprowadzić też zmiany w innych stylach.
[edytuj] notification.css
To jest nowy plik w Firefoksie 2. Jest on stosowany w pasku powiadomień na górze przeglądarki, który wyświetla wiadomości typu "wyskakujące okienko zostało zablokowane", "potrzebna jest wtyczka" itd. Istnieją trzy poziomy ważności wiadomości - info (informacja), warning (ostrzeżenie) i critical (krytyczny). Powinieneś zdefiniować następujące style:
-
.messageButton -
.messageCloseButton -
.messageImage -
.messageText -
.notification-inner -
notification -
notification[type="info"] -
notification[type="warning"] -
notification[type="critical"]
[edytuj] scrollbox.css
Następujące nowe style zostały dodane do tego pliku w motywie Firefoksa 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
Możesz oczywiście wprowadzić też zmiany w innych stylach.
[edytuj] Zmiany w mozapps
[edytuj] extensions/about.css
Następujące style z Firefoksa 1.5, nie będą dłużej stosowane w Firefoksie 2 i powinny zostać usunięte:
-
#contributorsBox -
#creatorBox -
#extensionContributors -
#extensionContributors -
#extensionCreatorLabel
Następujące style zostały dodane:
-
.indent -
.sectionTitle
Możesz oczywiście wprowadzić też zmiany w innych stylach.
[edytuj] extensions/update.css
Następujące style nie będą dłużej stosowane w Firefoksie 2 i powinny zostać usunięte z Twojego motywu:
-
#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
Następujące style zostały także dodane:
-
.alertBox -
.throbber