Feature request - transparent menu items

[archisman-panigrahi]

It would be great if transparent menu items are implemented in this theme. Current state (Linux mint 19.1 with Cinnamon 4.0.10) For example, this theme can make the menu items transparent but is not that good in certain other aspects of UI. I am also attaching a picture of transparent menus under that theme.

[Elbullazul]

Transparency should be relatively easy to implement, but I haven't done it because it can cause legibility issues and also because some desktops do not support fully transparency(Xfce, Lxde, ...)

For example, this theme, can make the menu items transparent but is not that good in certain other aspects of UI.

Do you mean 1) that McOS Mint has theming issues and you'd rather use my theme? or 2) that having transparent menus creates issues with the UI?

[archisman-panigrahi]

I would like to use your theme with transparency enabled. McOS Mint theme provides transparency, but has some bugs (eg. there is a black line in the file manager, the title is off centred, etc.) which are not present in your theme. Also, the size of buttons etc. seem to look better in your theme.

[Elbullazul]

ok, will give it a try but I'll be busy for the weekend, maybe early next week I can try to make something

[Elbullazul]

9fc125b adds this functionality

[dgutov]

Can it be disabled? :disappointed:

Does MacOS have transparent menus like this, BTW?

[Elbullazul]

@dgutov macOS has had transparent menus since Mac OS X 10.0. This is how Catalina's menus look:

If you want opaque menus, you can replace

menu, .menu {
  margin: 4px;
  padding: 0;
  border-radius: 4px;
  border-style: none;
  color: #000000;
  background-color: alpha(mix(#FFFFFF, #F5F5F5, 0.5), 0.9); }

by

menu, .menu {
  margin: 4px;
  padding: 0;
  border-radius: 4px;
  border-style: none;
  color: #000000;
  background-color: mix(#FFFFFF, #F5F5F5, 0.5); }

in gtk.css

Should probably add a no-transparency option, right?

[dgutov]

This is how Catalina's menus look:

OK. But I'm trying to see the transparency on that screenshot, and it's not easy. No see-through text, at least.

If you want opaque menus, you can replace

Thank you!

Should probably add a no-transparency option, right?

If feasible. Not sure if it's easy to do with GNOME themes.

[dgutov]

If you want opaque menus, you can replace

What about the shell theme, though (GNOME)?

[Elbullazul]

OK. But I'm trying to see the transparency on that screenshot, and it's not easy. No see-through text, at least.

In macOS the menus are somewhat transparent, but the compositor blurs its background, so that it 'integrates' the colors from the pixels behind it, like microsoft's fluent design:

Unfortunately, blur is not available in the gnome CSS engine. So I settled for transparency but without the blur, although I'm not particularly pleased with the result.

If feasible. Not sure if it's easy to do with GNOME themes.

allright then, solid theme coming soon

What about the shell theme, though (GNOME)?

In gnome-shell.css, replace

.popup-menu-boxpointer,
.candidate-popup-boxpointer {
/*  -arrow-border-radius: 0px 4px 4px 0px;
    -arrow-background-color: rgba(255,255,255,0.97);
    -arrow-border-width: 0;
    -arrow-base: 24px;
    -arrow-rise: 0px;
    box-shadow: 1px 3px 5px 2px rgba(0,0,0,0.25);
    border-radius: 4px;*/
    background-color: rgba(255,255,255,0.85);

with

.popup-menu-boxpointer,
.candidate-popup-boxpointer {
    background-color: rgba(255,255,255,1.0);

[dgutov]

the compositor blurs its background

My impression exactly.

although I'm not particularly pleased with the result

Yeah, IMHO it would be better to do without, at least until GNOME catches up with functionality. But that's just one opinion.

In gnome-shell.css, replace

Thanks!

[Elbullazul]

cdce7402c19be265e587c8c8fc26bfbea490ffdd adds a solid stylesheet without transparency for the menu