[Project_owners] mozilla toolbar icons - modern theme

Eric Jung grimholtz at yahoo.com
Fri Oct 14 12:18:13 EDT 2005


Hi,
I've overlayed two toolbar buttons onto Mozilla 1.7. They look fine
with the classic theme:
http://img93.imageshack.us/img93/2277/capture1014200512126pm8af.jpg
but not so fine with the modern theme:
http://img93.imageshack.us/img93/484/capture1014200512048pm1yj.jpg

Is this likely a problem with my images or CSS? Here's the overlay:

<hbox id="nav-bar-buttons">
  <toolbarbutton id="passwordmaker-button"
     tooltiptext="Open PasswordMaker" label="Open"
     oncommand="passwordMaker.open();" persist="hidden"
     class="toolbarbutton-1" insertafter="stop-button" popup=""/>

    <toolbarbutton id="passwordmaker-key-button"
      tooltiptext="PasswordMaker Configurable CoolKey"
label="CoolKey" 
      oncommand="passwordMaker.populateFields();" persist="hidden"   

      class="toolbarbutton-1" insertafter="passwordmaker-button"
      popup=""/>                    
</hbox>

And here's the CSS (thanks to Michael Vincent for writing most of
this)

.pwd-button {
  list-style-image:
url("chrome://passwdmaker/content/images/passwdmaker-seamonkey-classic.png")
!important;
}

.passwordmaker-key-button {
  list-style-image:
 
url("chrome://passwdmaker/content/images/key-seamonkey-classic.png")
!important;
}

#passwordmaker-button {
	list-style-image:
url("chrome://passwdmaker/content/images/toolbar-icons-24x24.png");
	-moz-image-region: rect(0px, 24px, 24px, 0px);
}
#passwordmaker-button:hover {
	-moz-image-region: rect(24px, 24px, 48px, 0px);
}

toolbar[iconsize="small"] #passwordmaker-button {
  list-style-image:
  url("chrome://passwdmaker/content/images/toolbar-icons-16x16.png");
  -moz-image-region: rect(0px, 16px, 16px, 0px);
}

toolbar[iconsize="small"] #passwordmaker-button:hover {
  -moz-image-region: rect(16px, 16px, 32px, 0px);
} 

#passwordmaker-key-button {
  list-style-image:
url("chrome://passwdmaker/content/images/key-toolbar-icons-24x24.png");
  -moz-image-region: rect(0px, 24px, 24px, 0px);
}

#passwordmaker-key-button:hover {
  -moz-image-region: rect(24px, 24px, 48px, 0px);
}

toolbar[iconsize="small"] #passwordmaker-key-button {
  list-style-image:
url("chrome://passwdmaker/content/images/key-toolbar-icons-16x16.png");
  -moz-image-region: rect(0px, 16px, 16px, 0px);
}

toolbar[iconsize="small"] #passwordmaker-key-button:hover {
  -moz-image-region: rect(16px, 16px, 32px, 0px);
} 

Any help would be very much appreciated,
Eric



	
		
__________________________________ 
Yahoo! Mail - PC Magazine Editors' Choice 2005 
http://mail.yahoo.com


More information about the Project_owners mailing list