Changing refresh and stop button look

edited October 2008 in Stylish
hey. im looking ofr the code that identifys firefox'x refresh and stop button

i need to change the look of them probably by using a base64 image so i need the extension(right word?) to use
for example

.tabbrowser-tabs {

-moz-appearance: none !important;
background-image: url(data:im

i need to know the equivalent for .tabbrowser tabs for the refresh and stop button




i hope this makes sence and someone can help me

its all going towards a theme for firefox that looks as close to ie8b2 as possible

cheers in advance

Comments

  • #stop-button .toolbarbutton-icon
    #reload-button .toolbarbutton-icon
  • edited October 2008
    figured i'd mention

    the images for the toolbar use list-style-image instead of background-image (but you can use bg if you perfer)
    {list-style-image:url(data:image)!important)

    if you want to save space, you can combine images into a single image and use -moz-image-region (see chrome://browser/skin/Toolbar.png for what it looks like) to select parts of an image
    {-moz-image-region:0px 16px 16px 0!important} would select the top left 16x16px area
    0 32px 16px 16px would be the next 16px square to the right
    16px 32px 32px 16px would be the next square below

    use this if your having trouble (forgot where i got it some css tutorial)
    Free Image Hosting at www.ImageShack.us

    if you wanted to combine the stop/reload buttons
    #stop-button .toolbarbutton-icon,#reload-button .toolbarbutton-icon{list-style-image:url(data:image)!important)
    #stop-button .toolbarbutton-icon{-moz-image-region:0px 16px 16px 0!important}
    #reload-button .toolbarbutton-icon{-moz-image-region:0 32px 16px 16px!important}
  • thanks guys for the help. ill post when i need more :-p cheers!!
  • right i need more help please :-p


    ive managed to change the buttons look but i would like to know the name fore the hover function much like the tabs again

    .tabbrowser-tabs tab:not([selected="true"]):hover {

    something like that maybe but with the #stop-button .toolbarbutton-icon bit maybe? i dont know

    if you guys could help that would be great!!!!
  • also it would be good to know how to change them to behave like the address bar in terms of transparancy. like when you hover it becomes opaque and when not its translucent?
  • #stop-button .toolbarbutton-icon,
    #reload-button .toolbarbutton-icon {
    opacity: 65% !important;
    }

    #stop-button .toolbarbutton-icon:hover,
    #reload-button .toolbarbutton-icon:hover {
    opacity: 1 !important;
    }
  • cheerd for the help but it doesnt work :-p

    im probably doing it wrong. first time using css outside of a simple website

    my problem is ive got the refresh button and stop button lookinglike the ie8 ones and got them to be translucent.

    only problems are i dont know the border colours so they look strange in different backgrounds. and i still have the default firefox thing come up when i hover over the buttons. i want a new image to come up of the hovered button from ie8 not like a weird gow square thing from firefox which is in the wrong place anyway :-p


    if anyone can help i would very much appreciate it..


    also one more problem :-p i would like to be able to put buttons onto the tab toolbar. like addon buttons like adblock stylish ect. is this possible? like maybe create an area on the tab bar for them?

    cheers
  • i think only floating point numbers work with opacity: (0.0 to 1.0)

    try using
    #stop-button,
    #reload-button{
    opacity: .65 !important;
    }

    if you goto your program files\mozilla firefox\chrome folder, extract classic.jar (its a zip), search for browser.css, then it'll show you how firefox changes the icons

    not sure about buttons on the tabbar but i'd assume some javascript would work
  • ok. im completely stuck. plus uni work piled up. anyway. has anyone got the code to make the top bar. (the one with the nave bar) look like ie8? cause ive got a style with it but i cant seem to intergrate it with my code cause it has tabs stuff i cant seem to find..
    if someone can post the code for the top bar. or atleast all teh variables or something. idunno. i am stuck with it lol.
Sign In or Register to comment.