firebug.css

/* See license.txt for terms of usage */

#fbFirebugMenu > .toolbarbutton-text,
#fbFirebugMenu > .toolbarbutton-menu-dropmarker {
    display: none;
}

/************************************************************************************************/

#fbCommandToolbar {
    border-top: 1px solid #BBB9BA;
    border-bottom: 1px solid #BBB9BA;
    background: #F6F6F6 linear-gradient(to top, #FFFFFF, #E9E9E9 55%, #F2F2F2 55%, #FAFAFA) repeat-x;
}

#fbCommandArrow,
#fbCommandLine,
#fbCommandEditor,
#fbCommandLineCompletion,
#fbCommandLineMeasurer,
.fbCommandLineCompletions {
    font-family: Monaco, monospace;
}

/* Add some more padding to the completion popup */
.userTypedText {
    margin-left: 1px;
}

#fbCommandEditor {
    -moz-appearance: none;
    border: none;
    border-top: 1px solid;
    -moz-border-top-colors: #BBB9BA;
    padding: 2px;
}

#fbContentSplitter {
    border-color: #BBB9BA;
    background: #f3f3f3 !important;
}

#fbPanelSplitter {
    background: #f3f3f3 !important;
    border-left: 1px solid #BBB9BA;
    border-right: 1px solid #BBB9BA;
    min-width: 8px;
    max-width: 8px;
}

#fbPanelSplitter[orient="vertical"] {
    border: none;
    border-top: 1px solid #BBB9BA;
    min-height: 8px;
    max-height: 8px;
    min-width: 0;
    max-width: none;
}

#fbToolbar {
    padding-left: 4px;
    background: #F6F6F6 linear-gradient(to top, #FFFFFF, #E9E9E9 55%, #F2F2F2 55%, #FAFAFA) repeat-x;
    border-bottom: none;
}

.innerToolbar {
    margin-right: 5px;   /* add some space between last button and first tab */
}

#fbWindowButtons.innerToolbar {
    padding: 7px 0 7px 0;   /* Set proper height of window buttons (close, min, detach) */
}

.fbsearch-textbox {
    border-radius: 10px !important;
    box-shadow: 0 2px 2px -2px #000000 inset;
}

#fbSearchOptionsPanel {
    -moz-appearance: none;
    -moz-window-shadow: none;
    background-color: transparent;
    margin-bottom: 2px;
    margin-right: -12px;
    -moz-border-image: url(chrome://firebug/skin/mac/searchPanel.svg) 16 50 24 12 stretch;
    -moz-border-image-slice: 16 50 24 12 fill;
    border-width: 16px 50px 24px 12px;
    border-style: solid;
    color: #ffffff;
}

#fbSearchOptionsPanel[position="after_end"] {
    -moz-border-image: url(chrome://firebug/skin/mac/searchPanelDown.svg) 25 50 18 12 stretch;
    -moz-border-image-slice: 25 50 18 12 fill;
    border-width: 25px 50px 18px 12px;
}

#fbSearchOptionsPanel > vbox {
    margin-right: -38px;
    background: #424242;
}

#fbSearchOptionsPanel > description {
    background: #424242;
    margin: 0;
}



.fbsearch-options-label {
    color: #ffffff;
}

.fbsearch-options-buttons {
    -moz-appearance: none;
    background: #464646 linear-gradient(
        to top,
        rgba(255, 255, 255, 0.3),
        rgba(255, 255, 255, 0) 55%,
        rgba(255, 255, 255, 0.1) 55%,
        rgba(255, 255, 255, 0.2)) repeat-x center center;
    border: 3px solid;
    -moz-border-top-colors: rgba(0,0,0,0.35) rgba(26,26,26,0.5) rgba(255,255,255,0.4);
    -moz-border-right-colors: rgba(53,53,53,1) rgba(53,53,53,1) rgba(162,162,162,1);
    -moz-border-bottom-colors: rgba(128,128,128,0.35) rgba(0,0,0,0.5) rgba(255,255,255,0.15);
    -moz-border-left-colors: rgba(0,0,0,0.35) rgba(26,26,26,0.5) rgba(255,255,255,0.4);
    border-radius: 20px;
    padding: 1px 9px;
    margin: 10px 0 0;
    min-height: 0px;
    color:  #ffffff;
}

