Skip to main content

Visit Mozilla.org

Changements dans les thèmes graphiques pour Firefox 2

Un article de MDC.


Cet article couvre les changements à apporter aux thèmes Firefox pour qu'ils fonctionnent correctement dans Firefox 2.

Note : Nous devrions rédiger un article appelé Mise à jour d'un thème pour Firefox 2 qui servirait de guide pour la mise à jour des thèmes. Si quelqu'un ayant l'expérience des thèmes veut rédiger un tel article, qu'il ne se gêne pas.

Sommaire

[modifier] Changements dans le navigateur nécessitant une mise à jour des thèmes

De nombreux changements, ajouts et suppressions de fichiers du navigateur peuvent nécessiter une mise à jour de vos thèmes. Ce tableau liste les fichiers XUL modifiés ainsi que les fichiers CSS correspondants dans votre thème que vous pourriez avoir à modifier.

Fichier Fichier CSS Détails
browser/base/searchDialog.xul browser/base/content/searchDialog.css Removed from Firefox 2.
feeds/addFeedReader.xul feeds/addFeedReader.css Nouveau fichier définissant la fenêtre d'ajout d'un nouveau lecteur de flux.
feeds/subscribe.xhtml feeds/subscribe.css Nouveau fichier définissant la fenêtre d'abonnement à un nouveau flux RSS.
preferences/downloads.xul - Supprimé de Firefox 2.
preferences/general.xul - Supprimé de Firefox 2.
safebrowsing/warning-overlay.xul safebrowsing/browser-protection.css Nouveau fichier définissant le calque qui s'affiche dans le navigateur lorsque vous vous rendez sur un site suspecté d'être une contrefaçon.
search/engineManager.xul engineManager.css Nouveau fichier définissant la fenêtre de gestion des moteurs de recherche.
toolkit/mozapps/preferences/fontscaling.xul - Removed from Firefox 2.

[modifier] Changements du thème par défaut

Le tableau ci-dessous liste les changement intervenus dans Firefox 2 pour le thème par défaut. Vous pouvez utilisez ces informations comme point de départ pour déterminer les changements à appliquer à votre thème.

