izheil/quantum-nox-firefox-dark-full-theme

A customizable full dark theme for Firefox. You can also add extra functions using the CSS and JS files here apart from the theme.

quantum-nox-firefox-dark-full-theme's Issues

Synced Tabs portion of sidebar is not themed

Hi @Izheil,

Thanks for putting this theme together. I've noticed that, while the Bookmarks and History portions of the sidebar look great, Synced Tabs retains its default look. Would you consider looking into applying the theme to Synced Tabs as well?

Thanks,
Demir

Menus Now Scroll Too

I've been using Quantum Nox for a while now and (although sometimes it needs some tweaking after Firefox updates) it has always worked. After Firefox was updated to 73.0.1 all my menus seem to be trying to fit into three lines with a scrollbar too. Is this something I've done wrong or a bug?

Old scrollbars patcher no longer working

Old scrollbars method doesn't seem to work with latest firefox update (61.0). It just removes the scrollbars entirely. Removing the line from chrome.manifest obviously reverts to stock scrollbars still.

The normal method for changing scrollbars doesn't work for me, so I'm hoping there's a fix for the old method

changing min-width in MultiRowTabLiteforFx.uc.js does not change min tab width

First, THANK YOU for this! The only thing I'd like is bigger default tab width, it looks to fitting 32 tabs by default. Changing min-width (and purging the cache folder) doesn't change appearances at all.

Again THANK YOU for this extension!

Doesn't work any longer with tabs below navbar

Before Firefox 65 it was enough to add these lines to get all the toolbars into their natural order:
#nav-bar {-moz-box-ordinal-group: 1 !important}
#PersonalToolbar {-moz-box-ordinal-group: 2 !important}
#TabsToolbar {-moz-box-ordinal-group: 3 !important}

and best of all it worked with your multi-line-tabs-solution.

For Firefox 65 there are new -- much more complicated -- solutions on the net to order the bars but I couldn't manage to combine them flawlessly with your code. Main problem: the top of the web page is hidden by the tabs. And some further customizations get overridden (less important, I think I can fix these with some trial and error)

So my wish is to have some optional code (js or css) to move the multi-line tabbar below the navbar with minimal impact on other customizations I have done.

Tabs Below Causes Icons Placed on Main Menu to Wrap

Describe the bug
Using Tabs Below on Firefox 74 and Nightly to and placing any add-on icons in the Menu Bar causes them to wrap down the left side one icon at a time.

Expected behavior
Icons should display in a row.

Desktop (please complete the following information):

• OS: Linux
• Version FF74, Nightly

I've attached an image with tabs below showing the icons are wrapped from the Main Menu and another that does not have tabs below enabled and it shows the icons in a row on the Main Menu. Tabs Below worked properly with displaying a row of icons on the Main Menu with FF73 and below.

Sidebar is not themed

First kudos on great work @Izheil !!!
Everything working great after adding userChrome.css & userContent.css into the Firefox profile folder. Only thing that doesn't look part of the theme is the sidebar. They say a picture is worth a thousand words so here it goes,
Shot-301117-021845.png
It will be great if you can fix this.
Cheers!!!

No more dark scrollbar after Firefox update

Hi Izheil,

I see you're keeping at it, updating your code continuously. Let me be the one saying "THX for that"!

Now that the 1st Firefox "Quantum" updates have come and went, I noticed that the update "resets" the chrome.manifest file, which becomes 0 bytes again, because the added line
override chrome://global/skin/scrollbars.css scrollbars.css
is deleted.

Maybe it will be good to put this in your README.md, giving people a heads-up, and saving yourself a lot of work and open issues?

Adding files to profile does nothing

Hello, I have tried installing the color theme by copying userChrome.css and userContent.css to my user profile folder, but the theme is not applied.

I have tried it with FF57 and FF58-dev, to double check that I got the correct folder I even opened it in about:profiles, where the files are present.
They are located in "/home/user/.mozilla/firefox/sirgpbr9.dev-edition-default/"

Am I missing something? Thanks.

