Add quick menu icon in status bar

[anaskhan]

Add a quick menu icon in status bar so that I can open it with one click without keyboard shortcut, and then use the options using just the mouse.

[Pesala]

@anaskhan What do you mean by the Quick Menu?

Do you mean the Quick Commands dialog? If so, you add that as a Quick Command button.

[anaskhan]

@Pesala Yes, quick command; how do I add that to status bar?

[stardepp]

@anaskhan said in Add quick menu icon in status bar:

@Pesala Yes, quick command; how do I add that to status bar?

wait 5 minutes and I'll send you a video tutorial.

[stardepp]

@anaskhan

[anaskhan]

@stardepp Thanks, it worked, I also added another one for settings but both are showing same icon; is there a way to change the icon for different items?

[Pesala]

@anaskhan The Sync icon already opens settings, so you don't really need another button.

[stardepp]

@anaskhan said in Add quick menu icon in status bar:

@stardepp Thanks, it worked, I also added another one for settings but both are showing same icon; is there a way to change the icon for different items?

Yes, that is also possible, I'll create it for you in a moment, wait 5 minutes again please.

[stardepp]

@anaskhan Use this .css code:

/* Quick commands on Statusbar - made by Stardepp  on the Vivaldi Forums */

.toolbar-command button[Title="Quick commands"] svg {display: none;}
.toolbar-command button[Title="Quick commands"] span:before {
	content: "↪";
	font-size: 20px;
}

[anaskhan]

@stardepp sorry to ask the silly question but how/where to use this code? I don't see any options in command chains UI

[stardepp]

@anaskhan This is how it looks to me:

[stardepp]

@anaskhan Use these instructions:

https://forum.vivaldi.net/topic/10549/modding-vivaldi

[anaskhan]

@stardepp I did
Open vivaldi://experiments
Enable "Allow for using CSS modifications"
Open Appearance section in settings
Choose the folder you want to use
Place your CSS files inside it (named custom.css) and copy pasted your code
Restart Vivaldi to see them in effect

but still showing same icon

[stardepp]

@anaskhan Does it look the same for you?:

[anaskhan]

@stardepp yes

[anaskhan]

@anaskhan

[stardepp]

@anaskhan Everything looks correct like this.
Did you restart Vivaldi after you saved this code?

[anaskhan]

@stardepp multiple times

[nomadic]

@anaskhan The CSS is targeting the command chain button by its title. It is looking for a button with the title "Quick commands". If your command chain doesn't have the same name, then the CSS will not apply to it.

You can either rename your command chain to Quick commands or replace the 2 places in the CSS with the actual name of your command chain.

[anaskhan]

@nomadic I had the command chain named Quick Command with capital C (it was case sensitive); I changed it to Quick command and it worked!!!