Fichier Description des changements
browser/bookmarks/addBookmark.css Mise à jour incorporant des changements CSS liés aux microrésumés.
browser/bookmarks/bookmarksProperties.css Nouveau fichier : CSS liée aux microrésumés.
browser/browser.css Doit être mis à jour pour inclure les nouvelles règles CSS liées aux microrésumés, aux champs de recherche, aux entrées de menu icônifiées, etc.
browser/dropmark-nav-small.png Nouveau fichier : utilisé comme flèche pour le menu déroulant de la barre de navigation lorsque de petites icônes sont utilisées.
browser/dropmark-nav.png Nouveau fichier : utilisé comme flèche pour le menu déroulant de la barre de navigation.
browser/engineManager.css Nouveau fichier : CSS utilisée par le gestionnaire de moteurs de recherche.
browser/feeds/addFeedReader.css Nouveau fichier : CSS utilisée par la fenêtre d'ajout d'un nouveau lecteur de flux RSS.
browser/feeds/feedIcon.png Nouveau fichier : icône de flux RSS.
browser/feeds/feedIcon16.png Nouveau fichier : icône de flux RSS en 16x16 pixels.
browser/feeds/subscribe.css Nouveau fichier : CSS utilisée par la fenêtre d'abonnement à un nouveau flux.
browser/Go-rtl.png Nouveau fichier : icône Go à utiliser si elle est positionnée à l'extrême gauche de la barre d'adresse.
browser/preferences/preferences.css Fichier CSS de la fenêtre des préférences.
browser/safebrowsing/browser-protection.css Nouveau fichier : CSS de la fenêtre avertissant un utilisateur que le site affiché peut être frauduleux, ainsi que l'icone placée dans la barre d'adresse indiquant ce risque.
browser/safebrowsing/close16x16.png Nouveau fichier : icône utilisée pour le bouton de fermeture de la fenêtre d'avertissement de navigation sécurisée.
browser/safebrowsing/dim.png Nouveau fichier : image servant de calque flou superposé au contenu d'une page lorsque la fenêtre d'avertissement de navigation sécurisé est affichée. Elle devrait être translucide pour permettre au contenu de la fenêtre d'être visible.
browser/safebrowsing/tail.png Nouveau fichier : pointe de la fenêtre "infobulle" indiquant qu'un site peut être frauduleux.
browser/safebrowsing/warning16x16.png Nouveau fichier : Version 16x16 pixels de l'icône d'avertissement affichée dans la barre d'adresse lorsqu'une fenêtre d'avertissement de navigation sécurisée apparaît.
browser/safebrowsing/warning24x24.png Nouveau fichier : icône d'avertissement affichée dans la fenêtre d'avertissement de navigation sécurisée.
browser/search-bar-background-mid.png Nouveau fichier : arrière-plan du milieu de la barre de recherche. Les extrémités sont désormais stylées séparément.
browser/search-bar-background.png Fichier supprimé.
browser/Search-bar.png Fichier supprimé.
browser/Search-go-rtl.png Nouveau fichier : le bouton de recherche lorsqu'il est affiché à la gauche de la barre de recherche.
browser/Search-go.png Nouveau fichier : le bouton de recherche lorsqu'il est affiché à la droite de la barre de recherche.
browser/Search-provider-bkgnd-rtl.png Nouveau fichier : le fond dessiné derrière l'icône du fournisseur de recherche lorsqu'elle est située à gauche de la barre de recherche.
browser/Search-provider-bkgnd.png Nouveau fichier : le fond dessiné derrière l'icône du fournisseur de recherche lorsqu'elle est située à droite de la barre de recherche.
global/about.css Nouveau fichier : CSS utilisée dans la fenêtre À propos de l'application.
global/alltabs-box-bkgnd.png Nouveau fichier : arrière-plan du menu déroulant listant tous les onglets ouverts à la droite de la barre des onglets.
global/alltabs-box-overflow-bkgnd.png Nouveau fichier : arrière-plan du menu déroulant listant tous les onglets ouverts lorsqu'assez d'onglets sont ouverts pour activer la défilement de la barre des onglets.
global/browser.css Mis à jour pour prendre en compte les nouveaux styles de la fenêtre de navigation principale.
global/globalBindings.xml Mis à jour pour prendre en compte les changements de la barre des onglets, en particulier les boutons de fermeture sur chaque onglet.
global/icons/alltabs.png Non utilisé : reliquat d'une ancienne implémentation du thème.
global/inactivetab-left.png Fichier supprimé.
global/inactivetab-right.png Fichier supprimé.
global/menu.css Mis à jour pour intégrer les nouveaux styles.
global/notification.css Nouveau fichier : définit les styles du bandeau de notification qui apparaît en haut de la fenêtre de navigation pour afficher des avertissements tels que le blocage de popups.
global/scrollbox/autorepeat-arrow-dn-dis.gif Nouveau fichier : icône de la flêche descendante des ascenseurs lorsque le défilement est désactivé.
global/scrollbox/autorepeat-arrow-dn.gif Nouveau fichier : icône de la flêche descendante des ascenseurs.
global/scrollbox/autorepeat-arrow-up-dis.gif Nouveau fichier : icône de la flêche montante des ascenseurs lorsque le défilement est désactivé.
global/scrollbox/autorepeat-arrow-up.gif Nouveau fichier : icône de la flêche montante des ascenseurs.
global/scrollbox.css Doit être mis à jour pour intégrer les nouveaux styles.
global/tab-arrow-end-bkgnd.png Nouveau fichier : arrière-plan de la flêche de défilement à la droite de la barre des onglets.
global/tab-arrow-end.png Nouveau fichier : flêche de défilement à la droite de la barre des onglets.
global/tab-arrow-start-bkgnd.png Nouveau fichier : arrière-plan de la flêche de défilement à la gauche de la barre des onglets.
global/tab-arrow-start.png Nouveau fichier : flêche de défilement à la gauche de la barre des onglets.
global/tab-left.png Nouveau fichier : bord gauche d'un onglet.
global/tab-middle.png Nouveau fichier : milieu d'un onglet.
global/tab-right.png Nouveau fichier : bord droit d'un onglet.
global/tabbrowser-tabs-bkgnd.png Nouveau fichier : arrière-plan de la barre des onglets, derrière ceux-ci.
global/toolbar.css Doit être mis à jour pour intégrer les nouveaux styles.
mozapps/extensions/about.css Mis à jour avec des noms de styles simplifiés pour éliminer les doublons.
mozapps/extensions/extensions.css CSS de la fenêtre du gestionnaire de modules. Mise à jour pour prendre en compte les nouvelles fonctionnalités du gestionnaire de modules de Firefox 2.
mozapps/extensions/itemDisabledFader.png Nouveau fichier : PNG translucide utilisé en surimpression sur les éléments désactivés dans le gestionnaire de modules.
mozapps/extensions/itemEnabledFader.png Nouveau fichier : PNG translucide utilisé en surimpression sur les éléments actifs dans le gestionnaire de modules.
mozapps/extensions/notifyBadges.png Nouveau fichier : contient les icônes utilisées en supplément des icônes de modules pour indiquer leur état dans la fenêtre du gestionnaire de modules. Elles se présentes comme suit dans le thème par défaut :