Scrollbars position not quite right

Hello,

I'm using this one on Firefox 61.0.1 / Win 10 Pro
https://github.com/Izheil/Firefox-57-full-dark-theme-with-scrollbars/tree/master/Scrollbars%20%26%20tooltips%20dark%20theme

I noticed that the scrollbars weren't placed correctly when viewing attached files (PDF) in Gmail

How can I fix this?

Thanks!

Theme does not cover the whole window/tab area

Hello,

I'm not sure if this error is related to your theme or not but you might be the right one to ask

I'm using this theme on Firefox 63.0 / Windows 10 Home 64-bit
https://addons.mozilla.org/en-US/firefox/addon/dream-of-waves/

but it leaves a white margin to the left of the FF window on my external monitor (24" Dell ST2410) (nothing wrong on my 15.6" laptop screen btw)

What could be the cause for this? Thanks!

I have all these files in my chrome folder
https://github.com/Izheil/Firefox-57-full-dark-theme-with-scrollbars/tree/master/Scrollbars%20%26%20tooltips%20dark%20theme/Chrome

userChrome.css :

/* DO NOT DELETE THIS LINE */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul");

/* This enables the use of JS external files */
toolbarbutton#alltabs-button {
	-moz-binding: url("userChrome.xml#js")}

Multirow scrollable versions

Hi,
How I can install "Multirow scrollable versions"? I copied everything like on the video (from Full theme (except scrollbars) and Scrollbars & tooltips dark theme\Chrome folders) and with MultiRowTabLiteforFx.uc.js it works fine. But when I remove it and try to use MultiRowTab-scrollable.uc.js it does not work. I still get a list of all tabs without a scroll. Just like when I use MultiRowTabLiteforFx.uc.js.

List All Tabs not working, Customize page going white, requesting 3 addons

First of all I want to say I love this theme, and please don't stop supporting it! I love the Theme colors, scroll bars, and added features. The only thing I don't use is the multi-row tabs.

The List All Tabs drop down menu on the far right hand side top part of the tab bar doesn't work. The only way I can scroll through multiple tabs is using ctrl+tab. I am using the full dark theme on Mac OS Mojave. I also use the browser's default dark theme.

I also notice the customize page is white background when I fresh start the browser, but after I choose dark theme it will stay dark until I close it and open it again. Then it is white again.

There are 3 add-ons I would love you to add support to:
Notifier for Gmail - I get some coloring using other add-on settings in addons.css
Ad Block Plus - I get some coloring using other add-on settings in addons.css
HTTPS Everywhere - I get some coloring using other add-on settings in addons.css

I also use your Privacy Badger and LastPass setting in addons.css

Thanks so much for an awesome Dark Theme. Keep up the awesome work!

Multirow tabs doesn't work on FF 66.0b4 (Win 10)

Multirow tabs doesn't work on FF 66.0b4 (Win 10).

Is this compatible with 'Firefox Color' and 'Firefox side-view' experimental features?

Hi, is this compatible with
https://testpilot.firefox.com/experiments/color https://color.firefox.com/
https://testpilot.firefox.com/experiments/side-view
Thanks.

Change the color of the text on the Bookmarks toolbar

Hello,

Thank you so much for developing this. I enjoy using it so far.!

However the text on the bookmarks toolbar is black which doesn't work well with the dark theme.

Can you tell me how to change its color to be the same as the rest?

Thanks!

Change unread tab color

How change unread tab color?

Not being able to move the window when maximized, and custom userchrome compatibility issues.

First of all Thank you for this, very nice work.

