Recommended Posts

I tried installing Stylish but says it hasn't been updated to work with my version of firefox (latest beta).

https://addons.mozilla.org/en-US/firefox/addon/2108/

The above should work if you have add on compatibility reporter installed.

Is it possible to edit the spacer you can use in the customize menu?

there is "flexible space" & "space" to choose from.

I've used "space" here.

Have a look to see what i mean:

post-251611-12831617856436.png

post-251611-12831617884669.png

I have rounded corners in the nav.bar and want the "home" button more close to the edge

to suite the bar.

Maybe a little bit vague, but I hope someone understands :laugh:

Cheers

Anyone who wants to make a mockup like style , i am giving you a base code :)

Pic :

96245213.png

Code :

#appmenu-button dropmarker
{ margin: 0 1px 0 0 !important; }

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

#main-window[tabsontop="true"] menubar 
{	margin-left: 100px !important; }


#main-window[sizemode="maximized"][tabsontop="true"] #appmenu-button-container 
{	position: fixed !important; 
 	margin: 6px 0px 4px 4px !important;
 	top: 2px !important; }

#navigator-toolbox[tabsontop="true"] #TabsToolbar
{ padding: 22px 0 0 9px !important; }

#main-window[tabsontop="true"]
{ margin-top: -25px !important; }

.tabbrowser-tab[fadein]:not([pinned])
{ max-width: 200px !important; }

#appmenu-button {
 -moz-box-shadow: 0 0 2px 0 rgba(255,255,255,.75) inset,
 	0 1px 0 rgba(255,255,255,.45) inset !important;
 border: 2px solid !important;
 border-top: 0!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;
 max-height: 20px !important;
 min-height: 20px !important;
 background-color: rgba(255,255,255,1) !important;
 background-image: -moz-linear-gradient(rgba(244,172,17,.85),
 	rgba(218,107,17,1) 100%) !important;
 padding: 0 16px 1px 16px !important;
}

#appmenu-button:hover:not(:active):not([open]),
#bettermenu-button:hover:not(:active):not([open]) {
 background-image: -moz-linear-gradient(rgba(244,172,17,.70),
 	rgba(218,107,17,1) 100%) !important;
}

#appmenu-button:hover:active,
#appmenu-button[open],
#bettermenu-button[open] {
 -moz-box-shadow: inset 0 0 2px 0 rgba(0,0,0,.4) !important;
}

#TabsToolbar > .toolbarbutton-1:not(#alltabs-button):not(#new-tab-button) {
 -moz-appearance: none !important;
 margin: 0 !important;
 padding: 0 !important;
 background-repeat: no-repeat !important;
 background-size: 200% !important;
 -moz-border-image: url("chrome://browser/skin/tabbrowser/tab.png") 4 5 3 6 / 4px 5px 3px 6px !important;
 -moz-border-radius: 10px 8px 0 0 !important;
}

.tabbrowser-tab:not([selected="true"]),
.tabs-newtab-button,
#TabsToolbar > .toolbarbutton-1:not(#alltabs-button):not(#new-tab-button) {
 background-position: -5px -2px !important;
 background-image: -moz-linear-gradient(top,rgba(198,201,206,.70),
 	rgba(151,160,172,.70)),
 	-moz-linear-gradient(bottom, rgba(0,0,0,.8) 20%, rgba(0,0,0,0) 60%) !important;
}

.tabbrowser-tab:not([selected="true"]):hover,
.tabs-newtab-button:hover,
#TabsToolbar > .toolbarbutton-1:not(#alltabs-button):not(#new-tab-button):hover {
 background-image: -moz-linear-gradient(top,rgba(198,201,206,.8),
 	rgba(151,160,172,.8)),
 	-moz-linear-gradient(bottom, rgba(0,0,0,.8) 20%, rgba(0,0,0,0) 60%) !important;
}

.tabbrowser-tab:not([selected="true"]) {
 text-shadow: 0 1px 0 rgba(255,255,255,.3) !important;
}

I have rounded corners in the nav.bar and want the "home" button more close to the edge

to suite the bar.

Cheers

Code for rounded corners please!! :drool:

I'm not sure I follow what you mean by you, altered them, and now they don't show up.

The scripts I used were from userstyle.org and some from here. But I did not use the entire script of anyone of them. Just bits and pieces. I just put the CSS in userChrome.css manually. When I tried to install Stylish, it showed no scripts being installed. In order for them to show up in Stylish, I would have to remove everything I have and then install each script using Stylish and then edit the scripts. That is way too much work.