Image:notifyBadges.png

  • La première icône (verte ici) indique qu'une mise à jour est disponible pour un module complémentaire.
  • La seconde icône (jaune ici) semble être utilisée pour les éléments bloqués ; confirmation nécessaire.
  • La troisième icône (rouge ici) indique qu'un module complémentaire est désactivé, soit pas l'utilisateur ou parce qu'il est incompatible avec l'application.
  • La quatrième icône (bleue ici) (sa signification est inconnue).
mozapps/extensions/question.png Nouveau fichier : utilisé dans le gestionnaire de modules lors de la vérification des mises à jours. Si aucune mise à jour n'est disponible, cette icône apparaît à la gauche du bandeau qui s'affiche en haut de la fenêtre.
mozapps/extensions/update.css Ce fichier définit les styles de l'assistant de mise à jour de Firefox 2.
mozapps/extensions/viewButtons.png Nouveau fichier : contient les icônes de chacunes des vues qui peuvent être disponibles dans le gestionnaire de modules. Elles se présentent comme suit dans le thème par défaut :

Image:viewButtons.png
La première ligne contient des versions aux couleurs atténuées des icones de la seconde ligne :

  1. panneau des extensions
  2. panneau des thèmes
  3. panneau des langues
  4. panneau des plugins
  5. panneau des mises à jour
  6. panneau des modules en cours d'intallation.
mozapps/pref L'intégralité de ce répertoire est obsolète dans Firefox 2 et devrait être supprimé.

[modifier] Changements dans browser

[modifier] bookmarks/addBookmark.css

Le fichier addBookmarks.css doit comporter ces nouvelles lignes au tout début : 

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

Certaines feuilles de styles CSS relatives aux microrésumés doivent être ajoutées pour définir le formatage du lecteur de microrésumés. Elles sont utilisées pour afficher le lecteur comme une simple boîte texte plutôt qu'une liste de menu personnalisable lorsque qu'aucun microrésumé n'est disponible.

  • 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

Ce fichier définit les styles de addBookmark2.xul.

[modifier] bookmarks/bookmarksProperties.css

Ce fichier est nouveau dans Firefox 2, et devrait contenir les mêmes règles CSS que celles ajoutées à addBookmark.css. Ce fichier définit les styles de bookmarksProperties.xul.

Note : À l'avenir, ces règles CSS devraient être déplacées vers un fichier CSS séparé, référencé dans les deux fichiers XUL.

[modifier] browser.css

Les styles suivants ne sont plus utilisés dans Firefox 2 et peuvent être supprimés de votre thème :

  • #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

Les styles suivants doivent être ajoutés à votre thème pour le rendre compatible avec 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

Vous pourriez également devoir apporter des modifications à d'autres styles.

[modifier] searchbar.css

