gecko-dev/themes/modern/global/menulist.css

/********************************/
/* nine slice menulist - This is the default style used for all menulists.
 * This style is fully scalable in 2 dimensions.  It supports menulists in
 * both active and disabled states, which includes 3 sets of sliced images.
 ********************************/

  menulist {
    -moz-binding		  : url(chrome://global/skin/globalBindings.xml#nine-slice-menulist);
    margin			      : 0px 1px 0px 1px;
    border            : 3px solid transparent;
    padding           : 0px;
    min-height        : 19px;
    font              : message-box;
  }

  .menulist-text-mid {
    color             : #000000;
    padding-right     : 2px;
  }

  .menulist-icon-mid {
    padding-right     : 2px;
  }

  .menulist-dropmarker {
    list-style-image  : url("chrome://global/skin/menulist-arrow.gif");
    width				      : 9px;
    height			      : 6px;
  }

  /* .......... focused state .......... */

  menulist:focus {
    border-color        : #8C9EB5;
    -moz-border-radius  : 10px 7px 11px 10px;
  }

  /* .......... normal state .......... */

  .menulist-box-left {
    width           : 8px;
  }
    
  .menulist-left-top {
    background			: url("chrome://global/skin/menulist-left-top.gif") no-repeat;
    height          : 10px;
  }

  .menulist-left-mid {
    background			: url("chrome://global/skin/menulist-left-mid.gif") repeat-y;
  }

  .menulist-left-btm {
    background			  : url("chrome://global/skin/menulist-left-btm.gif") no-repeat;
    height            : 7px;
  }

  .menulist-box-mid {
    background-color  : #A5BABD;
  }
  
  .menulist-mid-top {
  	background			: url("chrome://global/skin/menulist-mid-top.gif") repeat-x;
  	height          : 3px;
    vertical-align  : top;
  }

  .menulist-mid-mid {
  	background			  : url("chrome://global/skin/menulist-mid-mid.gif") repeat-x;
  }

  .menulist-mid-btm {
    background			  : url("chrome://global/skin/menulist-mid-btm.gif") repeat-x;
    height            : 4px;
    vertical-align    : bottom;
  }

  .menulist-text-box {
    vertical-align    : middle;
  	text-align        : left;
    padding           : 1px 0px 2px 0px;
  }

  .menulist-box-right {
    width           : 22px;
  }
  
  .menulist-right-mid {
  	background			: url("chrome://global/skin/menulist-right-mid.gif") repeat-y;
  }

  .menulist-right-mid2 {
  	background			: url("chrome://global/skin/menulist-right-top.gif") no-repeat;
    padding-left    : 3px;
    padding-right   : 2px;
    padding-top     : 6px;
    text-align      : center;
    vertical-align  : middle;
  }

  .menulist-right-btm {
    background			  : url("chrome://global/skin/menulist-right-btm.gif") no-repeat;
    height            : 7px;
  }

  /* .......... active state .......... */

  menulist:hover:active > .menulist-box-left > .menulist-left-top,
  menulist[open="true"] > .menulist-box-left > .menulist-left-top {
    background-image   : url("chrome://global/skin/menulist-active-left-top.gif");
  }

  menulist:hover:active > .menulist-box-left > .menulist-left-mid,
  menulist[open="true"] > .menulist-box-left > .menulist-left-mid {
    background-image   : url("chrome://global/skin/menulist-active-left-mid.gif");
  }

  menulist:hover:active > .menulist-box-left > .menulist-left-btm,
  menulist[open="true"] > .menulist-box-left > .menulist-left-btm {
    background-image   : url("chrome://global/skin/menulist-active-left-btm.gif");
  }

  menulist:hover:active > .menulist-stack > .menulist-box-mid,
  menulist[open="true"] > .menulist-stack > .menulist-box-mid {
    background-color  : #84969C;
  }
  
  menulist:hover:active > .menulist-stack > .menulist-box-mid > .menulist-mid-top,
  menulist[open="true"] > .menulist-stack > .menulist-box-mid > .menulist-mid-top {
  	background-image  : url("chrome://global/skin/menulist-active-mid-top.gif");
  }

  menulist:hover:active > .menulist-stack > .menulist-box-mid > .menulist-mid-mid,
  menulist[open="true"] > .menulist-stack > .menulist-box-mid > .menulist-mid-mid {
  	background-image  : url("chrome://global/skin/menulist-active-mid-mid.gif");
  }

  menulist:hover:active > .menulist-stack > .menulist-text-box > .menulist-text-mid,
  menulist[open="true"] > .menulist-stack > .menulist-text-box > .menulist-text-mid {
    color: #ffffff;
  }

  menulist:hover:active > .menulist-stack > .menulist-box-mid > .menulist-mid-btm,
  menulist[open="true"] > .menulist-stack > .menulist-box-mid > .menulist-mid-btm {
    background-image  : url("chrome://global/skin/menulist-active-mid-btm.gif");
  }

  menulist:hover:active > .menulist-box-right > .menulist-right-mid,
  menulist[open="true"] > .menulist-box-right > .menulist-right-mid {
  	background-image  : url("chrome://global/skin/menulist-active-right-mid.gif");
  }

  menulist:hover:active > .menulist-box-right > .menulist-right-mid > .menulist-right-mid2,
  menulist[open="true"] > .menulist-box-right > .menulist-right-mid > .menulist-right-mid2 {
  	background-image  : url("chrome://global/skin/menulist-active-right-top.gif");
  }

  menulist:hover:active > .menulist-box-right > .menulist-right-btm,
  menulist[open="true"] > .menulist-box-right > .menulist-right-btm {
    background-image  : url("chrome://global/skin/menulist-active-right-btm.gif");
  }

  /* .......... disabled state .......... */

  menulist:hover:active > .menulist-box-left > .menulist-left-top[disabled="true"],
  .menulist-left-top[disabled="true"] {
    background-image   : url("chrome://global/skin/menulist-dis-left-top.gif");
  }

  menulist:hover:active > .menulist-box-left > .menulist-left-mid[disabled="true"],
  .menulist-left-mid[disabled="true"] {
    background-image   : url("chrome://global/skin/menulist-dis-left-mid.gif");
  }

  menulist:hover:active > .menulist-box-left > .menulist-left-btm[disabled="true"],
  .menulist-left-btm[disabled="true"] {
    background-image   : url("chrome://global/skin/menulist-dis-left-btm.gif");
  }

  menulist:hover:active > .menulist-stack > .menulist-text-box > .menulist-text-mid[disabled="true"],
  .menulist-text-mid[disabled="true"] {
    color              : #7F8997;
  }

  menulist:hover:active > .menulist-stack > .menulist-box-mid[disabled="true"],
  .menulist-box-mid[disabled="true"] {
    background-color    : #ADBEC6;
  }

  menulist:hover:active > .menulist-stack > .menulist-box-mid > .menulist-mid-top[disabled="true"],
  .menulist-mid-top[disabled="true"] {
  	background-image  : url("chrome://global/skin/menulist-dis-mid-top.gif");
  }

  menulist:hover:active > .menulist-stack > .menulist-box-mid > .menulist-mid-mid[disabled="true"],
  .menulist-mid-mid[disabled="true"] {
  	background-image  : url("chrome://global/skin/menulist-dis-mid-mid.gif");
  }

  menulist:hover:active > .menulist-stack > .menulist-box-mid > .menulist-mid-btm[disabled="true"],
  .menulist-mid-btm[disabled="true"] {
    background-image  : url("chrome://global/skin/menulist-dis-mid-btm.gif");
  }

  menulist:hover:active > .menulist-box-right > .menulist-right-mid[disabled="true"],
  .menulist-right-mid[disabled="true"] {
  	background-image  : url("chrome://global/skin/menulist-dis-right-mid.gif");
  }

  menulist:hover:active > .menulist-box-right > .menulist-right-mid > .menulist-right-mid2[disabled="true"],
  .menulist-right-mid2[disabled="true"] {
  	background-image  : url("chrome://global/skin/menulist-dis-right-top.gif");
  }

  menulist:hover:active > .menulist-box-right > .menulist-right-btm[disabled="true"],
  .menulist-right-btm[disabled="true"] {
    background-image  : url("chrome://global/skin/menulist-dis-right-btm.gif");
  }

  .menulist-dropmarker[disabled="true"] {
    list-style-image  : url("chrome://global/skin/menulist-dis-arrow.gif");
  }

/** rules for EDITABLE menulists (aka 'comboboxes'). 
 **/

/* outer frame */
  menulist[editable="true"] 
    {
      padding             : 0px;
    }

/* icon display frame */
  menulist[editable="true"] > .menu-icon 
    {
      list-style-image    : url("chrome://communicator/skin/bookmarks/bookmark-item.gif");
      background-color    : white;
      padding             : 1px;
      border-left         : 1px inset #CCCCCC;
      border-top          : 1px inset #CCCCCC;
      border-right        : none;
      border-bottom       : 1px inset #CCCCCC;
    }

/* text display frame */    
  menulist[editable="true"] > .menu-text 
    {
      border-left         : none;
      border-top          : 1px inset #CCCCCC;
      border-right        : 1px inset #CCCCCC;
      border-bottom       : 1px inset #CCCCCC;
      margin              : 0px 2px 0px 0px;
    }

/* drop marker display frame */
  menulist[editable="true"] > .menu-dropmarker 
	{
      border              : 1px outset #CCCCCC;
	}

  menulist[editable="true"][open="true"] > .menu-dropmarker 
    {
      border              : 1px inset #CCCCCC;
    }

/* rules for popups and separators associated with menulists */
  menulist > menupopup {
    border              : 1px solid #313948;
    padding             : 0px;
    min-width           : 0px;
    background-color	  : #C2D0D0;
  }
    
  menulist > menupopup > .popup-internal-box
    {
      border: 0px;
    }
  
  menulist > menupopup > menuseparator 
    {
      border-top: 1px solid #919FA3;
      border-bottom: 1px solid #E6EFEE;
    }

  menulist > menupopup > menuitem,
  menulist > menupopup > menu 
    {
      padding-right       : 12px;
      padding-top         : 1px;
      padding-bottom      : 1px;
      min-width           : 0px;
      max-width           : none !important;
      color				        : #000000;
      font                : message-box;
    }


  menulist > menupopup > menuitem[menuactive="true"]
    {
    	background-color  : #465B75;
    	color			  : #FFFFFF;
    }

  menulist > menupopup > menuitem[selected="true"] > .menu-iconic-left
    {
      list-style-image    : url(chrome://global/skin/menu-check.gif);
    }
  
  menulist > menupopup > menuitem[menuactive="true"][selected="true"] > .menu-iconic-left
    {
      list-style-image    : url(chrome://global/skin/menu-check-hover.gif);
    }
  
  menulist > menupopup > arrowscrollbox > vbox > autorepeatbutton:hover 
    {
      background-color: #B2BFBF;
      border: 1px inset #B2BFBF;
    }

/* :::::::::: compact menulists :::::::::: */

.menulist-compact {
  -moz-binding: url("chrome://global/skin/globalBindings.xml#menulist-compact");
  margin: 0px;
  border: 1px solid #000000;
  min-width: 0px;
  min-height: 0px;
  background-color: #D6DFDF;
  -moz-user-focus: normal;
}

.menulist-compact-text {
  margin-right: 3px;
}  

.menulist-compact-internal-box {
  border-left: 1px solid #F7F7F7;
  border-top: 1px solid #F7F7F7;
  border-right: 1px solid #8CA2A5;
  border-bottom: 1px solid #8CA2A5;
  padding: 1px;
}
    
.menulist-compact-dropmarker {
  list-style-image: url("chrome://global/skin/menulist-compact-arrow.gif");
  margin-left: 2px;
}
      
.menulist-compact:hover:active > .menulist-compact-internal-box,
.menulist-compact[open="true"] > .menulist-compact-internal-box {
  background-color: #949EA5;
  border: 1px solid #808080;
}