[Mod] Extensions in left pane and auto hide address bar/show on hover
-
For users who prefer to use Vivaldi with the address bar hidden and are unable to use extensions because of this. With this mod, the list of extensions will appear in the left panel and can be accessed from there.
To work, the address bar need to be showing on Settings.
The address bar is hidden by the mod and will show up on bottom when you hover the bottom bar.
Extension opened from left pane:
Address bar at bottom, showing on bottom bar hover
You'll need to add a CSS and JS files.
custom.css
/* list extensions toolbar icons in vertical */ .toolbar-extensions { flex-direction: column; } /* make extension popup visible on left pane */ #switch { contain: size; } /* position extension popup */ .extension-popup { left: 34px !important; top: 15% !important; box-shadow: 0px 0px 10px 2px #00000075; } /* remove top arrow from extension popup */ .extension-popup:before, .extension-popup:after { display: none !important; } /* put address bar on bottom and hide */ .toolbar-addressbar { order: 2; transition: transform .2s; position: fixed; bottom: 22px; width: 100%; transform: translate3d(0, 50px, 0); } /* reveal on hover */ .toolbar-addressbar.show-addressbar, .toolbar-addressbar:hover { transform: translate3d(0, 0, 0); }
custom.js
setTimeout(function wait() { const browser = document.getElementById('browser'); if (browser) { const toolbarExtensions = document.querySelector('.toolbar-extensions'); const addressbar = document.querySelector('.toolbar-addressbar'); const statusbar = document.querySelector('.toolbar-statusbar'); document.querySelector('.addwebpanel-wrapper').prepend(toolbarExtensions); statusbar.addEventListener('mouseover', () => { addressbar.classList.add('show-addressbar'); }); statusbar.addEventListener('mouseout', () => { addressbar.classList.remove('show-addressbar'); }); } else { setTimeout(wait, 300); } }, 300);
-
@aueidog Kinda works, address bar does not hide and extensions not always showing.
edit; after further testing. Address bar does not hide and the when the extension toolbar is toggle all extensions are all bunched up onto of each other.
-
Hey, it mostly works but makes so that you cant fullscreen anything? why would that be?
-
This doesn't work on my new version of Vivaldi:
- Vivaldi: 5.1.2526.3 (Official Build) (64-bit)
- Revision: ed719560f2dfeb6e9909a88c2d93c5307252034a
- OS: Windows 11 Version 21H2 (Build 22000.376)
- JavaScript: V8 9.6.180.21
It also breaks Vivaldi in Full Screen Mode for me as well.