.fbsearch-options-buttons > .button-box > .button-text {
    margin: 0 !important;
}

.fbsearch-options-buttons:hover {
    background-color: #666666 !important;
}

.fbsearch-options-buttons:active {
    background-color: #86888B !important;
}

/* Don't display label and remove padding for all the following toolbar buttons */
#fbFirebugMenu,
#fbInspectButton,
#fbNavigateBackButton,
#fbNavigateForwardButton,
#fbCommandPopupButton {
    margin: 0 1px 0 1px;
    padding: 0 1px 0 1px;
}

#fbFirebugMenu > .toolbarbutton-text,
#fbInspectButton > .toolbarbutton-text,
#fbNavigateBackButton > .toolbarbutton-text,
#fbNavigateForwardButton > .toolbarbutton-text,
#fbCommandPopupButton > .toolbarbutton-text {
    display: none;
}

.toolbarbutton-iconic {
    margin: 0 1px 0 1px !important;
    padding: 0 !important;
    /*border: none !important;*/
    /*background: transparent !important;*/
}

.toolbarbutton-iconic > .toolbarbutton-icon {
    padding: 0;
}

.toolbarbutton-iconic > .toolbarbutton-text {
    display: none;
}

#fbMinimizeButton,
#fbToggleCommandEditor {
    list-style-image: url(chrome://firebug/skin/mac/minimize.svg);
}

#fbDetachButton,
#fbToggleCommandLine {
    list-style-image: url(chrome://firebug/skin/mac/detach.svg);
}

#fbToggleCommandLine,
#fbToggleCommandEditor {
    margin-right: 20px !important;
}

#fbCloseButton {
    list-style-image: url(chrome://firebug/skin/mac/close.svg);
}

#fbCommandLineHistoryButton {
    list-style-image: url(chrome://firebug/skin/mac/commandHistory.svg);
}

#fbToggleCommandEditor {
    list-style-image: url(chrome://firebug/skin/mac/minimize.svg);
}

#fbMinimizeButton:hover,
#fbDetachButton:hover,
#fbCloseButton:hover,
#fbToggleCommandLine:hover,
#fbToggleCommandEditor:hover,
#fbCommandLineHistoryButton:hover {
    filter: url(chrome://firebug/skin/filters.svg#darken);
}

#fbMinimizeButton:hover:active,
#fbDetachButton:hover:active,
#fbCloseButton:hover:active,
#fbToggleCommandLine:hover:active,
#fbToggleCommandEditor:hover:active,
#fbCommandLineHistoryButton:active,
#fbCommandLineHistoryButton[checked="true"] {
    filter: url(chrome://firebug/skin/filters.svg#deepDarken);
}

#fbCommandLineHistoryButton[disabled] {
    filter: url(chrome://firebug/skin/filters.svg#brighten);
}

/********************************************************************************************/
/* Quick Info Box */

#fbQuickInfoPanel {
    font-family: Monaco, monospace;
}

/************************************************************************************************/
/* Command History panel */

#fbCommandHistory {
    font-family: Monaco, monospace;
}

/********************************************************************************************/

.panelTabBox {
    background: #e0e0e0 linear-gradient(to top, #D7D7D7, #EDEDED) repeat-x;
    border-bottom: 1px solid #BBB9BA;
    padding: 0;
    overflow: hidden;
}

.panelTabs {
    padding: 0 2px 0 2px;
    -moz-box-align: end;
}

