Changing Firefox windows back to classic mode

From MozillaZine Knowledge Base
Jump to navigationJump to search
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.

Firefox 1.5.x for Windows user interface imitates the default Windows XP Luna theme since September 7th, 2005, unlike the 1.0.x releases. This means the menus look more like other applications on the default Windows XP theme, but they look out of place on other Windows XP themes, and on Windows 2000, 98, ME. This page explains how you can change your menus back to how they looked on 1.0.x releases.

By installing an extension

Install the Classic Menus extension from

Manually

Since all the changes were made in the theme via CSS, they can (almost, see about:config below) all be overridden easily.

Simply copy and paste the following in your userChrome.css file in your profile folder:

/* Classic Menus */
.menu-accel,
.menu-iconic-accel,
.menu-text,
.menu-iconic-text {
 margin-top: 0px !important;
}

.menu-iconic-left {
 margin-top: 1px !important;
 margin-bottom: 1px !important;
 min-width: 12px;
 -moz-margin-start: 2px;
 -moz-margin-end: 2px;
}

menubar > menu {
 border: 1px solid transparent !important;
 padding-top: 0px !important;
 padding-bottom: 1px !important;
 margin-bottom: 1px !important;
 -moz-padding-start: 2px;
 -moz-padding-end: 3px;
}

menubar > menu[_moz-menuactive="true"] {
 background-color: transparent !important;
 color: MenuText !important;
 border-top: 1px solid ThreeDHighlight !important;
 border-right: 1px solid ThreeDShadow !important;
 border-bottom: 1px solid ThreeDShadow !important;
 border-left: 1px solid ThreeDHighlight !important;
}

menubar > menu[_moz-menuactive="true"][open="true"] {
 background-color: transparent !important;
 color: MenuText !important;
 border-top: 1px solid ThreeDShadow !important;
 border-right: 1px solid ThreeDHighlight !important;
 border-bottom: 1px solid ThreeDHighlight !important;
 border-left: 1px solid ThreeDShadow !important;
 padding-top: 1px !important;
 -moz-padding-end: 2px !important;
 padding-bottom: 0px !important;
 -moz-padding-start: 3px !important;
}

/* Classic Popups */
menupopup,
popup {
 border: 2px solid !important;
 -moz-border-top-colors: ThreeDLightShadow ThreeDHighlight !important;
 -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow !important;
 -moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow !important;
 -moz-border-left-colors: ThreeDLightShadow ThreeDHighlight !important;
 padding: 1px !important;
 min-width: 1px !important;
 background-color: Menu;
}

popup[type="autocomplete"],
.autocomplete-history-popup {
 border-width: 1px !important;
 -moz-border-top-colors: ThreeDDarkShadow !important;
 -moz-border-right-colors: ThreeDDarkShadow !important;
 -moz-border-bottom-colors: ThreeDDarkShadow !important;
 -moz-border-left-colors: ThreeDDarkShadow !important;
 padding: 0px !important;
 background-color: -moz-Field !important;
}

menulist > menupopup,
.menulist-menupopup {
 border-width: 1px !important;
 -moz-border-top-colors: -moz-FieldText !important;
 -moz-border-right-colors: -moz-FieldText !important;
 -moz-border-bottom-colors: -moz-FieldText !important;
 -moz-border-left-colors: -moz-FieldText !important;
 padding: 0px;
 min-width: 0px;
 background-color: -moz-Field;
}

about:config

The above will work for everything except the context menus in about:config - The about:config page source has its own menu code built in, and so is in the Content (document) scope instead of the Chrome (browser UI) scope. Duplicating the necessary css code in userContent.css will apply the style there as well.

Simply copy and paste the following in your userContent.css file in your profile folder:

/*Windows Classic look (about:config context menus)*/
@-moz-document url-prefix(about:config)
{
   popup,menupopup
   {
       border: 2px solid !important;
       -moz-border-top-colors: ThreeDLightShadow ThreeDHighlight !important;
       -moz-border-right-colors: ThreeDDarkShadow ThreeDShadow !important;
       -moz-border-bottom-colors: ThreeDDarkShadow ThreeDShadow !important;
       -moz-border-left-colors: ThreeDLightShadow ThreeDHighlight !important;
       padding: 1px !important;
       min-width: 1px !important;
       background-color: Menu;
   }
}

External links