Recommended Posts

Needs many changes , i did it lightly...

Thanx, but it needs alot of work...

This is the code I use for the toolbar if it's any help:

#navigator-toolbox:not([tabsontop=true]) #nav-bar
{
-moz-box-shadow: threedshadow 0 -1px inset !important;
padding-bottom: 7px !important;
}

#navigator-toolbox:not([tabsontop=true]) toolbar:not(#nav-bar):not(#toolbar-menubar)
{
background-color: rgba(223,233,245,1) !important;
}

#main-window:not([sizemode="maximized"]) #navigator-toolbox:not([tabsontop=true]) toolbar:not(#nav-bar):not(#toolbar-menubar)
{
border-left: 1px solid threedshadow !important;
border-right: 1px solid threedshadow !important;
}

#navigator-toolbox:not([tabsontop=true]) #PersonalToolbar
{
background: -moz-linear-gradient(top, rgba(255,255,255,1), rgba(255,255,255,0)) !important;
}

#navigator-toolbox:not([tabsontop="true"]) #TabsToolbar
{
padding-top: 2px !important;
}

#navigator-toolbox[tabsontop=true]
{
border-bottom: 1px solid threedshadow !important;
}

#navigator-toolbox[tabsontop=true] #TabsToolbar
{
-moz-box-shadow: inset threedshadow 0px -1px !important;
}

#navigator-toolbox[tabsontop=true] toolbar:not(#TabsToolbar):not(#toolbar-menubar)
{
background-color: rgba(223,233,245,.6) !important;
}

#main-window:not([sizemode="maximized"]) #navigator-toolbox[tabsontop=true] toolbar:not(#TabsToolbar):not(#toolbar-menubar)
{
border-left: 1px solid threedshadow !important;
border-right: 1px solid threedshadow !important;
}

#navigator-toolbox[tabsontop=true] #nav-bar
{
padding-top: 5px !important;
padding-bottom: 5px !important;
background: -moz-linear-gradient(top, rgba(242,246,251,1), rgba(255,255,255,.0)) !important;
}

.tabbrowser-tab[selected=true]
{
font-weight: bold !important;
}

Is it even possible to come close to this with stylish:

post-251611-12796373481978.png

  1. the thin bright line around the menu button.
  2. colour/gradient on active tab & nav & bookmarks toolbar.
  3. colour/gradient on inactive tab. (same as home button)
  4. colour/gradient on home button. (same as inactive tab)

Cheers

  1. the thin bright line around the menu button.

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

#main-window {
  margin-top: 1px !important;
}

 #appmenu-button {
   -moz-appearance: none !important;
   background-image: -moz-linear-gradient(rgb(247,182,82), rgb(215,98,10) 95%) !important;
   background-clip: padding-box !important;
   -moz-border-radius: 0 0 4px 4px !important;
   border-top: none !important;
   border: 2px solid !important;
   border-top: none !important;
   -moz-border-left-colors: rgba(255,255,255,.5) rgba(83,42,6,.9) !important;
   -moz-border-bottom-colors: rgba(255,255,255,.5) rgba(83,42,6,.9) !important;
   -moz-border-right-colors: rgba(255,255,255,.5) rgba(83,42,6,.9) !important;
   -moz-box-shadow: 0 1px 0 rgba(255,255,255,.25) inset,
                    0 0 0 1px rgba(255,255,255,.40) inset !important;
   color: white !important;
   font-weight: bold !important;
   text-shadow: 0 0 1px rgba(0,0,0,.7),
                0 1px 2px rgba(0,0,0,.5) !important;
   padding: 2px 1.5em .15em 1.5em !important;
   margin: 0 !important;
 }

 #appmenu-button:-moz-window-inactive {
   background: transparent !important;
   background-clip: padding-box !important;
   -moz-border-left-colors: rgba(255,255,255,.5) rgba(83,42,6,.4) !important;
   -moz-border-bottom-colors: rgba(255,255,255,.5) rgba(83,42,6,.4) !important;
   -moz-border-right-colors: rgba(255,255,255,.5) rgba(83,42,6,.4) !important;
   -moz-box-shadow: 0 1px 0 rgba(255,255,255,.25) inset,
                    0 0 0 1px rgba(255,255,255,.35) inset !important;
 }

 #appmenu-button:hover:not(:active):not([open]),
 #appmenu-button:hover:-moz-window-inactive:not(:active):not([open]) {
   background-image: -moz-radial-gradient(center bottom, farthest-side, rgba(252,240,89,.5) 10%, rgba(252,240,89,0) 70%),
                     -moz-radial-gradient(center bottom, farthest-side, rgb(236,133,0), rgba(255,229,172,0)),
                     -moz-linear-gradient(rgb(246,170,69), rgb(209,74,0) 95%) !important;
   border-color: rgba(83,42,6,.9) !important;
   -moz-box-shadow: 0 1px 0 rgba(255,255,255,.1) inset,
                    0 0 2px 1px rgba(250,234,169,.7) inset,
                    0 -1px 0 rgba(250,234,169,.5) inset !important;
 }

 #appmenu-button:hover:active,
 #appmenu-button[open] {
   background-image: -moz-linear-gradient(rgb(246,170,69), rgb(209,74,0) 95%) !important;
   -moz-border-radius: 0 !important;
   -moz-box-shadow: 0 2px 4px rgba(0,0,0,.4) inset,
                    0 1px 1px rgba(0,0,0,.2) inset !important;
 }

buttoni.png

Thanx Heartripper! ;)

But I'm not a big fan of the inactive window thing that affects the button though...

remove the

 #appmenu-button:-moz-window-inactive {
   background: transparent !important;
   background-clip: padding-box !important;
   -moz-border-left-colors: rgba(255,255,255,.5) rgba(83,42,6,.4) !important;
   -moz-border-bottom-colors: rgba(255,255,255,.5) rgba(83,42,6,.4) !important;
   -moz-border-right-colors: rgba(255,255,255,.5) rgba(83,42,6,.4) !important;
   -moz-box-shadow: 0 1px 0 rgba(255,255,255,.25) inset,
                    0 0 0 1px rgba(255,255,255,.35) inset !important;
 }

part :)

It'll have as much of it as today's nightly build. I don't think it differs a great deal, but there are some subtle changes from beta 1. In the interim, this thread and this one are full of Stylish scripts to make it look even nicer.

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

    • No registered users viewing this page.