/* User Chrome stylesheet (chrome/userChrome.css) C:\Documents and Settings\Administrator\Application Data\Mozilla\Firefox\Profiles\default.fxy\chrome\userChrome.css http://www.mozilla.org/support/firefox/tips.html#beh_icons about userChrome.css This file sets the display rules for various elements in the Firefox user interface and is located in the sub-folder called chrome in your profile folder. As with user.js, this file does not exist by default, so you need to create it before you can start adding your preferences. There's actually an example file that exists by default, called userChrome-example.css. Basically, you can just rename that file by removing the -example part. The last rule is the one that is used unless the other has !Important; however, syntax errors may wipe out some following rules. margin|padding: {all | top/bottom | top/left/bottom | top/right/bottom/left} For more information and testing of your userChrome and and some of your userContent changes, particularly referring to Tabs, see *************************************************** http://www.mvps.org/dmcritchie/firefox/tabs.htm *************************************************** To redo these from scratch, this one seems good along with the comments, of course needs more reductions http://userstyles.org/styles/1326 I am in the process of sorting out this code so that its parts can be used independently you can check out my userstyles at http://userstyles.org/users/12592 === */ /* the @namespace doesn't seem to matter for Windows but included */ @namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* Use color to identify profile or system *** #toolbar-menubar {background-color: #F3E078 !important; } */ /* ===================================================== */ /* background-image: none !important; -- produces the Flat Tabs */ /* CHOICE -- curved Tabs (uses default image, narrow range viewing) **** .tabbrowser-tabs, .tab-image-left, .tab-image-middle, .tab-image-right { -moz-opacity: 0.95 !important; /* .9 hint, .8 too faded */ /* background-color: transparent !important;} ****/ /* CHOICE -- Flat Tabs (no image obscuring of text) */ .tabbrowser-tabs, .tab-image-left, .tab-image-middle, .tab-image-right { -moz-appearance: none !important; height: 14px !important; border-collapse: collapse !important; background-image: none !important; background-color: transparent !important;} /* Change color of active tab */ tab[selected="true"] { -moz-appearance: none !important; background-color: #FFFFFF !important; border-left: solid 1px #FF0000 !important; border-bottom: solid 2px #FF0000 !important; font-size: 80% !important; color: #000000 !important; } /* Change color of normal tabs */ tab:not([selected="true"]) { background-color: #EBEBEB!important; border-left: solid 1px #0066CC !important; border-right: solid 1px !important; border-bottom: 2px solid #0066CC !important; font-size: 80% !important; color: black !important; } /* Change color for text and underline of unread tabs */ /* Italicize the title of unread tabs in http://kb.mozillazine.org/Change_the_style_of_tab_markers */ #content tab:not([selected]) { color: #005500 !important; border-bottom: 2px solid #00BB00 !important;} /* pack all tabs as densely as we can; * also define various tab decorations * http://users.skynet.be/antoine.mechelynck/other/userChrome.css * as referenced 2006-12-17 by Tony Mechelynck */ .tabbrowser-tabs *|tab { margin: 0px !important ; border-width: 1px !important ; border-style: solid !important ; -moz-border-radius: 2px 2px 0px 0px !important ; border-collapse: collapse !important ; padding: 0px !important ; text-align: left !important } /* Change width of tabs* -- also requires browser.tabs.tabMinWidth set to 0 in about:config */ .tabbrowser-tabs *|tab { height: 14px !important; min-width: 8px !important } /* Fix the background behind the tab close button when using the Aging Tabs extension. * (Adjust the height according to your needs.) */ .tab-close-button, .tab-close-button-placeholder {height: 14px !important; padding:0px !important; margin:0px !important;} .tabs-closebutton { height:14px !important; } .tabs-closebutton {padding:0px 0px 0px 0px !important; margin:0px 0px 0px 0px !important; } /* end of @-moz-document stuff */ /* ============================================ */ /* change fontsize on text with icons, navigation, personal bookmarks, does not affect the menu bar */ .toolbarbutton-text {-moz-appearance: none !important; font-size: 8px !important;} /* failure to use 18 results in overlap wording url/bookmarks */ #nav-bar { -moz-appearance: none !important; max-height: 18px !important; min-height: 18px !important; margin-top: 0px !important; margin-bottom: 0px !important; padding-top: 0px !important; padding-bottom: 0px !important; border: none !important; padding: 0px !important; } #navigator-toolbox { margin: 0px 0px 0px 0px !important; padding: 0px 0px 0px 0px !important; } #navigator-toolbox { border-bottom-width: 0px !important;} #NavigatorToolbar { margin: 0px 0px 0px 0px !important; padding: 0px 0px 0px 0px !important; } #urlbar {min-height: 20px !important; max-height:18px!important;margin:0px !important} #bookmarks-menu autorepeatbutton, #personal-bookmarks autorepeatbutton {display: none;} /* Scrollbar Bookmarks Menu, http://userstyles.org/style/show/56 */ #bookmarks-menu menupopup, #personal-bookmarks menupopup { max-height: 700px; /* or any height you specify */} #bookmarks-menu scrollbox, #personal-bookmarks scrollbox {overflow-y: auto;} /*** Modify Bookmarks bar to reduce height to all that is needed D.McR*/ #PersonalToolbar {-moz-appearance:none !important; background-image: none !important; min-height: 12px !important; max-height: 12px !important; margin-top: 0px !important; margin-bottom: 2px !important; padding-top: 0px !important; padding-bottom: 0px !important; border: none !important; } /*was testing with border: dotted red !important; */ /* Change 'bookmarks text color' on mouseover" http://userstyles.org/styles/2136 not affecting bookmarks bar*/ toolbarbutton.bookmark-item:hover { background-image: none !important; background-color: cyan !important; } /*You can customize all the text style *** toolbarbutton.bookmark-item{ font-size:9pt !important; font-family:tahoma !important; font-weight:bold !important;} *** */ /* widen all bookmarks dropdown menus -- Chris Ilias 2007-01-12*/ menu.bookmark-item, menuitem.bookmark-item { max-width: 36em !important; } /* Make bookmark folders items bold (900) and navy blue (#0000EE)*/ /* use 400 #0000E8 on main, 400 #800000 on firefox portable */ .bookmark-item[type="menu"] > .toolbarbutton-text { -moz-appearance: none !important; background-image: none !important; font-weight: 500; color:#0000E8; font-size: 8px !important } /* make bookmark file items on toolbar red */ /*.bookmark-item, */ .toolbarbutton-text { -moz-appearance: none !important; background-image: none !important; font-weight: 100; color: red; padding-bottom: 14px !important; font-size: 8px !important } /* remove folder/file icons from bookmarks toolbar http://www.gfxoasis.com/board/lofiversion/index.php?t11762.html */ .bookmark-item > .toolbarbutton-icon { display: none; } /* if button/icon wanted see another part of that link */ /* ------------------------------------------------------------- */ /* Make the Search box flex wider and shorter http://www.mozilla.org/support/firefox/tips.html#beh_icons (in this case 400 pixels wide) userChrome.css #search-container, #searchbar {min-height:8px!important; max-height:8px!important; -moz-box-flex: 200 !important; } */ /* Increase the default Location Bar and Search Bar height by 2 pixels. */ #search-container, #searchbar, .searchbar-textbox {padding: 0px !important; height: 10px !important; } #go-button /* FIND bar is too high but must have min/max same or lose words behind */ #find-field-container {min-height:18px !important; max-height:18px !important; font-weight: 100; color: Blue !important; padding-bottom: 0px !important; font-size: 12px !important } /* ----- */ /* Fix the background behind the tab close button when using the Aging Tabs extension. * (Adjust the height according to your needs.) */ .tab-close-button, .tab-close-button-placeholder {height: 14px !important; padding:0px; margin:0px;} /* Change highlighted menu text to any color * of your liking - just change the hex values shown here. */ menu {color: #000000 !important; Background-color:#D3DaED !important;} menubar > menu[disabled="true"] {color:red !important; border: 1px solid red !important;} /* Attempt to change margins etc of menu bar only did 1 of 2 windows */ menubar > menu { padding: 0px 1px 0px 1px !important; margin: 0px 1px 0px 0px !important;} /* removed border */ menubar > menu > label, menubar > menu > .menubar-text { padding: 0px !important; margin: 0px !important; } /* check out classic appearance: http://www.mozilla.org/support/firefox/tips#app_classicmenus*/ /* http://userstyles.org/styles/2544 2007-11-27 */ /* drop-down menu items, not folders */ menuitem, menubar > menu, #menuToolbox { -moz-appearance: none !important; color: #000000 !important; background-color: #D3DAED !important;} /* drop-down menu items (hover), not folders */ menuitem:hover, menubar > menu:hover { -moz-appearance: none !important; color: #FFFFFF!important; background-color:#000088; } /* http://userstyles.org/styles/927 2007-11-27 */ /*menus background/fonts -- non folders*/ menupopup,menulist,menuitem,menu{font-size:3mm!important;background-color:#F0F0F0!important} menu:hover,menuitem:hover{background:darkblue!important;color:#FFF!important} /**********************************/ menupopup > menu[_moz-menuactive="true"], menupopup > menuitem[_moz-menuactive="true"], popup > menu[_moz-menuactive="true"], popup > menuitem[_moz-menuactive="true"] { background-color: #000088 !important; color: #FFFFFF !important; background-image: none !important;} /* 2007-11-27*/ /* Use this method for site-specific settings. */ /* Set font size for Google site. ---- @-moz-document url-prefix(http://www.google.com/) { #gbar, #guser, body, td, .p { font-size: 9pt !important; }} -- */ /* Major changes may be of interest to id a profile */ #status-bar {color: #F000F0 !important; font-size:12px !important;} /* Use a Background Image for the Toolbars url("background.gif") -- titlebar, menubar, toolbox, toolbar, .tabbrowser-tabs { background-image: none !important; background-color: none !important; } */ /* http://groups.google.com/groups?threadm=L4SdnYX8DsigdGzZnZ2dnUVZ_tGdnZ2d%40mozilla.org*/ /* Allow sidebar to be closed completely using the slider */ #sidebar-box { overflow-x: hidden !important;} #sidebar { min-width: 0px !important; max-width: none !important; overflow-x: hidden !important; } /*And to be able to open the sidebar all the way to the right */ /* Allow sidebar to be opened completely using the slider */ #appcontent {overflow-x: hidden !important; } /* Cute Menus */ menuitem[disabled=true] > hbox > image { visibility: hidden !important; } /* http://amitp.blogspot.com/2005/01/firefox-customization-whos-using.html */ a[rel="nofollow"]:before { content: "nofollow"; color: #393; font-size: 8pt} /* remove the History or Go Menu items from Menu Bar http://groups.google.com/groups?threadm=Xns9874E09A76Bl@216.196.97.169 */ menu[label="Go"], menu[label="History"] {display: none;} /* remove GO button in Firefox 2 from location bar (id) */ #go-button-stack {display: none} /* remove GO button in Firefox 2 from search bar (class) */ search-go-button-stack {display : none !important;} /* official way to remove go button in new theme via about:config http://forums.mozillazine.org/viewtopic.php?t=463668 about:config -> browser.urlbar.hideGoButton [default false] can be set to true to immediately hide the Go button. */ /* This will remove the "Go" button with the search bar */ .search-go-button-stack { display: none !important; } .search-go-button { display: none !important } /* ------------------------------------------------- */ /* Hide the list all tabs dropdown button // not interested// .tabs-alltabs-stack {display: none !important;} */ /* Multi-row bookmarks toolbar -- no longer interested --- #bookmarks-ptf {display:block !important;} #bookmarks-ptf toolbarseparator-primary {display:inline !important;} -- */ /* http://www.supernova00.biz/userchrome.html */ /* Add a keyword when adding a bookmark still needed in 2.0.0.1 */ /* also see http://www.chuonthis.com/extensions/openbook.php not compatible*/ #keywordRow { display: -moz-grid-line !important; } /* don't know how to add description back in but OpenBook extension can do */ /* can't simply use #descriptionRow ... */ /*Pimp the Add Bookmark Dialog in Firefox http://www.ghacks.net/2007/10/28/pimp-the-add-bookmark-dialog-in-firefox/ expands to display most of your folder structure w/o button (You do not lose the "Create in:" box for most recently used folders, but I don't like the forced expansion so am not using this) *** #addBookmarkDialog #expander {display: none !important;} #folder-tree { visibility: visible !important; max-height: 30em !important;} button[label="New Folder..."][hidden="false"] {display: -moz-box !important; } *** */ /* -- additional resources -- http://www.twistermc.com/blog/2006/03/02/ipox-hacks-bookmarks-bar -- http://gethome.no/larse/userChrome.css -- http://userstyles.org/style/list -- All styles (2008) -- Turn OFF page style while loading -- http://www.supernova00.biz/userchrome.html -- http://www.tom-cat.com/mozilla/firefox/userchrome.html -- http://lesliefranke.com/files/firefoxyourway/ -- =================================================================== */ /* Menubar Auto Hidden -- http://userstyles.org/style/show/1562 -- deactivated to test Firefox Grippes http://tokyoenvious.xrea.jp/archives/exts/toolbar-grippies.en.html #toolbar-menubar{display: none;} #navigator-toolbox:hover > #toolbar-menubar{display: -moz-box;} */ /* Hide items that interfer with tweaks ----- remove--- #treecolAutoCompleteComment,#go-button-stack,.search-go-button-stack,.searchbar-engine-image,#sidebar-splitter,sidebarheader,#bookmarksPanel>hbox,#history-panel>hbox>label,#history-panel .button-text,#aios-toolbar{display:none!important} #navigator-throbber .button-box{padding:0px!important} */ /*** Height of tabs is set here! 17 ***/ .scrollbutton-down-stack,.scrollbutton-up{min-height:17px!important; max-height:17px!important;margin-top:0px!important;margin-bottom:0px!important; -moz-border-radius: 1px !Important; padding-top:0px!important; } .tabs-alltabs-stack{margin-top:-2px!important;margin-bottom:-3px!important;} .tabbrowser-tab .tab-icon{margin-top:0px!important;margin-left:-5px!important;margin-right:1px!important} .tab-image-middle{padding:0px!important} .tab-text{border:none!important;font-weight:normal!important} .tab-close-button{margin-right:-3px!important;} .tabs-bottom{border-top:none!important;min-height:0px!important;max-height:0px!important} /* ** Height of statusbar is set here! -- http://gethome.no/larse/userChrome.css ***/ #status-bar,statusbarpanel{-moz-appearance:none!important;border:0px!important; min-height:18px!important;max-height:18px!important} progressmeter{margin-bottom:-1px!important;min-height:10px!important;max-height:10px!important} /* Scrollbar Context Menu, http://userstyles.org/style/show/54 */ /* autorepeatbuton is the top and bottom scrolling chevrons on the area itself */ #contentAreaContextMenu, #contentAreaContextMenu menupopup { max-height: 650px; /* or any height you specify */ } #contentAreaContextMenu autorepeatbutton {display: none;} #contentAreaContextMenu scrollbox {overflow-y: auto;} /* Scrollbar Menu, http://userstyles.org/style/show/52*/ menupopup { max-height: 650px; /* or any height you want */} menupopup autorepeatbutton { display: none;} menupopup scrollbox { overflow-y: auto;} /* Alternate stripping in bookmarks manager *** #bookmark-window treechildren::-moz-tree-row(odd) { background: #eeeeee; } *** */ /* Remove separators between toolbars http://www.supernova00.biz/userchrome.html -- no significan difference *** #toolbar-menubar { max-height: 5px !important; margin-top: 0px !important; margin-bottom: 0px !important; padding-top: 0px !important; padding-bottom: 0px !important; padding-right: 2px !important; padding: 0px !important; margin: 0px !important; border: none !important; } /* from lars ...*/ #urlbar-container,#urlbar,#search-container,#searchbar,.searchbar-textbox{margin:0px!important} #urlbar{border-width:1px 0px 0px!important} /*FF3*/#urlbar,.searchbar-textbox{-moz-appearance:none!important} /* Remove extra padding from the Navigation Bar /no differences noted/ */ .toolbarbutton-1, .toolbarbutton-menubutton-button { padding: 0px 0px !important; margin: 0px !important; } .toolbarbutton-1[checked="true"], .toolbarbutton-1[open="true"], .toolbarbutton-menubutton-button[checked="true"], .toolbarbutton-menubutton-button[open="true"] { padding: 1px 1px 1px 1px !important; } /* Remove focus rings (dotted rectangle) around active tabs *** tab:focus > .tab-middle { -moz-outline: none !important } *** */ /* *** #FindToolbar .autocomplete-history-dropmarker { display: -moz-box !important; -moz-binding: url("chrome://global/content/bindings/autocomplete.xml#history-dropmarker") !important; } *** */ /* Coloured Scrollbars - Weishun - http://userstyles.org/styles/2165 Take the yellow from above the rest from first message in (only applies to menus) http://userstyles.org/forum/comments.php?DiscussionID=327 *** */ /* FF3 URL-dropdown, Lars-Erik Østerud, 2007-12-21, revert awsomebar to Ff2, browser.chrome.toolbar_tips True (default) or won't see tooltips, http://google.com/groups?threadm=b6qdnYdC8JgZiPHanZ2dnUVZ_u-unZ2d@mozilla.org */ .autocomplete-richlistitem spacer,.autocomplete-richlistitem label{display:none!important} .ac-title{margin:-4px 8px 2px -4px!important} .ac-url{margin:-6px 0px 0px 20px!important} /* *** all removed for now ----- .autocomplete-richlistitem spacer,.autocomplete-richlistitem label{display:none!important} .ac-title{margin:-4px 0px 0px 300px!important;background:solid!important} .ac-title description{font-size:11px!important;color:ThreeDShadow!important} .ac-title description[selected="true"]{color:white!important} .ac-url{margin:-19px 0px 0px 20px!important} .ac-url description{color:black!important} .ac-url description[selected="true"]{color:white!important} ** */ /* Tabs -- http://gethome.no/larse/firefox.html*/ .tabs-stack{margin-top:-1px!important} .tabs-stack .toolbarbutton-icon{margin-top:4px!important} .scrollbutton-down-stack,.scrollbutton-up,.tabs-alltabs-box,.tabs-alltabs-button,/*FF3*/.scrollbutton-down{max-height:18px!important;margin:0px 0px 1px!important;border-top:0px!important} .scrollbutton-down-stack,.scrollbutton-up,.tabs-alltabs-box,.tabs-alltabs-button,.tabbrowser-tab,/*FF3--.scrollbutton-down{-moz-border-left-colors:ThreeDShadow transparent!important;-moz-border-right-colors:ThreeDShadow transparent!important;-moz-border-top-colors:ThreeDShadow transparent!important;-moz-border-radius:4px 4px 0px 0px!important}*/ .tabbrowser-tab{margin:-1px 0px 0px!important;padding-top:0px!important;border-top:1px solid!important} .tab-icon-image{margin:1px 4px 0px 2px!important} /*FF2*/.tabbrowser-tab .tab-icon{margin-left:-7px!important} /*FF2*/.tab-image-middle{padding-top:0px!important} .tab-text{border:none!important;font-weight:normal!important} .tab-close-button{margin-right:1px!important} /*FF2*/.tab-image-right{margin-left:-6px!important} .tabs-bottom{border-top:none!important;max-height:0px!important} /*FF3--.tabs-container{margin-top:1px!important;max-height:18px!important}*/ /*FF3--.tabs-container>stack{margin-top:-1px!important}*/ .searchbar-engine-button{padding:2px!important;max-width:16px!important;/*FF3--/min-height:19px!important;outline:none!important*/} /* end-of-page -- see http://www.mvps.org/dmcritchie/firefox/tabs.htm#userchrome*/