• I can move the window only when not maximized and the handle is only at the upper top left corner.

  • How can I enable moving the window when maximized?

  • How can I make it so that the handle for moving the window is available on the full range of the upper edge of the top bar?

  • What is the correct way of making it possible to move the window in maximized and !maximized state using the full range of the handler at the upper edge of the top bar (above the tabs)? (It seems that the tabs overlay the handler.)

    I remember fixing the handle availability problem like so:
    (changing from 6px to 10px)_

    #main-window[sizemode="maximized"] #titlebar{
      margin-bottom:calc(10px + var(--tab-min-height)*-1) !important;
    }

    Im not sure if that's the correct approach with your configuration.

    • Noted the above is the correct fix and put it to the very bottom of userChrome.css. The space between the tabs and end of window did not increase while playing with the value though. How do I implement it correctly?
      
      fixed by editing MultiRowTabLiteforFx.uc.jc acc. to template above also added:

    #main-window[sizemode="normal"] #titlebar
    {margin-bottom: calc(15px + var(--tab-min-height)*-1)!important}

    to have more space at top for the move handler in windowed mode.

• Then I also really like the css-hacks from here, especially the
  status_inside_url_urlbar.css. It doesn't integrate so nice color-wise, how could I optimize it to integrate in your skin a little better?

  • Tried changing black to white as suggested, didn't have the desired effect. Seems to be the overlay that doesn't integrate. Desired would be that while loading content the 'static' url is hidden and the 'now loading stuff' urls are showing in a different color, while the background stays the same color.
    
    fixed by commenting out #statuspanel-label in tooltips.as.css

• How can I achieve to integrate these two effects:
  button_effect_scale_onclick.css and button_effect_scale_onhover.css?
  
  fixed by adding the code from the files in userChrome.css in the suggested way

• How could I modify your skin to integrate toggle_bookmarksbar_with_alt.css while modifiyng the toggle hotkey to something else and also showing all rows of the bookmarks at once when toggling?

  • As advised I put the below on the bottom of userChrome.css:

     #main-window[sizemode="normal"]:not([customizing]) #PersonalToolbar{
       transition: margin 0.15s ease-in-out 50ms, z-index 16ms linear 100ms!important;
       }
  
       :root:not([customizing]) #toolbar-menubar[inactive] ~ #PersonalToolbar:not(:hover){
       visibility: collapse !important}
  
       :root:not([customizing]) #toolbar-menubar:not([inactive]) ~ #PersonalToolbar,
       :root:not([customizing]) #navigator-toolbox:hover > #PersonalToolbar {
       visibility: visible !important}

  Now the toggle does work, but when I try to click one of the bookmarks it toggles hiding them and the bookmark doesn't open. Also the bookmarks are still not multirow, but single row. Activating the code piece to activate scrolling multirow bookmarks doesn't seem change this behaviour.
  
  (see reply below regarding this one)

• Do I need to take additional steps for activating the rounded tabs than uncommenting

  .tab-background {
    border-radius: 15px 15px 0px 0px !important;
    border-image: none !important}
  
  .tab-line {
    margin-left: 12px;
    margin-right: 12px} 

  in userChrome.css?
  
  (Found that it is visible when using a different theme)

• How could I specifically set the scrollbar width globally to:

  scrollbar-width:thin

  • tried changing --scrollbars-width: auto; to --scrollbars-width: thin; in userContent.css but it didn't seem to have an effect. Note that I am already using your custom scroll bar solution and just wanted to fix the scrollbar width to be thin always. This is not so important though, I can live with it as it is.
    
    fixed by manuall editing one of the custom scroll-bar templates acc. to below suggestion.

• One last little thing would be how to make dark icons be made more visible, e.g. github icon.
  
  fixed by adding this to userChrome.css

  /* make icons glow */
  .tab-icon-image {
    background-color: rgba(255,255,255,0.3) !important; 
    box-shadow: 0 0 6px 0 #ddd !important;
    border-radius: 6px}

Linux Debian ESR 60.5

When replying to emails or composing in Protonmail online I get a all dark input area. This also happens on eBay in advanced editing in the description area. When I remove the code
/* COMMENT OUT THIS SECTION IF BROWSING LOCAL HTML PAGES */ in userContent.css
I can use the pages correctly. It then will affect a good amount of colorings elsewhere.

https://imgur.com/a/ntDLVdt

I also have issues with some add-on areas not showing text correctly. (Canvasblocker and others) This I can't track down to fix.

