Move bookmarks to tab bar like firefox can?
-
Hi, I'm new to modding Vivaldi and I would like to recreate the way my Firefox looks when moving over to Vivaldi.
I'm trying to figure out how I could move my bookmarks up to the tab bar the same way I have them in my Firefox.
like this:
With Firefox I can just drag and drop the bookmark bar element up to the top and turn the bookmarks bar itself to always hide and its done. I assume with Vivaldi I'll need to modify the CSS code for the interface?
Thanks to anyone who can help!
-
Try this
js
filesetTimeout(function wait() { function bookmarksBarStyle() { const style = document.createElement('style'); style.type = 'text/css'; style.innerHTML = ` .bookmark-bar-top .bookmark-bar { margin-right: 135px !important; max-width: 35vw !important; } .bookmark-bar-top .bookmark-bar, .color-behind-tabs-off .bookmark-bar button {background-color: transparent;} `; document.getElementsByTagName('head')[0].appendChild(style); }; const tabbar = document.querySelector('#tabs-container.top'); const bookmarksbar = document.querySelector('.bookmark-bar-top .bookmark-bar'); if (bookmarksbar != null) { tabbar.appendChild(bookmarksbar); bookmarksBarStyle(); } else { setTimeout(wait, 300); } }, 300);
Notes:
You can adjust the size of your bookmarks bar, I chose a dynamic size but you can make a static one if you prefer by changing themax-width:
to another valueIf you don't know how to load custom files, look HERE
-
@sjudenim Thank you! It mostly works great! However I am having one problem it will randomly decide to collapse into a small button with arrows like this:
I've tried messing around with the widths and stuff but I cannot seem to figure out why it does this.
I delete the custom.js and remake the file with the exact same file contents. And it goes back to normal for a little while and then it does this again. -
I'm not able to reproduce your issue. I've updated the code with a fix for the background transparency.
-
@sjudenim Thanks so much! It works perfectly and I was able to solve the collapsing problem by changing max-width to width.