panelTab {
    margin: 2px 1px 0 3px;
    border: 1px solid transparent;
    border-bottom: none;
    border-radius: 4px 4px 0 0;
    padding: 2px 7px 5px 7px;
    font-size: 11px;
    font-weight: bold;
    color: #565656;
    direction: ltr;
}
panelTab[selected="true"] {
    border: 1px solid #A0A0A0;
    border-bottom: none;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 1), rgba(255, 255, 255, 0.7)) no-repeat 0 0;
    color: inherit;
}

panelTab:not([selected="true"]):hover {
    border: 1px solid #C8C8C8;
    border-bottom: none;
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.4), rgba(255, 255, 255, 0.2)) no-repeat 0 0;
}

.panelTab-text {
    margin: 0;
}

panelTab[selected="true"] > panelTabMenu {
    margin-left: 3px;
}

/************************************************************************************************/

#fbPanelStatus {
    margin: 2px 5px 3px 0;
    padding: 0 5px;
    overflow: hidden;
}

.panelStatusSeparator {
    margin: 0;
    color: #999999;
}

.panelStatusLabel {
    margin: 0;
    padding: 0 4px;
    cursor: pointer;
    color: #565656;
}

.panelStatusLabel:hover {
    color: blue;
}

.panelStatusLabel[selected="true"] {
    font-weight: bold;
}

.menuHeader {
    margin: 2px 16px;
    color: #565656;
}

/************************************************************************************************/

.toolbar-text-button,
.toolbar-text-menubutton {
    margin: 0 1px;
    -moz-appearance: none;
    padding: 1px 0px 1px 7px;
    min-width: 0;
    max-width: 13em;
    font-weight: bold;
    color: #565656;
    border: none !important;
    border-radius: 8px;
}

.toolbar-text-button > .toolbarbutton-text {
    margin-left: 7px;
    padding-right: 7px;
}

.toolbar-text-button > .toolbarbutton-icon {
    display: none !important;
}

.toolbar-text-button:hover:not([disabled="true"]),
.toolbar-text-menubutton:hover:not([disabled="true"]) ,
.toolbar-text-button[checked="true"]:hover:not([disabled="true"]),
.toolbar-text-menubutton[open="true"]:hover:not([disabled="true"]) {
    background: #999999;
}

.toolbar-text-button:hover:active:not([disabled="true"]),
.toolbar-text-menubutton:hover:active:not([disabled="true"]) {
    box-shadow:
        inset rgba(60, 60, 60, 0.15) 0 -1px 3px,
        inset #111111 0 1px 3px,
        inset rgba(60, 60, 60, 0.1) 0 1px 2px,
        0 1px rgba(244, 244, 244, 0.4);
}

.toolbar-text-button:hover:not([disabled="true"]) > .toolbarbutton-text,
.toolbar-text-menubutton:hover:not([disabled="true"]) > .toolbarbutton-menu-dropmarker,
.toolbar-text-menubutton:hover:not([disabled="true"]) > .toolbarbutton-text {
    color: #FFFFFF;
    text-shadow: 1px 1px rgba(0, 0, 0, 0.4);
}

.toolbar-text-button[checked="true"]:not([disabled="true"]),
.toolbar-text-menubutton[open="true"]:not([disabled="true"]) {
    text-shadow: 0 1px rgba(255, 255, 255, 0.4);
    background-color: #CCCCCC;
}

.toolbar-text-menubutton:hover:active:not([disabled="true"]) > .toolbarbutton-text,
.toolbar-text-menubutton[open="true"]:not([disabled="true"]) > .toolbarbutton-text {
    color: #FFFFFF;
}

.toolbar-text-button > .toolbarbutton-text {
    color: #333333;
}
.toolbar-text-button[checked="true"] > .toolbarbutton-text {
    color: #000000;
}

.toolbar-text-button .toolbarbutton-text,
.toolbar-text-menubutton .toolbarbutton-text {
  font-size: 100% !important;
  margin: 0px !important;
}

.toolbar-text-button > .toolbarbutton-text,
.toolbar-text-menubutton > .toolbarbutton-text {
  display: -moz-box !important;
  height: 16px !important;
  padding-top: 1px;
}