Multirow Doesnt´work with official Version FF 74 + Installer 1.41

The official Firefox 74 version is currently installed. The 1.41 version installed and multirow does not work with it.
Tabs below works fine ...

Tab drag and drop doesn't work

Hello,

I notice that when I have multi-row tabs, I can't drag and drop the tab to the place that I want especially between rows.

Is there any setting that I missed?

Thanks!

Closed tabs reappearing when using multirow with Tab Session Manager

I've found that if I have both the multirow chrome changes and the Tab Session Manager addon active at the same time, then when I close Firefox and reopen it, the last three closed tabs are reopened. If only one or the other is present, then this doesn't happen. Logged both here and with TSM at sienori/Tab-Session-Manager#290 (comment)

Custom scrollbars do not seem to work on nightly 63

I'm pretty sure I followed the instructions correctly to modify the scrollbars and yet the they won't change after restarting Firefox.

Some tab/link right click options disappeared?

Hi Izheil,

I'm using the 06/01/2019 update with Quantum 64.0.2 on Windows 10.
(Quantum-Nox-Firefox-Dark-Full-Theme-master\Tooltips & Scrollbar customizations\Chrome)

I see that some options such as Move tab to new private window, or Open link on new private window or Open link on new tab/window are not there anymore when right clicking on either tabs or links. How can I get them back?

Thanks!

Video guide not available

Hi,

In this page: https://github.com/Izheil/Firefox-57-full-dark-theme-with-scrollbars/tree/master/Full%20theme%20(except%20scrollbars)

The video link is not available: "You can check a video guide here." --> https://youtu.be/z0o8DatRyjk

Bookmarks Library not Dark

The bookmarks library isn't dark. Mine is white.
chrome://browser/content/places/places.xul
Any way to have a dark background for this?

Side Bar Bookmarks not colored

Hello,

Line 90 of the userchrome.css is not coloring the side bar bookmarks background to dark. I was able to fix it by adding "#bookmarks-view" to line 779 of the same file.

New tab button doesn't work after update on FF 66

Today I updated on FF66, and new tab button doesn't work, no reaction when I press it. If I delete MultiRowTabLiteforFxFF66.uc.js all work well.

After FF65 changes, fullscreen/f11 is not working (win 7)

