@texbates The button is an SVG, so it is a bit harder to style exactly how you want it.

You could approximate the look you are going for with something like this:

.toolbar-tabbar .newtab > button svg { transform: scale(2); fill: #333; }

The border-radius would be slightly off and the scale factor might need tweaking, but it is a starting place.

The other option is to replace the path of the SVG with a plain "+" symbol and then style the background of the container that holds the SVG to have the parameters you want.

I could help with that if you want, but I would need your other tab bar CSS mods to make sure everything was lining up correctly.

@tam710562:

I can't reproduce your issue.

I uninstalled then reinstalled your javascript, relaunched Vivaldi, and now it does not misbehave anymore.
Thanks for your help and patience.

Bild Text

Thank you very much!

I had given up on this functionality!

@hiil Pls search the forum for solution.

Unfortunately there are no one size fit all CSS solution for Vivaldi, because Vivaldi is too flexible & have too many possible combination of toolbar setup. Thus, you have to deal with each toolbar one by one with various CSS mod.

@vivekkrishna I am just a mechanical engineer that thought it was a good idea to add a computer science major to my coursework at college "for fun" (was not fun); I am not an expert by any means.

Being a programmer involves being good at searching for stuff online. I spend half my time on coding projects looking at StackOverflow, JSFiddle, CodePen, or GitHub. You try something, break it, search up errors to better understand how it broke, looking up better ways to solve it now that you have better vocabulary to describe the issue, then try and adapt what you found to make it work for your application. Then slowly over time you become better at solving the problems you encounter without needing to search online for solutions.

I don't have any specific tutorials to suggest. Just do a search and see what you find. For the actual deployment, many hosting providers have instructions for how to set up some popular methods on their services.

@vivekkrishna said in Show Quotes on New Tab:

some people say that focus on any one role like web developer or python developer, WT do u say

I haven't ever worked in a programming job, but I can give you my limited insight.

It definitely helps to have a specialty where you are particularly proficient, but it is important to be flexible. Programming is always changing in what is relevant and useful. With stuff like web development, there is always some new framework that everyone starts using, so you have to be able to adapt and learn new things.

Employers often like to see a portfolio of projects you have worked on so they can gauge your ability to try out different technologies and learn how to use them.

Edit: And now I go to sleep. Stayed up way too late...

@dude99 I know your take is meant to be lighthearted, but that’s exactly how it played out. It’s the reason we don’t pay for this browser with ca$h, the devs feed off our pain and confusion instead. Why would you allow your users the liberty to mess with your carefully constructed program, if not to torture them.

Made an update to the mod for the new buttons experiment. This is the only toolbar icon which can’t be exchanged with the toolbar editor, therefore a mod is still needed, if an SVG icon is preferred.

@luetage gotcha. that’s the bit i was missing.

@matiasmovie said in Global Media Controls Panel:

Is there any chance that there will be a version with a window instead of a panel? (similar to the download button in the address bar)

I don't have any plans for this at the moment.

This forum, it's all here.
I don't understand anything about CSS or JS, but I've found anything i need/like here. Well, with a some try'n'error. It might need a bit of work, but if you're intrested enough...

The new snapshot 2482.13 breaks this mod. I pushed an update and it should be fine now.

@explorerthegeneral I just tested it, and other than needing to update an event handler to bring it up to date with 5.1.2567.73 (see original post for updated code), it should hibernate background tabs in all open windows.

GIF showing it working

hibernating.gif

One thing that the mod won't do is hibernate the active tab of any given window (even if it isn't focused). This is more a limitation of Vivaldi than a conscious choice I made while writing the mod. However, this behavior does make sense. Any active tab will need to be loaded again instantly, so it doesn't make much sense to allow hibernation for active tabs.

But it got me thinking, looking at the code (and I'm no coder), it looks like it could be modified to loop through all the windowId's rather than just the currently active one.

It is looping over all tabs rather than windows. The beginning section with the mention of the current windowId is for one of the config parameters. Here is a more thoroughly commented section of the relevant code to better explain it's function:

function hibernateBackgroundTabs() { // This section is needed for the SKIP_ACTIVE_TAB_STACK_TABS config parameter // ================ START ================ // figure out the ID of the active window to allow fetching the active tab vivaldi.windowPrivate.getCurrentId((currentWindowId) => { // get the active tab chrome.tabs.query({ active: true, windowId: currentWindowId }, (activeTab) => { activeTab = activeTab[0]; // see if the active tab is in a tab stack, and if so, get the stack ID let activeTabStackID = (regex.exec(activeTab.extData) || [false])[0]; // ================= END ================= // get tabs from all normal (not devTool or popup) windows chrome.tabs.query({ windowType: "normal" }, (tabs) => { // loop through all tabs and check if it should be hibernated or not based off of parameters of the tab and mod config tabs.forEach((tab) => { if (tab.discarded) return; // already discarded, so can skip it if (tab.windowId === currentWindowId && tab.active) return; // skip active tab; apparently not needed; Vivaldi already handles if (SKIP_SELECTED_TABS && tab.highlighted) return; // skip selected tabs if configured to do so // skip tabs in the same tab stack as the active tab if configured to do so if (SKIP_ACTIVE_TAB_STACK_TABS && activeTabStackID) { let stackID = (regex.exec(tab.extData) || [""])[0]; if (stackID === activeTabStackID) return; } chrome.tabs.discard(tab.id); }); }); }); }); }

@mrjimshim

For each button you pin to one side, you can just add a spacer to the other side of the Address Field to keep it centered.

Side note:
If the Address Field becomes too small for your liking you can add this bit of code (you can replace the value of 8 with one to your liking. Default is 5)

.toolbar-spacer-flexible ~ .UrlBar-AddressField, .toolbar-spacer-panel ~ .UrlBar-AddressField { flex-grow: 8; }

Let's Celebrate!!

Celebrating Syrup 's Mod.jpg

YuMmmmmm....!

Hurry up!!

Celebrating Syrup 's Mod

I made a few more improvements to the mod. One addition is the display of the age (days since last new moon) in the title.

e40458a0-0ae4-417b-8003-53598cb1764c-image.png

The second change is the ability to set the latitude in the mod, which tries to approximate how the moon might look in the sky at your location, by rotating the icon. This would be incredibly complicated to do exact, because we observe changes in the moon’s orientation while the earth is rotating (moon rise — moon set) and this is dependent on many other factors, but it gets us in the ballpark. Wikipedia provides a nice example graphic of moon phases by latitude for anyone who wants to check this out ☛ https://en.wikipedia.org/wiki/Lunar_phase#/media/File:Moon_phases_by_latitude.svg

Both the Javascript file and the SVG file for the command chain button have to be updated to the latest version (2024.6.2)

@guigirl Fair point, only shows it’s important to follow guides. But this is only valid for the hooks mod, everything else belongs beneath bundle.js. In any case, you should always test mods without any other mods running to find out whether they work for you. You cannot expect that all mods play nice together and it is impossible for a third person to determine what you should do to make everything work together without having access to your full code.

@luetage What I thought. So my small experimental extension (colored scrollbars) is probably broken due the fix of the issue plus the recent changes. Seems I have (to try) to learn few chrome APIs now 😕

@potmeklecbohdan thank you!
The custom css did the trick.

If some of you have trouble understanding where this should go, take a look at the experimental features and turn on custom css modification. In appearance settings, choose a folder of your choice, and create a new css file in it (I called mine vivaldi.css), then restart the browser.
I assume this has been covered in the forum anyway.

I don't know if this can be considered "fixed", but it is a working solution. Thanks again!

@stardepp It's a known issue. Signature mod doesn't work as expected any longer.