CSS mods to improve and clean UI

FoxieFox

This is a collection of my and other authors' useful CSS mods to improve and clean up the interface of Vivaldi browser.

Download: https://github.com/JoyHak/Vivaldi-CSS-mods/archive/refs/heads/main.zip

hide_UI by rafaell0:

auto-hide address bar (mainbar) and move the page loading progress bar beyond mainbar.
hide_tabs by supra107, R0STEFAN:

auto-hide the tab bar and display on mouseover.
minimize_tabs by nirin, masashinogawa, nafumofu:

minimizes the tab bar into rows.
clear_UI by rafaell0:

сlear the interface of unnecessary stuff.
svg_extensions_icons by rafaell0:

monochrome svg icons for extensions. Resets when the contents of the toolbar are changed. If u want true mono/colored icons: https://github.com/JoyHak/customize-vivaldi-buttons
expand_bookmarks by nafumofu:

This mod allows you to expand and collapse folders in a list, such as bookmarks, with a single click

FoxieFox

It was quite difficult to find working and good mods that would allow you to hide the interface when the mouse is absent, remove scrollbars, etc. That's why I wrote my own mods, found useful mods by other authors and gathered everything into a single collection!

ThePfromtheO

This project isn't stable, right?
Thank you!

ThePfromtheO

This post is deleted!

FoxieFox

@ThePfromtheO this project has been fully tested and completed. Everything is working as it should

ThePfromtheO

@FoxieFox Thank you! Please don't mind, I think it's understandable to be afraid of trying on your own something newly created...

bestarrd

Guys, I have a regular bookmarks bar at the top. How can I hide it in the active tab so that it only appears in the new tab?

Zalex108

@ThePfromtheO said in CSS mods to improve and clean UI:

@FoxieFox Thank you! Please don't mind, I think it's understandable to be afraid of trying on your own something newly created...

None of those are new,
Click on them, you'll see the dates, testers and updates.

--

The only downside are codes missing the identifications on top as appear on those 2 of the 6:

Dev
Action
Date
Link

All those are difficult to track, so that info has to be added by all the end-users.

I always suggest to add that data.
To its Devs, too.

FoxieFox

@Zalex108 some of them are new marked "by rafaell0". I've written them in recent months.

FoxieFox

@bestarrd

How can I hide it in the active tab so that it only appears in the new tab?

https://forum.vivaldi.net/topic/95511/overlay-bookmark-bar/9 (best)

https://forum.vivaldi.net/topic/102950/auto-hide-bookmark-bar-toolbar-sidebar-unless-hovered-over

https://forum.vivaldi.net/topic/34672/auto-hide-bookmark-bar/

bestarrd

@FoxieFox I'm trying it for the first, it seems great so far. But I am skeptical about such things. But since there is no other way out, what can we do?
Thanks
Damn, the forum interface is as strange as the browser itself

Zalex108

@FoxieFox said in CSS mods to improve and clean UI:

@Zalex108 some of them are new marked "by rafaell0". I've written them in recent months.

Hi,
Would you post them on the Forum?

Many a times, there are breaks between V Updates and the best place to get info about is the Forum.
Even some other uses would improve the code.

On the other side,
The Forum would be easier than GitHub for some users.

FoxieFox

@Zalex108,

Would you post them on the Forum Many a times, there are breaks between V Updates and the best place to get info about is the Forum.

I shared a link on GitHub as a backup in case of any issues with V updates: all mods changes will be available immediately via the link in the header. It's inconvenient for me to update both GitHub and the forum

Even some other uses would improve the code

I would be very happy to see code suggestions on any platform. Perhaps the best way forward would be a discussion here and a link to the release version in the header.

Zalex108

@FoxieFox said in CSS mods to improve and clean UI:

Perhaps the best way forward would be a discussion here and a link to the release version in the header.

Yes,
This would be a way to have both infos.

FoxieFox

@bestarrd

But since there is no other way out, what can we do?

There is no need to write a new mod. I suggest you use the search in the Modifications category.

FoxieFox

@Zalex108

@FoxieFox said:

Perhaps the best way forward would be a discussion here and a link to the release version in the header.

Yes,
This would be a way to have both infos.

Well. I would be very grateful for some assistance with automation/autohotkey script. I have two versions of the scripts now: Personal and Public. The Personal version goes through a transformation, after which I upload it to GitHub via a browser. After that, I have to copy it and send it here.

Zalex108

@FoxieFox

Maybe someone knows and is interested on that.

Lunarie

I have a bit of an issue here.
I have the panel toolbar and tab bar on the left side and while using the hide tab bar css the tabs seem to be hidden by the panel bar. If I hide the panel bar, tab bar shows normally.

FoxieFox

@Lunarie said in CSS mods to improve and clean UI:

I have a bit of an issue here.
I have the panel toolbar and tab bar on the left side and while using the hide tab bar css the tabs seem to be hidden by the panel bar. If I hide the panel bar, tab bar shows normally.

If you mean that the tabs appear, but there is a toolbar on top of them, then you need to add Z-Index = 12 property in the tab bar css settings: https://github.com/JoyHak/Vivaldi-CSS-mods/blob/724600e76d2020cc21f0aee7c83ac18d5f096e99/hide_tabs.css#L37

adagioni

Thank you! This is exactly what I have been looking for! The auto-hide bar mod works great!