ubuntu / yaru

All Ubuntu Yaru GNOME themes
https://community.ubuntu.com/c/desktop/theme-refresh
GNU General Public License v3.0
1.34k stars 181 forks source link

Please use dark dark theme for the ding (desktop icons extension) context menu #3411

Closed 3v1n0 closed 2 years ago

3v1n0 commented 2 years ago

Ding sadly doesn't use gnome-shell native menus so the right-click menu on the desktop looks a bit odd.

Would be nice if you could do some theme customization so that such menu looks more like a native shell menu.

Jupi007 commented 2 years ago

I tried to specifically style this menu, but it looks like this is not possible. It's a Gtk3 menu without any class, which mean we can style it without style all Gtk3 menus.

AaronTechnic commented 2 years ago

@Jupi007 But is it still possible to achieve it? In Ubuntu 20.04 GNOME Shell native right click menus were on the previous extension, but that changed in 21.04. Is there any way to get that right click menu back? I think it looks nice.

Jupi007 commented 2 years ago

I understand but the problem is that this extension use a Gtk menu while the old one was using a native shell menu. We can't style it without alter the whole desktop menus.

Jupi007 commented 2 years ago

@3v1n0 Unless Ding add a specific selector for menus, I'm afraid it is impossible to implement this. Closing so.

Btw, it is only a personal note, but I think Gtk menu is more appropriated for such large menus as desktop ones. GS menus style is nice, but when having a large amount of items, the padding is becoming too much.

3v1n0 commented 2 years ago

@Jupi007 if a specific class is needed, we can definitely add one, it's really not an issue.

If you are in a jammy VM you can already easily try to edit it, using this (files are in /usr/share/gnome-shell/extensions/ding@rastersoft.com.

diff --git a/desktopManager.js b/desktopManager.js
index 9f18009..8d7405d 100644
--- a/desktopManager.js
+++ b/desktopManager.js
@@ -865,6 +865,7 @@ var DesktopManager = class {

     _createDesktopBackgroundMenu() {
         this._menu = new Gtk.Menu();
+        this._menu.get_style_context().add_class("desktopmenu");
         let newFolder = new Gtk.MenuItem({label: _("New Folder")});
         newFolder.connect("activate", () => this.doNewFolder());
         this._menu.add(newFolder);
diff --git a/extension.js b/extension.js
index 54d023e..3109ef9 100644
--- a/extension.js
+++ b/extension.js
@@ -409,6 +409,7 @@ function launchDesktop() {
     }

     data.currentProcess = new LaunchSubprocess(0, "DING", "-U");
+    data.currentProcess._launcher.setenv('GTK_DEBUG', 'interactive', true);
     data.currentProcess.set_cwd(GLib.get_home_dir());
     data.currentProcess.spawnv(argv);
     data.x11Manager.set_wayland_client(data.currentProcess);

Then it's just about theming the .desktopmenu class.

Jupi007 commented 2 years ago

Okay, I'll try this :)

3v1n0 commented 2 years ago

Btw, it is only a personal note, but I think Gtk menu is more appropriated for such large menus as desktop ones. GS menus style is nice, but when having a large amount of items, the padding is becoming too much.

I agree we can reduce the padding here, but preserve the styling.

Jupi007 commented 2 years ago

Tested, this works.

Before:

Capture d’écran du 2022-03-10 00-04-33

After:

Capture d’écran du 2022-03-10 00-04-13

But it only works on the menu from a right click in an empty zone on the desktop. If I right click on a folder, it's styled using regular look. It just require to add the same class on all the other menus.

Feichtmeier commented 2 years ago

@3v1n0 @Jupi007

Will we have a dark shell theme or a light shell theme by default in 22.04 and will it be possible to sync dark/light pref of gtk with the shell?

Imo the ideal way would be that the colors would match automatically in a world where gtk and shell use the same light/dark pref

Jupi007 commented 2 years ago

I could be great to sync Gtk theme variant and Gnome Shell one :+1:

Personally, I didn't forced the dark theme in my PR. I only added a bit more spacing and rounding here and there.

3v1n0 commented 2 years ago

Will we have a dark shell theme or a light shell theme by default in 22.04 and will it be possible to sync dark/light pref of gtk with the shell?

So... I thought we wanted to keep the shell always dark, while apply the dark/light variants only to the toolkits.

I could be great to sync Gtk theme variant and Gnome Shell one +1

Well, we could... I didn't do it so far because as said I thought that was a decision to keep the shell always dark...

It's technically possible. I personally to have the shell always dark, but maybe it's just a personal choice. thave any preference here?

To make it clearer, so far the desktop shell (system menus) and widgets were using a dark theme, while the applications could switch between dark and light variants.

Would you prefer to keep the shell always dark or make it consistent with the rest of the desktop and so be light/dark depending on user choice?

Otherwise we could even re-introduce the "mixed" mode, even though it could lead to having a new gsetting key. :thinking:

It just require to add the same class on all the other menus.

Definitely, I forgot to add there too... Easy fix is:

commit fe4d1647584a646fc4622d7051b4b7c71862f73c
Author: Marco Trevisan (Treviño) <mail@3v1n0.net>
Date:   Mon Mar 14 22:24:01 2022 +0100

    fileItemMenu: Add .desktopmenu class to desktop context menu

    Make possible to customize theming of the DING context menu in specific
    themes. Add a custom class to make possible to select the DING menu.

diff --git a/fileItemMenu.js b/fileItemMenu.js
index d073708..967d033 100644
--- a/fileItemMenu.js
+++ b/fileItemMenu.js
@@ -105,6 +105,9 @@ var FileItemMenu = class {
         let selectedItemsNum = this._desktopManager.getNumberOfSelectedItems();

         this._menu = new Gtk.Menu();
+        const menuStyleContext = this._menu.get_style_context();
+        menuStyleContext.add_class("desktopmenu");
+        menuStyleContext.add_class("fileitemmenu");
         this._menu.connect_after('selection-done', () => {
             this._menu.destroy();
             this._menu = null;
Feichtmeier commented 2 years ago

@3v1n0

We've chosen the dark shell because:

1) we thought we couldn't or we shouldn't change shell to follow GTK 2) since we thought we couldn't we thought that a dark pop-up on a light BG is less annoying than a light pop-up on a dark BG

Ideally all should be synced like in Android or Windows :)

Muqtxdir commented 2 years ago

Would you prefer to keep the shell always dark or make it consistent with the rest of the desktop and so be light/dark depending on user choice?

please keep it consistent with user's choice of light/dark mode system-wide as it is a general assumption derived from user's experience from other platforms like android, plasma and windows.

Jupi007 commented 2 years ago

Honestly, I also prefer a whole light/dark synced system.

3v1n0 commented 2 years ago

Fair enough, it seems we've a consensus here :-D