Firefox Sidebar and Vertical tabs: try them out in Nightly Firefox Labs 131

[asafko]

Hi folks,

Vertical tabs and a new sidebar experience that make multitasking and context-switching easier are now available in Nightly 131. To try them, update to the latest Nightly and go to Settings > Firefox Labs, and activate the Sidebar and Vertical tabs experiments.

After you do this, you will be able to see the new sidebar, but you will still need to add the sidebar icon to the toolbar to be able to expand vertical tabs. Click Customize toolbar in the toolbar right-click menu, and drag the sidebar icon to your toolbar. This is a temporary situation, and in the future the icon will be added to the toolbar automatically. 

A few things to keep in mind:

• This work is still very much in progress and has some rough edges, functionally and visually. You’ll see us improve and polish things over the coming months.
• We will be sharing our informal backlog of improvements in this post today, so you can get a sense for where we ultimately want these features to be.
• To design this first version, we conducted extensive research, talked to many Firefox users to understand their multitasking and context-switching needs, and prototyped extensively to find the best solutions to address them.

What we’re putting out there is something that we believe will help the majority of people using Firefox achieve their day-to-day tasks. We know there is no perfect solution for everyone and welcome your feedback to shape the direction we move forward in.

[cabeto]

To close a tab you need to open the panel or right-click and hover till close option, which is somewhat annoying.

I don't see any problem if you follow the UI of MS Edge. It's already more mature.

[3_pocket]

Vertical tabs looks good but def needs and option the Auto Collapses when not being hovered over such as the video I took from Edge Vertical tabs

[Tokken7749]

i like vertical tabs a lot but please integrate an hover option to open an close the sidebar by hovering. Add an shortcut to open/close the sidebar And also add an option to group open tabs like the arc browser.

[Erwan]

After testing, for the moment, the "Tree Style Tab" extension is more efficient and advanced than the Firefox version. Maybe you should take inspiration from it?

We still cannot:

• adjust the width of the window manually.
• group the tabs with their "child" tabs.
• the parameters and customization are very limited.

[rahaaatul]

Search results are hidden behind the window in vertical tabs mode. See horizontal mode:

Really love the UI though.

[D0m1n1c]

Just came back here to report exactly the same bug ! 👍

[D0m1n1c]

Nightly build 133.0a1 october 4 2024, search results was fixed, but still have an issue. The bookmarks in the Bookmarks bar (only the text) still sit over it...

[Stryder]

I'm coming from Wavebox which has a lot of features in regards to the sidebar and I've been looking for a replacement that's more security focused.

If we could get the ability to create groups and or folders on the vertical sidebar to sort our tabs into, and then the ability to rename tabs in the vertical sidebar I'd be set!

Some not needed extras of being able to change the folder or group icon and maybe add some color, so Tab Group 1 could be red, and tab group 2 be in blue. For quicker finding of what you need that'd be sick!

As well as resizing the sidebar on the fly which a few others have mentioned as well ❤️

[D0m1n1c]

Groups and folders... Like as I already said in this topic : why not bring the Collections on mobile app to the desktop ? And sync them like opened tabs. I did a reset of my phone last week and lost my collections on Android (they are not sync).

[Pfize183]

Since todays update 133.0a1 (2024-10-03) there is to much wasted space.

[D0m1n1c]

Agree. I reported exactly the same thing some hours ago... 👍

[Pfize183]

In split screen mode it looks really bad. All the icons merging together.

[Octavio]

Really loving the new unified toolbar from today's update! Although i did notice the width of the sidebar does not match the height of the top bar, making it look off, specially in compact mode (although i know it's not a "supported" mode).

I know width control will come eventually, but i hope it matches the height of the top bar by default in the future.

[D0m1n1c]

Oh, big change today. The Nightly version of October 3 broke my custom CSS code that hid the top bar. It's now natively merged with the toolbar. Good job team !!!

I have 3 suggestions :

Add more padding to the bookmarks bar, it's really too thin.

Then, the spacing between right buttons and the toolbar buttons seems too big, I think it should be smaller.

Also, your default dark theme should be modified to makes the address bar more distinct from the rest of the toolbar. I changed it to another theme. The difference is not big, but...

Your theme

And with a theme called « Dark Grey Theme (WebExtension) »

[sartori-diego]

the space you mentioned appears after enabling vertical tabs, is there any way to remove it; version 133.b1. thanks in advance.

[Pfize183]

You should update your nightly. Today (depending on your timezone) we received Nightly 134. But I have to disappoint. This waste of space is still there.

[D0m1n1c]

Another suggestion : remove the outline (gray border) around the content Window. I dont think it is useful ! Refering to #tabbrowser-tabbox. I customized this with userChrome.css (would be interesting to have rounded corners like Floorp fork or Microsoft Edge) :

#tabbrowser-tabbox {
outline: none !important;
padding: 6px !important;
}

[Srivathsa_97]

Thanks for developing the vertical tabs option.When we enable verticle tabs. we when try to type or seach in the URL. Its going underneath the tab

here are the screen shots

[Srivathsa_97]

Please make it work like this Devs

[GazirovanayaVod]

same issue

[haingdc]

It's normal. If you' re in Nightly build. Lol

[Srivathsa_97]

😓

[TomLi]

I have also ran into this problem😂

[Srivathsa_97]

😂

[TomLi]

Subject: Issues with Address Bar and Feature Suggestion for Vertical Tabs Mode

Dear Firefox Nightly Team,

I’ve encountered a couple of issues and have a feature suggestion related to vertical tabs mode:

