Context Menus
mangini210 opened this issue · 10 comments
Excellent theme! The only difference I notice are context menus. Can something be done about it?
Unfortunately not. GTK3 and GTK4 are different when it comes to menus. Trying to mimic it would most likely cause breakage in various apps.
Just to let you know I modified the context menus to look like libadwaita and I haven't seen any breaking yet.
Do you have a diff or PR for this I'd like to test it out, thanks.
Sorry I'm new to this stuff. I only replaced the whole menus section in the gtk.css file with the one from the Orchis theme, lol. I then did some minor tweaks: increasing padding and border radius from menu items.
Ok I can see it in orchis i'll check libadwaita values see if i can create a pr if testing goes ok.
I'm struggling a little a little to get the menu borders rounded with the shadows but i have this working in my .config/gtk.css
menu, .menu, .context-menu { margin: 4px; padding: 6px 6px; }
.csd menu, .csd .menu, .csd .context-menu { border: none; border-radius: 6px; }
menu menuitem, .menu menuitem, .context-menu menuitem {margin: 0;border-radius: 6px;padding: 7px 6px;}
menu separator {margin: 3px 0}
i'll try and integrate it into the sass and build at some point, but native gtk apps seem ok, electron apps not so much.
Try this for the shadows:
.csd.popup decoration {
box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12); }
What do you mean with electron apps? Can they be themed?
I think this would be the whole thing:
menu,
.menu,
.context-menu {
margin: 4px;
padding: 6px 6px;
background-clip: border-box;
border: 1px solid rgba(0, 0, 0, 0.08);
}
.csd menu,
.csd .menu,
.csd .context-menu {
border: none;
border-radius: 12px;
}
menu menuitem,
.menu menuitem,
.context-menu
menuitem {
margin: 0;
border-radius: 6px;
padding: 7px 6px;}
menu separator { margin: 6px; }
.csd.popup decoration {
border-radius: 12px;
box-shadow: 0 2px 2.4px -1px rgba(0, 0, 0, 0.2), 0 4px 3px 0 rgba(0, 0, 0, 0.14), 0 1px 6px 0 rgba(0, 0, 0, 0.12);
}
cool looks like i was missing the popup decoration.
I'm just using global overrides, so i'll deal with the colours when i merge locally and create a pr see if that helps get this un-wonted ;) i think your separator margin is more accurate also.
the electron apps like chrome and visual studio look like this:
compared to this (gtk3 left, 4 right)
I'm sure there is a way to target electron apps. I think the menus looks more consistent and don't cause and issues outside of electron apps, so would consider it an improvement?