Here you go:

(don't remember where I got it from)

#navigator-toolbox[tabsontop="true"] #nav-bar {
	-moz-border-radius-topleft: 5px;
	-moz-border-radius-topright: 5px;
}

Thanks :)

I created a userstyle of the my above code and this rounded navigation bar code :D

http://userstyles.org/styles/36259?r=1283177010

The scripts I used were from userstyle.org and some from here. But I did not use the entire script of anyone of them. Just bits and pieces. I just put the CSS in userChrome.css manually. When I tried to install Stylish, it showed no scripts being installed. In order for them to show up in Stylish, I would have to remove everything I have and then install each script using Stylish and then edit the scripts. That is way too much work.

I see. Would just copying all the contents of your userchrome.css over to a single new stylish script work? Afterwards you can organize those bits and pieces into their own individual stylish scripts, one at a time, whenever you wanted.

This way you don't have to click a bunch of times and make a ton of individual new scripts just to recreate your current set up, you would be set with one script. But you would still have the capability to organize them later on when you feel like it.

I see. Would just copying all the contents of your userchrome.css over to a single new stylish script work? Afterwards you can organize those bits and pieces into their own individual stylish scripts, one at a time, whenever you wanted.

This way you don't have to click a bunch of times and make a ton of individual new scripts just to recreate your current set up, you would be set with one script. But you would still have the capability to organize them later on when you feel like it.

Thanks, I probably could do that but it may be against their TOS as the styles are a mosh of other users posted scripts. It is not a big deal, to not have Stylish. When Firefox 4 goes final, I may just start over again anyway.

Tabs in Titlebar

/* Move tabs up to titlebar in maximized window */

#navigator-toolbox[tabsontop=true] #TabsToolbar {

margin-top: -16px !important;

padding-left: 112px !important;

padding-right: 112px !important;

}

/* Move tabs up to titlebar in normal window */

#main-window[sizemode=normal] #navigator-toolbox[tabsontop=true] #TabsToolbar {

margin-top: -21px !important;

padding-left: 109px !important;

padding-right: 109px !important;

}[/code]

But if i show the menu with ALT Key, the tab shows overlapped with menu. Not nice...

Is there a way to change the height of the tabs? I recently downloaded a windows 7 theme and it put a blue bar on top of a black background. This would be perfect for the tab bar if the tabs didn't stick out above the blue bar. I just need to shrink the tabs by a few pixels but I have no idea where to start. Any help would be appreciated.

post-201025-12831924755856.jpg

Is there a way to change the height of the tabs? I recently downloaded a windows 7 theme and it put a blue bar on top of a black background. This would be perfect for the tab bar if the tabs didn't stick out above the blue bar. I just need to shrink the tabs by a few pixels but I have no idea where to start. Any help would be appreciated.

http://userstyles.org/styles/13709

The above userstyle may work for you.

Navigator Toolbar Shadows and Curved Corners (with work, could become the white underglow in the Office 2010 titlebar)

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

/* Shadow above navigator toolbar, curved corners */
#navigator-toolbox[tabsontop="true"] #nav-bar {
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    -moz-box-shadow: 0px -3px 5px rgba(0,0,0,0.3);
}

How did you get it so that the shadow doesn't appear on the active tab?

Messing around with a few "clear" codes, anyone got a good one? Using a combination of Gary7 and Soapys, good, but not complete yet. Having problems with app tabs not aligning properly at the bottom, and also getting the history sidebar to look like the bookmarks sidebar in Gary7 code.

post-346088-1283298962378.png

How did you get it so that the shadow doesn't appear on the active tab?

The navigation toolbar is at a lower layer than the active tab (I think) so its box shadow is drawn below it.

Some script updates:

Here's what it looks like when you hit ALT (the tabs are now shifted down and the menu bar appears):

post-173518-12833005521623.png

Tabs in Titlebar (now the menu-bar is shown properly, instead of behind the tabs!)

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

/* Move tabs up to titlebar in maximized window */
#navigator-toolbox[tabsontop="true"] #TabsToolbar {
    padding-left: 109px !important;
    padding-right: 112px !important;
}

/* Move tabs up to titlebar in normal window */
#main-window[sizemode="normal"] #navigator-toolbox[tabsontop="true"] #TabsToolbar {
    padding-left: 109px !important;
    padding-right: 109px !important;
}