1. When vertical tabs are enabled, the address bar panel becomes semi-transparent, making it difficult to read the text clearly. Additionally, the usual suggested results and predictions that appear while typing in the address bar are not showing up, which significantly impacts the browsing experience.

2. I would also like to suggest adding a feature similar to Microsoft Edge, where the sidebar automatically expands when the mouse hovers over it for a certain period. This would enhance navigation without requiring manual clicks to expand the sidebar.

Thank you for your attention to these matters, and I appreciate your continuous improvements to Firefox Nightly.

Best regards,

Tom Li

[N2ezr]

Recently, Nightly changed the behavior. Now, when you enable vertical tabs, the tabs toolbar disappears and all buttons from it move to the navbar.

This is definitely cool, but I would really like to be able to leave the tabs toolbar without tabs. Just as an additional toolbar. Even if it's a secret setting via about:config, still. This would be an incredibly useful feature for css theme creators, so please hear it

[Jinn]

Autohiding on hover is a must ❤️ (preferably overlapping the browser content, not pushing it to the side)

https://imgur.com/a/gq0zfNA

[Octavio]

Personally, i prefer content to be resized as it is now, never liked overlayed sidebars. I guess there are advantages and disadvantages to both ways.

[XCanG]

The main issue with that solution that it LAGS, because whole page overflow each time you hover on tabs and it shift content no matter that, so you can't really read anything on page unless you are at very top of the page. Whether it text that has to fit in smaller width or, say, site with image grid that have may be 5 columns and on hover it remove one, so that there only 4 columns and everything shift. It is bad in many ways because of this.

[madefade]

Was just about to say the same. Sidebar currently resizes the page which I find jarring. Overlay would take care of that. That and hovering over the sidebar for tabs plus a keyboard shortcut would be top notch.

[Jinn]

It can be done when the the vertical tab bar (#sidebar-main) is positioned as a fixed element actually. But it requires manipulating userchrome.. which could be an unnecesary hurtle for the (majority?) users of the feature who just want it baked in.

I think the developers are just settling on a preferred way to do it. So until then, hopefully.

[Pfize183]

Do you have the css code for this?

[Jinn]

Tonight sure, I'm at work atm

[Jinn]

So my time is very limited between the work I do on this theme of mine and work, what I'll do is provide you the link to the source, and you can browse this file that contains everything related to the vertical tab modifications: https://github.com/soulhotel/FF-ULTIMA/blob/update/theme/all-global-positioning.css

This is what it looks like at the moment on nightly 133.0a1. And this is specifically the "Update branch" source for the theme. Not the main branch or 1.9 release: https://vimeo.com/1016613527?share=copy

And this is a demo of auto-hiding, while overlaying content rather than pushing it to the side: https://imgur.com/a/jHFz5Uq

lines 385-410 are the auto-hiding section for vertical tabs, this implementation keeps the same positioning for the sidebar, and pushes content to the side like default behavior.

Above that I have a greyed out section for my 131 implementation that worked with animation, but it only worked very briefly with some clipping.

In lines 412-449, I have auto-hiding for vertical tabs with the fixed positioning I mentioned before, they overlay the browser content rather than pushing it to the side. It's essentially a copy of lines 385-410 with basic forced positioning.

Either way most of this is hacky, and it's mostly just a demo and attempt to work within the ongoing changes with each Nightly update, I do believe the Firefox Developers are actively listening and considering the comments in this post/discussion.. so while things seem to break with each Nightly update, I'm hopeful that they will have auto-hiding implemented themselves in the near future. So cheers.

[Pfize183]

Thank you so much. I'll test this later. Right now I'm at work 😖

[madefade]

I agree. Userchrome is a very useful tool for customising the ui (not sure what other tricks can be  pulled off with it) but it's like you said. A hurdle for most users and the chances of it breaking in a future update.

[halmai]

I am very happy with the native sidebar feature, thank you for working on it. However, I am migrating back to Firefox from Vivaldi and one feature is missing for me.

If the title of a tab is too long then I cannot see the end of the title. I liked in Vivaldi that I was able to drag the vertical divisor line between the tabs and the windows to give more or less space to the tabs, however I wanted. It would be nice to have this changable width feature in FF as well. 

At the same time, I relaly love the toggle button in FF, which I didn't have in Vivaldi. Good job, guys.

[halmai]

The sidebar is resize-able now. Thank you guys, I love this.

[00FF00]

im not sure if this is already mentioned here or not, or if there is already a way to change it in about:config (but it should be enabled along with vertical tabs anyway) but i like how you can pin tabs to the top of the vertical tabs side bar, and that looks great, but even with only a couple tabs open the new tab button should be at the bottom of the tabs i think... or maybe the new tab should be added to the top (aka, left) of the list of tabs.

it isnt so bad with only a few tabs open, but when you have enough to where you need to scroll to navigate them, it is kinda of... not really 'disorienting' but close enough i guess, to click "new tab" then have to scroll to the bottom to switch to it (assuming you dont have it set to switch to the new tabs automatically.. how do you guys keep this all straight lmao)

so, the thing that makes me think of is if you DO have a lot of tabs open, and you DO have the new tab page at the bottom of the list, then... you have to scroll to get to that button. so maybe also having it in the regular UI like it was... oh, im the one that removed that when i enabled the vertical tabs. well yeah. maybe having it in two places is the way to go.

i guess not really sure the best way to go about it, but it seemed worth mentioning. let me know if any of this was unclear and ill add some screenshots or a screen recording since i know i explain things a little strangely sometimes