Le style suivant n'est plus utilisé dans Firefox 2 et peut être supprimé de votre thème :

  • .searchbar-dropmarker

Les styles suivants doivent être ajoutés à votre thème pour le rendre compatible avec 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

Vous pouvez également appliquer des modifications à d'autres styles.

[modifier] preferences/preferences.css

Les styles suivants ne sont plus utilisés dans Firefox 2 et peuvent être supprimés de votre thème :

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

Les styles suivants doivent être ajoutés à votre thème pour le rendre compatible avec 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"]

Vous pouvez également appliquer des modifications à d'autres styles.

[modifier] feeds/addFeedReader.css

Ce fichier est nouveau dans Firefox 2. Il définit les styles de la fenêtre d'abonnement à un flux RSS, elle même définie dans le fichier browser/feeds/addFeedReader.xul.

  • #imageBox
    • La boîte affichant l'icône des flux.
  • #content
    • Styles pour la boîte de saisie de la fenêtre.
  • #siteLabel
    • Styles pour l'étiquette du site.

[modifier] feeds/subscribe.css

Ce fichier est nouveau dans Firefox 2. Il définit les styles de la fenêtre d'abonnement à un flux RSS, qui se trouve à l'adresse 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

Le thème par défaut inclut également des styles pour a[href] img, body, h1, h2, et html.

[modifier] safebrowser/browser-protection.css

Ce nouveau fichier de Firefox 2 définit le style des éléments de protection du navigateur. Les styles suivants doivent être implémentés pour supporter la fenêtre d'avertissement qui s'affiche lorsque l'utilisateur visualise un site suspecté de contrefaçon :

  • #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

Les styles suivants sont utilisés pour afficher une indication dans la barre d'adresse sur le danger que représente le site :

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

[modifier] engineManager.css

Le style suivant doit être implémenté. Ce fichier est nouveau dans Firefox 2.

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

[modifier] Changements dans global

[modifier] about.css

C'est un nouveau fichier de thème pour Firefox 2. Il définit les styles de la boîte "À propos" de Firefox. Il doit au moins contenir les styles suivants :

  • #aboutLogoContainer
  • #aboutPageContainer
  • #version

Le thème par défaut définit également les styles suivants : body, html, img, ul, et ul > li.

[modifier] browser.css

Les styles suivants n'existent plus dans Firefox 2 et peuvent être supprimés :

  • 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

Les styles suivants sont nouveaux dans 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

Vous pouvez également appliquer des modifications à d'autres styles.

[modifier] menu.css

Le style suivant n'est plus utilisé dans Firefox 2 et a été supprimé :

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

Le thème de Firefox 2 possède également les nouveaux styles suivants :

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

Vous pouvez également appliquer des modifications à d'autres styles.

[modifier] notification.css

Ce fichier est nouveau dans Firefox 2. Il est utilisé par la barre de notification en haut du navigateur qui affiche des avertissements destinés à l'utilisateur, tels que le blocage d'un popup ou l'absence d'un plugin nécessaire à l'affichage de la page. Il y a trois niveaux d'alerte : information, avertissement et critique. Vous devriez définir les styles suivants :

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

[modifier] scrollbox.css

Les nouveaux styles suivants ont été ajoutés dans ce fichier pour les thèmes 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"]

Vous pouvez également appliquer des modifications à d'autres styles.

  • 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

Vous pouvez également appliquer des modifications à d'autres styles.

[modifier] Changements dans mozapps

[modifier] extensions/about.css

Les styles suivants ne sont plus utilisés dans Firefox 2 et peuvent être supprimés :

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

Les styles suivants ont été ajoutés :

  • .indent
  • .sectionTitle

Vous pouvez également appliquer des modifications à d'autres styles.

[modifier] extensions/update.css

Les styles suivants ne sont plus utilisés dans Firefox 2 et peuvent être supprimés de votre thème :

  • #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

Les styles suivants ont été ajoutés :

  • .alertBox
  • .throbber
Récupérée de « http://developer.mozilla.org/fr/docs/Changements_dans_les_th%C3%A8mes_graphiques_pour_Firefox_2 »