Hi,
After the FF65 changes, fullscreen/f11 is not working (all it does is the bars move down a little), (also, in userChrome.css: "Tab bar below" you changed prev. version "#TabsToolbar" for "#titlebar" and gave it '3' ( I don' get why would #titlebar be 3 (and anyway it keeps appearing at top if enabled in FF 'customize').

(To have acces to the menu bar in fullscreen/f11 in FF64 I added at the end (a trick I found)):
/* for alt+f etc to work in fullscreen/moving mouse to the top=menubar appears */
#toolbar-menubar { visibility:visible!important; }
Thanks.

[Solved] FF 60.0.2 Can't get scrollbars to work

.../chrome
    ├── scrollbars-minimal.uc.js
    ├── tooltips.uc.js
    ├── userChrome.js
    └── userContent.css

Root files also in place at /Applications/Firefox.app/Contents/Resources/.

FF Version: 60.0.2 (64-bit)
MacOS: 10.12.6

Tried starting with --headless, hoping some error would pop up -> negative.
I don't have any experience with FF apis, so no clue where to start debugging...

Edit: Cache cleared, obviously.

How to disable dark background?

Hi Izheil,

Thanks for the quick fix for Firefox 62! However, the last update broke my Firefox settings. Before that, I just used files in the folder Scrollbars & tooltips dark theme with Firefox theme Dream of Waves. Now I have to use userContent.css & userChrome.css from folder Full theme (except scrollbars) which resulted in not-so-good looking when opening local html files.

I commented out line #71-72 in userContent.css but it made other pages look worse while not solving the problem. For example this was how GitHub looked

How can I disable the dark theme/background completely? Can you add a section in the Readme for users who are only interested in multi-row tabs but not dark theme?

Thanks!

Scrollable tabbar changes scroll when clicking on a tab other than first visible row

I've found an issue where if I have enough tabs to have a scrollable tab bar, and I click on a tab that is not in the first visible row, the tab bar rescrolls so that the row containing the tab I just clicked on is scrolled to the top of the tab bar. This is annoying because I didn't want the tab bar to rescroll.

For example, suppose there are six rows of tabs, but the scrollable tab bar only shows 3 at a time, and currently rows 1-3 are visible. If I click on one of the tabs in row 2, then the tab bar scrolls so that rows 2-4 are visible.
In this case the desired behaviour would still be to activate the tab in row 2, but for the tab bar to show rows 1-3 not 2-4.

(Obvious exception: if the tab clicked is one of the final rows, the tab bar scrolls as far down as it can. So continuing the above example, clicking on a tab in row 5 would mean that rows 4-6 are visible in the tab bar.)

Observed on FF65.0 64-bit on Win 10 1803 with all extensions disabled; using Izheil Theme features and multi-row, not theme colours. Altered CSS settings:

• --max-tab-rows set to 4
• .tabbrowser-tab min-width and max-width set to 100px

Debian ESR Firefox 60.5 eBay Buttons

I'm having issues for some time now with buttons occasionally on eBay and sites I come across sporadically. Some of the buttons on eBay have a white background until hovered on or executed and then they turn blue. There code is messed up as they have been using new code in some areas and the old coded buttons still work. The search is one button and send in private messages and a few others.

https://imgur.com/a/3UmsvQX

optional number of tab rows?

Thanks for making this, it was my last resort to get multirows back and it worked! Would be great to be able to set the number of scrollable rows (currently the max seems to be 2, and I'd like to try 3 or 4).

Multirow tabs combined with Tab bar below doesn't work on FF 65 (Win 10)

Today I updated to FF 65 on Win 10. Unfortunately the Tab bar below tweak doesn't work anymore.
I read somewhere the naming of the objects got changed.
Is there any way to fix this?

Current tab offset up

Hi Izheil,
Thanks to you and to the other members of the team for this nice job.
I have installed the version 01-02-19 (FF65) which was working well, except bottom tabs were wider than the on above rows.
The last version (03-02-19) fixes that small issue, but then the current tab (whatever the row), offsets slightly to the tab which make the whole row a little bit more "tall".
Also, every row seems a bit with more height to me (maybe I am wrong), however, I don't find where to decrease the height of all tabs, if ever possible. Could you tell me where to find it? I am not a developer but I can find my way (at least I hope).
Thanks again,
Lim.

Opening bookmark in a new tab

Hi Izheil,

I don't know if it is directly related to your coding and development, but since I use it, when I click on a bookmark (from the sidebar), it opens in the current tab and not anymore in a new tab.

Is this something that I can change in some line(s)to revert back to the previous behavior?

Thanks,
Lim.

PS: I have added a last comment in the closed "Current tab offset up" issue.

MultiRowTab MinWidth

IIRC, mltirow tabs with firefox 65 has respected browser.tabs.tabMinWidth firefox setting.

And now, on firefox 66, I've modified --min-tab-width in MultiRowTabLiteforFx.uc.js.

Is it possible to redefine --min-tab-width outside MultiRowTabLiteforFx.uc.js and not modify MultiRowTabLiteforFx.uc.js?

But it will be better to use browser.tabs.tabMinWidth for --min-tab-width.

UserChrome.css in CSS tweaks has duplicate lines

Hi,

the file userChrome.css has duplicated lines.
Lines 50-61 match with lines 63-74.

[BUG] Multirow Installer is flagged by norton as a virus

I am unable to run version 1.4.2 as norton flags it as a heuristic virus and does not let me run it.

Change color visited link on firefox ?

How change color visited link on firefox ? Not website link, firefox link like SS :

Thanks in advance for your help!

The theme is broken in the latest nightly

Directory "startupCache" is no longer in the profile directory on Mac

Saw this in 61.0.2

So what do I delete now to get changes to the js files to be picked up?

Firefox Quantum Dark Theme - some additions?

Hi Izheil,

First of all, thanks for the chrome beautifications of the new Firefox 57 (Quantum)! I too missed my fully themed Firefox dearly (had Stefano Rossellis brilliant FT Deepdark before). Your code /collection certainly made Firefox more pleasing to (my) eyes again!

Trying to help making this better (since Moz obviously won't ☺), I think I might have some additions for you:

• When I put your .css to work and opened the bookmark menu on the toolbar (with the icon after the URL bar), the standard "Bookmark menu" icon (star with space symbol underneath it) appeared where normally the standard arrow icon used to be. I solved this by adding this line to userChrome.css, removing the icon completely: #BMB_bookmarksPopup .panel-arrow {display: none !important; }
• In addition, the bookmark pull down menu had a think black border around it which also had a pretty big margin around it. To solve this I added:#BMB_bookmarksPopup .popup-internal-box, .panel-arrowcontent {border-radius: 1px !important; margin: -.1em !important;}
• I noticed that your code still keeps the tabs above the URL bar. I moved them (rather old fashioned, I know) to be placed below the URL bar with:#TabsToolbar { -moz-box-ordinal-group: 10000 !important;}
• Finally, and I know this is a personal preference, I defined the (mono) font of the URL bar text. This might be helpful to prevent URL spoofing (e.g. goog1e.com). For that, I added:#urlbar { font-family: monospace !important;}

BTW, I noticed that your code doesn't change the appearance of RSS pages. Did you run into something for that too by any chance? I tried it several times, but have been unsuccessful there ☹

Thanks again for sharing the code! I certainly helped me making Firefox more appealing (again)!

Linux Debian Conundrums

Izheil,

O/S Debian 9.5 Firefox ESR 60.2.2 64bit

1. The Mozilla add-on pages and others are not colored.

2. The sub menu's expand and contract.

3. Clear Recent History is not colorized.

Screenshot:
https://imgur.com/a/oXx6Fzy

userChrome.css (colors):

https://gist.github.com/DebSec/05cf9c960203de391c11861fd7832ef3

useContent.css:

https://gist.github.com/DebSec/b561633bc0499c0c4ec716f9119a0ea1

Color of Context Menu's left edge not changing colors

Hi!

I just started using the code and I noticed that the left edge of the context menus is still white:

Same if I open anything from the Menu Bar:

These are actually not very disturbing, but I have a lot of bookmarks, and if I click on the "Show more bookmarks" button, the whole list shows with white edges:

Am I overlooking something in the code or someone else is experiencing the same issues?

Highlight Color Every Other Line

In the about:config and the bookmarks library I have highlighted colors every other line. I'm using the full theme and I'm having issues tracking down what to change to have it with no bright colors. I believe it is in the usercontent.css

https://ibb.co/jGK7o0
https://ibb.co/g3ekaf

Problem with uBlock element picker mode

Whenever I enter this mode, seems that the overlay makes things hardly readable. Here is the screenshot:

I did some research and it seems that "@-moz-document url(about:blank)" in the userContent.css is the cause of this problem, but I'm not so sure, hope that you will take a look into this.

Thank you so much for the hard work!

Editing chrome.manifest = crash

I edited my chrome.manifest file with the single line required to be able to modify the scrollbar, and the browser just crashes repeatedly until I undo my modification and make it blank again. I am using Firefox 57 on Windows 7, so I don't know what could be the issue.

Also, how do I change the color of text boxes? On certain sites, the grey text box clashes with the black text that the site enforces, making it hard to read.

Certain Context Menu elements missing

Hello, I've used this theme for months and updated it only a couple of days ago after a Firefox update reverted the scrollbar and made the address bar white again. After installing, I came to notice that the context menu was missing certain elements that I really miss. I've made an image comparing the menu when I click on a video thumbnail in Firefox without the theme (safe mode) vs Firefox with your theme.

http://puu.sh/AUgEQ/2ad736fd70.jpg