Giter Site home page Giter Site logo

Comments (9)

Izheil avatar Izheil commented on August 12, 2024 1

Well, I checked it before I tried to see if I could do something similar to another issue like this that happened when having just one row with only pinned tabs without any luck, but I decided to take another look to see if I could do something different, and looks like this time it's working right (at least with the 16px sizing you were using on the example).

I added the updated version to the repo, so you should now be able to do the same changes you did before and they should work without creating an empty row.
I'll recompile the patchers in a little while, so if you want to update now, get the multirow files from the multirow tabs folder.

You will need to uncomment the lines related to buttons padding for smaller tabs for them to apply, so instead of:

    /*  These below control the padding of the new tab button and min/max/close buttons respectively.
        YOU DON'T NEED TO CHANGE THESE unless you want to use values of --tab-min-height lower than 20px. 
        Before changing them, you need to UNCOMMENT the 2 rules below for them TO TAKE EFFECT. */

    /*
    #TabsToolbar {
        --toolbarbutton-inner-padding: inherit !important;
    }

    .titlebar-buttonbox .titlebar-button {
        padding-top: 8px !important;
        padding-bottom: 8px !important;
    }
    */

Once uncommented and changes made it should look like:

    /*  These below control the padding of the new tab button and min/max/close buttons respectively.
        YOU DON'T NEED TO CHANGE THESE unless you want to use values of --tab-min-height lower than 20px. 
        Before changing them, you need to UNCOMMENT the 2 rules below for them TO TAKE EFFECT. */

    #TabsToolbar {
        --toolbarbutton-inner-padding: 0 !important;
    }

    .titlebar-buttonbox .titlebar-button {
        padding-top: 4px !important;
        padding-bottom: 4px !important;
    }

The reason why it's commented by default even when they have the default values that Firefox uses is that those could cause issues in different OS's, since not all of them have the same padding around the min/max/close buttons, and the inner-padding isn't really needed to be changed unless you want more compact tabs.

from quantum-nox-firefox-dark-full-theme.

Thrakk avatar Thrakk commented on August 12, 2024 1
        css +=`
		#tabbrowser-tabs > arrowscrollbox {
		  overflow: visible; 
		  display: block;
          height: var(--tab-min-height); }

You found the bugger. Everything works better than ever now.

from quantum-nox-firefox-dark-full-theme.

Thrakk avatar Thrakk commented on August 12, 2024 1
 // This is a fix for FF89+ (Proton)
        if (document.documentElement.hasAttribute("proton") || tabsHavePadding) {
            style.innerHTML += `
            scrollbox {
                max-height: 40px !important; //calc((var(--tab-min-height) + 8px) * var(--max-tab-rows));
            }
            `;

I changed max-height under the FF89+ (Proton) section and it fixed my issue

from quantum-nox-firefox-dark-full-theme.

Izheil avatar Izheil commented on August 12, 2024

The inner padding variable isn't intended to be changed, which is why it says "you don't need to change this", and also why there isn't any explanation of it on the instructions above that fragment.

20px is the minimum height on the --tab-min-height variable that won't give you any trouble as far as you have compact mode enabled on about:config, which is already quite small.

Editting past that would require many more fixes than just the padding, like changing the favicon sizing, the close/max/min buttons which would keep the size of the tabs row bigger than the tabs, and eventually needing to change the font size.

I don't see much reason to implement that, given that 20px already gives enough small size, and that I'd have to add too many alterations for each range of size that people wanted to add.

Either way, I'll add the clarifications on the details of multirow tabs.

from quantum-nox-firefox-dark-full-theme.

Thrakk avatar Thrakk commented on August 12, 2024

Thanks for responding. I do like how compact everything is already. I always use [menu bar / bookmark toolbar items] as one row, and I magnify everything in Windows to 150% because of my eyesight / laptop screen size.

I checked and 150% is 28 pixels larger than 125%. Maybe you get why I like Firefox to be extra compact. Things are pretty good the way I have them so I will keep the empty row and 16px min height. Thanks for keeping the multirow script up-to-date!

from quantum-nox-firefox-dark-full-theme.

Izheil avatar Izheil commented on August 12, 2024

Glad it's working good for you now!
Since it's fixed, I'll close this then.

from quantum-nox-firefox-dark-full-theme.

Thrakk avatar Thrakk commented on August 12, 2024

UNTITLEDGIF
Is it possible to make it so the scrollbar doesn't add height when it shows up (it shows up when I have more tabs than what fits in my my max rows)?

from quantum-nox-firefox-dark-full-theme.

Thrakk avatar Thrakk commented on August 12, 2024

I should also report something else I noticed on my setup. When you use the middle mouse wheel to scroll tab rows, it often wouldn't work (ie scrollbar frozen) depending on what I had for 'browser.tabs.tabMinWidth' and the amount of varaible-width tabs I had open in the bottom row. I fixed this issue by messing around with the size of the new tab button (+ sign) and its margins.

Example custom code I'm using for the fix (some of it is cosmetic):
#tabs-newtab-button.toolbarbutton-1 .toolbarbutton-icon { border-radius: 0px !important; width: 22px !important; height: 22px !important; padding-top: 2px !important; padding-bottom: 2px !important; padding-left: 2px !important; padding-right: 2px !important; margin-left: 4px !important; margin-right: 4px !important; margin-top: 0px !important; margin-bottom: 0px !important; }

from quantum-nox-firefox-dark-full-theme.

Izheil avatar Izheil commented on August 12, 2024

I guess you mean width for the scrollbars, but that's part of how the scrollbars render automatically. If you don't want the scrollbar to take any height, you will have to change the scrollbarSize variable on top of the file to "none", which will keep scrollability, but will hide the scrollbar completelly.
The reason why they add some more height to the visible rows is because the --max-tab-rows variable uses the value of --tab-min-height to calculate how many pixels should it show. Since your display is over 100%, you will have to play around with the --max-tab-rows to get the row size right.

As for the middle mouse button issue, I can't seem to replicate it, but if someone has your same setup and has that issue, I'll send them to your fix post.

from quantum-nox-firefox-dark-full-theme.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.