Recommended Posts

the go/stop/reload script doesn't work for me

it just cuts off the right line of the urlbar

post-335698-12795581093103.png

You shouldn't need any more code. Just make sure its urlbar then reload and stop.

SoapyHamHocks, how about combine go/reload/stop button? It is possible?

Anyway thanks for sharing stylish code.

SoapyHamHocks, how about combine go/reload/stop button? It is possible?

Anyway thanks for sharing stylish code.

doy, i feel smart now, me stop and reload buttons were still over by the back and next buttons :p

So there's only two things I would like from Beta 1 at this point.

1. I'd like the Home Tab to be the same color as an active tab.

2. Remove that hideous line I can't seem to remove no matter what I do.

I like your setup there mate ;)

Hi all new here, and new to css. Started messing around with this with the last couple of days, included is copy of my css. I'm pretty happy with it for the moment, I'm using beta 4.0b1 with minimal addons. Ive removed the Firefox button and replaced it with Personal Menu. My problem at the moment is that Id like to change the background color in the Tabs window, at the moment its see through, but it just wont work. Any help much appreciated.

@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

#TabsToolbar #cm-menu {
-moz-appearance: toolbarbutton !important;
-moz-box-shadow: none !important;
background: none repeat scroll 0 0 transparent !important;
border: medium none !important;
color: inherit !important;
margin: 0 !important;
padding: 3px !important;
text-shadow: inherit !important;
list-style-image: url

(file:///C:/Users/Bantryred/AppData/Roaming/Mozilla/Firefox/Profiles/4kkm3yhh.default/chrome/Firefox.png)!important;
-moz-image-region:rect(0 0 0 0)!important;
}

#TabsToolbar #cm-menu > .toolbarbutton-menu-dropmarker {
display: none;
}


#navigator-toolbox[tabsontop="true"] #TabsToolbar{
padding-left: 0px !important;
padding-top: 0px !important;
padding-right:110px !important;
}

#appmenu-button-container{
position: fixed !important;
top: 999999999px !important;
}



#bookmarks-menu-button {display: none;}

#TabsToolbar > #home-button {
-moz-appearance: none !important;
background: transparent -moz-linear-gradient(left center , transparent, transparent 1px, rgba(128, 128, 128, 0.1) 1px, 

rgba(128, 128, 128, 0.1)) repeat scroll -6px 0 !important;
background-clip: border-box !important;
background-origin: padding-box !important;
background-size: 200% auto !important;
margin: 0 !important;
padding: 0 1px !important;
-moz-border-image: url("chrome://browser/skin/tabbrowser/tab.png") 3 5 3 6 / 3px 5px 3px 6px !important;
-moz-border-radius: 6px 4px 0 0 !important;
margin-left: 3px !important;
}

#TabsToolbar > #home-button:hover {
background-image: -moz-linear-gradient(left, transparent, transparent 1px, rgba(255,255,255,.4) 1px, rgba(255,255,255,.4)) 

!important;
}

#TabsToolbar > #home-button > .toolbarbutton-icon {
margin-top: -1px !important;
margin-bottom: -1px !important;
}

#urlbar {
  -moz-border-radius: 4px 0 0 4px !important;
  border-right: 0 !important;
}

#urlbar-container + #reload-button,
#urlbar-container + #reload-button + #stop-button{
  border: 1px solid !important;
  border-color: rgba(0,0,0,.25) rgba(0,0,0,.32) rgba(0,0,0,.37) rgba(0,0,0,.15) !important;
  -moz-border-radius: 0 4px 4px 0!important;  
  -moz-box-shadow: 0 1px 0 rgba(0,0,0,.1) inset,
                   0 1px 0 rgba(255,255,255,.4) !important;
  background: rgba(255,255,255,.725) !important;
  margin-left: -3px !important;
  padding: 0 3px 0 3px !important;
}

#urlbar-container + #reload-button:not([disabled]):hover{
  background-image: -moz-linear-gradient(#9eccf1, #6fb1e1 49%,
                                   #5b9fd9 50%, #5198d2 60%,
                                   #3e8ac9) !important;
}

#urlbar-container + #reload-button + #stop-button{
  background-image: -moz-linear-gradient(#e6a18a, #d17764 49%,
                                   #c05d4e 50%, #b95546 60%,
                                   #c15a4a) !important;
}

#urlbar-container + #reload-button:hover:active,
#urlbar-container + #reload-button + #stop-button:hover:active {
  -moz-box-shadow: inset 0 0 3px rgba(0,0,0,.8) !important;
}

#main-window #navigator-toolbox[tabsontop="true"] #TabsToolbar
{
margin-right: 92px !important;
}
tab:not([selected="true"])
{
color: white !important;
}

P.S.

If any of this needs tiding up, please tell me.

Thanks

Unfortunately yes, also color a little to light/bright for my taste.

Any other ideas?

Alright try this. Show the menubar and use this code:

#navigator-toolbox {
  -moz-appearance: toolbox !important;
}

#toolbar-menubar {
  display: none !important;
}

I like your setup there mate ;)

Glad you like it. :D

I took a few of the styles from this thread and only did a few modifications. Rather than hijack the thread with a long code post, I put each one of the styles into a .rtf for you. You will still have to manually move the Home Tab to the title bar section, move the Stop/Reload buttons to the right side, add the Download button to the right side and enable Small Icons for Firefox.

Now if Soapy or Darrian could help me with my two issues I posted earlier.

Stylish Scripts.rtf

1. No clue about the home tab; it's been requested before and nobody's come up with anything yet.

2. Not sure what this "hideous line" is you want removed. I think what you are talking about is the margin between the top of your tab and the window border. You can move your tabs up so that there is no margin whatsoever or move them down a little. Or you may be talking about the actual tab border itself?

1. No clue about the home tab; it's been requested before and nobody's come up with anything yet.

2. Not sure what this "hideous line" is you want removed. I think what you are talking about is the margin between the top of your tab and the window border. You can move your tabs up so that there is no margin whatsoever or move them down a little. Or you may be talking about the actual tab border itself?

There is this line that I can move to the left and right, acting like a separator of sorts. The only problem is, no matter what I try, I cannot seem to remove it. In this shot you can see it a lot clearer.

post-277424-12795988408464.png

In the second shot, this is what happens when I move it back to the original area. It is some sort of odd bug. The second screen goes away with a FF restart, but the line stays. I haven't noticed it in anyone's shots.post-277424-12795989881981.png

edit: I apparently don't know how to attach more than one image.

Wow, that is... bizarre. Open your toolbar customization and see if maybe you have a space, separator or flexible space in there? Or maybe you've created a new toolbar that got dragged into the navigation toolbar?

I figured it out! Well, not really, but I got rid of it. I restored the default set in Firefox and it went away. I think I might have created some new toolbar, but it doesn't explain why I couldn't remove it or drag and drop it out of there. Good riddance though.

Remove this from your code.

#appmenu-button-container{
position: fixed !important;
top: 999999999px !important;
}

The problem with that is it returns the Firefox button which I personal don't like, maybe in future betas it will do more, but for now I think its pointless. Using the Personal Menu addon, Ive all the functionality I need, and its only a small Icon on the same line as the tabs. P.S. whats a good program to take a screen shot for windows. Thanks

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.