.toolbar-text-button > .toolbarbutton-menu-dropmarker,
.toolbar-text-menubutton > .toolbarbutton-menu-dropmarker {
    list-style-image: url("chrome://browser/skin/bookmarks/folderarrow.png");
    width:  16px !important;
    height: 16px !important;
    padding: 5px 5px 4px 3px;
}

.toolbar-text-menubutton:hover:not([disabled="true"]) > .toolbarbutton-menu-dropmarker,
.toolbar-text-menubutton[open="true"]:not([disabled="true"]) > .toolbarbutton-menu-dropmarker  {
    list-style-image: url("chrome://browser/skin/bookmarks/folderarrow-hover.png");
}

.toolbar-text-button[disabled="true"] > .toolbarbutton-menu-dropmarker,
.toolbar-text-menubutton[disabled="true"] > .toolbarbutton-menu-dropmarker {
    list-style-image: none;
}

/********************************************************************************************/

.toolbar-text-menulist {
    margin-top: 0;
    margin-bottom: 0;
    -moz-appearance: none;
    color: #565656;
}

.toolbar-text-menulist > .menulist-label-box {
    -moz-appearance: none;
    border: none;
    padding-left: 8px;
    background: url(chrome://firebug/skin/menulistLeft.png) no-repeat left center;
}

.toolbar-text-menulist > .menulist-dropmarker {
    -moz-appearance: none;
    width: 20px;
    background: url(chrome://firebug/skin/menulistRight.png) no-repeat left center;
}

.toolbar-text-menulist > .menulist-dropmarker > .dropmarker-icon {
}

.toolbar-label {
    color: #565656;
}

/* ensure the inner toolbar background looks the same as the other toolbars */
#fbToolbarInner.innerToolbar {
    background: #F6F6F6 linear-gradient(to top, #DCDCDC 1px, #FFFFFF 1px, #E9E9E9 55%, #F2F2F2 55%, #FAFAFA) repeat-x;
    margin-left: -5px;
    margin-right: 0px;
}

.useA11y #fbPanelBar1 textbox[focused],
 .searchOptionsMenu button:focus {
    -moz-outline-radius: 10px !important;
}

/* issue 2780, moved from upper level firebug.css, RMC */

.toolbar-image-button {
    -moz-appearance: none;
    margin: 0 2px;
    border: none;
    padding: 0 !important;
    background: transparent !important;
}

.toolbar-image-button > .toolbarbutton-icon {
    padding: 0 !important;
}

.toolbar-image-button > .toolbarbutton-text {
    display: none;
}


/************************************************************************************************/
/* Scrollable TabBar + TabList */

#fbPanelBar1-innerToolbar {
    margin-right: 0;
}

#fbPanelBar1-tabBox > panelBarArrowscrollbox > .scrollbutton-up {
    border-right: 2px solid !important;
    -moz-border-right-colors: rgba(0,0,0,0.25) rgba(255,255,255,0.15) !important;
    border-left: 2px solid transparent !important;
}

#fbPanelBar1-tabBox > panelBarArrowscrollbox > .scrollbutton-down {
    border-left: 2px solid !important;
    border-right: 2px solid !important;
    -moz-border-left-colors: rgba(0,0,0,0.25) rgba(255,255,255,0.15) !important;
    -moz-border-right-colors: rgba(0,0,0,0.25) rgba(255,255,255,0.15) !important;
}

.fb-tabs-alltabs-button > .toolbarbutton-text {
    display: none;
}

.fb-tabs-alltabs-button {
    margin-right: 0;
    padding: 0 4px 0 3px !important;
    border-left: 2px solid !important;
    border-right: 2px solid !important;
    -moz-border-left-colors: rgba(0,0,0,0.25) rgba(255,255,255,0.15) !important;
    -moz-border-right-colors: rgba(0,0,0,0.25) rgba(255,255,255,0.15) !important;
}

/************************************************************************************************/

#fbMigrationOk {
    font-family: Monaco, monospace;
}