/* Move the menubar above the tabs so it moves the tab bar down when activated */
#toolbar-menubar {
    margin: -19px 0px 3px 109px !important;
}

#main-window[sizemode="normal"] #toolbar-menubar {
    margin: -24px 0px 3px 109px !important;
}

Navigator Toolbar Shadows and Curved Corners (now has a sweet white underglow, Office 2010 style, when maximized!)

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

/* Shadow above navigator toolbar, curved corners */
#main-window[sizemode="normal"] #navigator-toolbox[tabsontop="true"] #nav-bar {
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    -moz-box-shadow: 0px -3px 8px rgba(0,0,0,0.4);
}

/* White underglow above navigator toolbar */
#main-window[sizemode="maximized"] #navigator-toolbox[tabsontop="true"] #TabsToolbar {
    background-image: -moz-linear-gradient(top, rgba(255,255,255,0) 20%, rgba(255,255,255,1)) !important;
}

New App Button Margin Fixes

Now you can use Soapy's new app button out of the box, just add and modify this short script, which also moves the app button to the corner when maximized.

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

#main-window[sizemode="normal"] {
    margin-top: -1px !important;
}

#main-window[sizemode="maximized"] #appmenu-button {
    margin-left: -3px !important;
    -moz-border-radius-bottomleft: 0px !important;
}

Just a note that due to the changes in the stylish code, it is now only compatible with tabs-on-top and a hidden menu-bar (the default Minefield configuration). I could probably fix this using more refined selectors, but the current script will work for now.

tabs on top for beta 5 with no firefox button.

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); 
#navigator-toolbox[tabsontop="true"] 

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

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

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

#appmenu-button{
padding: 3px !important;
-moz-border-radius-bottomleft: 0px !important;
} 

So I really liked some of the app button concepts that are being considered for the final release of Firefox.

Stephen Horlander even added patch code in bug 574681 to make it look like this:

post-173518-12834977372977.png

Which everyone on Bugzilla seems to like. I do too! So I've created a style out of it!

Firefox 4 App Button Style for Bug 574681 Patch 1.0 (for Windows XP, Vista and 7)

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

#appmenu-button {
    -moz-appearance: none !important;
    background-image: -moz-linear-gradient(rgb(247,182,82), rgb(215,98,10) 95%) !important;
    -moz-border-radius: 0 0 4px 4px !important;
    border: 2px solid !important;
    border-top: none !important;
    -moz-box-shadow: 0 1px 0 rgba(255,255,255,.25) inset, 0 0 0 1px rgba(255,255,255,.25) inset !important;
    text-shadow: 0 0 1px rgba(0,0,0,.7), 0 1px 2px rgba(0,0,0,.5) !important;
    padding: .1em 1.5em .15em 1.5em !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 2px 1px rgba(255,255,255,.25) inset !important;
}

#appmenu-button:-moz-window-inactive {
    background: transparent !important;
    background-clip: padding-box !important;
    border-color: rgba(0,0,0,.4) !important;
    -moz-border-left-colors: rgba(255,255,255,.4) rgba(0,0,0,.5) !important;
    -moz-border-bottom-colors: rgba(255,255,255,.4) rgba(0,0,0,.5) !important;
    -moz-border-right-colors: rgba(255,255,255,.4) rgba(0,0,0,.5) !important;
    -moz-box-shadow: 0 0 0 1px rgba(255,255,255,.25) 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;
}

Remember, this is a work in progress and is not reflective of the final UI. And remember to disable it when the patch finally does get committed!

So I really liked some of the app button concepts that are being considered for the final release of Firefox.

Stephen Horlander even added patch code in bug 574681 to make it look like this:

post-173518-12834977372977.png

Which everyone on Bugzilla seems to like. I do too! So I've created a style out of it!

Remember, this is a work in progress and is not reflective of the final UI. And remember to disable it when the patch finally does get committed!

Very nice but I'm not a fan of the inactive button style.

Very nice but I'm not a fan of the inactive button style.

You can remove it entirely by just removing the block of code marked by -moz-window-inactive

Previous button iterations haven't had this kind of effect. It takes a while to get used to, but I don't really look at inactive windows too hard anyway.

If it really bothers you, why don't you sign up at Bugzilla and make a suggestion? Maybe it'll make it into the next patch!

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

    • No registered users viewing this page.
  • Posts

    • If its the devs fault you would think Unreal would help M$ take full advantage of Unreal and work with them to fix the performance issues. Otherwise they are catching unwarranted bad press.
    • Thanks for the advice guys, I'll give my current GPU a clean and then run the benchmarks to see how similar it is. Hopefully a bit of a clean-out will help it last a bit longer.
    • Pretty sure those will still be in this game. The series' well-explored psychosis themes will return as well.
    • "performance issues? what performance issues?!"
    • Microsoft making much needed change to Windows 11, 10 Patch Tuesday security updates by Sayan Sen Recently, Microsoft delivered its latest Defender patches for Windows 11 ISOs. These definitions are released from time to time alongside the general security updates available during Patch Tuesday. Speaking of Defender, the company has now announced another important change that affects how security updates are delivered to enterprise devices running Windows. According to a recent announcement, Microsoft Defender for Endpoint's endpoint detection and response (EDR) updates will no longer be bundled with the monthly Windows security updates or Patch Tuesdays. Instead the company is shifting delivery of these updates to Microsoft Update, bringing EDR servicing in line with several other Microsoft Defender components. If you recall, Microsoft last year moved PowerShell updates to Microsoft Update (MU) as well since it provides automatic updates for Microsoft products and services. Thus the move is intended to allow Microsoft to deliver EDR improvements and security enhancements independently of the OS's regular monthly update cycle; this should enable faster deployment of protection updates without requiring organizations to wait for the next Patch release. For those unfamiliar, Microsoft Defender for Endpoint's EDR capabilities are designed to help organizations detect, investigate, and respond to advanced threats across managed devices. Keeping these components updated is critical for maintaining protection against evolving attack techniques. The rollout has already began for Windows 10 devices in late May 2026 (last month) and Microsoft says it will gradually expand support to Windows 11 and the remaining supported Windows versions over the coming months. The company expects deployment across Windows 10 and Windows 11 to be completed by fall 2026 or around Q3 of this year. Once the transition is complete, EDR updates will be delivered through Microsoft Update using KB5005292, provided the required prerequisite updates have already been installed. Microsoft is also introducing a new Defender Update Service as part of the change. Following installation of the first update, devices will automatically create a new directory located at %ProgramData%\Microsoft\Microsoft Defender\Defender Update. Microsoft notes that restarts may occasionally be necessary in case of "rare" failure scenarios. For most organizations, the tech giant says no action will be required as long as Microsoft Update is already permitted within their update management strategy. Admins who rely on manually deployed update packages, however, will need to adjust their processes to ensure the new Defender update package is included. Microsoft also recommends reviewing internal documentation and notifying helpdesk and security operations teams about the updated delivery mechanism to avoid confusion during the transition. As a prerequisite, the tech giant notes that systems must be running Sense version 10.8798.25857.1000 or later and have one of the following Windows updates (or later) installed: Win11 24H2 KB5062660 (2025-07 Cumulative Update Preview) Win11 23H2 KB5062663 (2025-07 Cumulative Update Preview) Win11 22H2 KB5062663 (2025-07 Cumulative Update Preview) Win10 22H2 KB5062649 (2025-07 Cumulative Update Preview) Win10 1809 KB5063877 (2025-08 Cumulative Update) Server 2019 KB5063877 (2025-08 Cumulative Update) Server 2022 KB5063880 (2025-08 Cumulative Update) Server 2025 KB5063878 (2025-08 Cumulative Update) As always, organizations should verify that their update policies align with the new servicing approach before the broader rollout reaches all supported Windows platforms later this year. In case of major problems, the EDR update can be rolled back to the inbox version stored in %ProgramFiles%\\Windows Defender Advanced Threat Protection (ATP) using: MpCmdRun.exe -RevertMde -Product Edr -ToVersion Inbox For those who have access to the Microsoft 365 Admin Center portal, you can view the message here under ID MC1381119.
  • Recent Achievements

    • One Month Later
      DJC50PLUS earned a badge
      One Month Later
    • Week One Done
      DJC50PLUS earned a badge
      Week One Done
    • Proficient
      Eric Biran went up a rank
      Proficient
    • Dedicated
      Conjor earned a badge
      Dedicated
    • Week One Done
      Windows Guy earned a badge
      Week One Done
  • Popular Contributors

    1. 1
      +primortal
      493
    2. 2
      PsYcHoKiLLa
      248
    3. 3
      Steven P.
      73
    4. 4
      +Edouard
      69
    5. 5
      neufuse
      68
  • Tell a friend

    Love Neowin? Tell a friend!