Greater UI conformity with GTK style.

[ripefig]

I don't know how much control Brave has over skinning and I understand if this isn't a high priority issue. But I'll just list the problems with the current implementation and outline the benefits of conforming to GTK/Gnome HIG.

Chromium's GTK skinning isn't really on par with firefox, and it's not even close to native GTK. The window has a strong and jagged black border, the scrollbars aren't GTK, and it doesn't use popover-style menus.

To conform with GTK, I feel you'd need the following things:

• A proper GTK window border, without the padding and the black outline.
• Popover-style menus.
• GTK scrollbars.
• An option to move the tab bar *below * the address bar (like on Safari) and make the address into the window titlebar. Tabs on top make it very hard to grab the window, because the tabs can shrink the drag area to zero. Since tabs are draggable, you can't drag from tabs. Plus, there is no reason to have tabs on top in Gnome and Mac OS, because the top of the desktop is monopolized by a panel. But if you combine the addressbar with the titlebar, you'd be guaranteed a huge titlebar area, where you can grab the window from any non-draggable space (including buttons and white-space).

To see how it works, just install Gnome Web. https://wiki.gnome.org/Apps/Web

Moving the tab bar below the address bar also has the benefit of allowing you to hide the tab bar entirely or have a tabless workflow (which is possible on Gnome shell).

[ryanthomas-org]

On a related note, if anyone has figured it out, I would be most grateful if they could share the syntax for customizing the appearance of brave features in one's GTK theme if it is possible, specifically the current/selected tab colors. I prefer to keep the global theme color variables that brave references for selected vs unselected tabs in relative proximity, and a brighter/more contrasted color there would be easier to interpret at a glance. Thanks!

EDIT: Please forgive what may be technically off topic, but hopefully at least this edit can be forgiven in the interests of having a searchable track record on modifying the appearance of brave's GTK interface. It looks like brave follows pretty standard methods for customizing the appearance of chromium-based browsers in one's GTK-3 CSS.

I have not found any working method for colorizing the active tab by itself as it seems to take on the same foreground/background colors of the toolbar, and then the inactive tabs have their own color. I was, however, able to modify these elements to have their own colors separate from the rest of my system.

Here are the additions I made to my gtk.css file, with comments. Working just fine on Version 1.8.72 Chromium: 81.0.4044.92 (Official Build) dev (64-bit) – I hope it's helpful to someone.

/* Brave Browser */

/* inactive tabs*/
window.background.chromium menubar {
  background-color: @bg_color_lighten;
  color: @text_color_faded;
}

/* active tab, and the toolbar underneath it*/
window.background.chromium {
  color: @text_color;
  background-color: @bg_color_darken;
}

/* the url bar when unfocused */
window.background.chromium textview.view {
  background-color: transparent;
}

[bsclifton]

@Sawyer07 you might have luck if you enable GTK+ for the theme under brave://settings/appearance

Please try enabling that (if not already enabled) and see if the UI elements end up using GTK styling 😄

[ikeofkc]

the biggest problem is the HUGE borders, that are

1. Unique to the Linux variant. the windows and mac versions don't have thick borders
2. Weird because the default GNOME and KDE themes don't have huge borders

So this is some inconsistent nonsensical difference in the Linux version that makes it needlessly feel underappreciated.

I have a feeling this might be an inherited issue from Chromium since it has the same weird logic-void design issue: https://bugs.chromium.org/p/chromium/issues/detail?id=920768 So perhaps starring this issue might help multiple browsers

[keilmillerjr]

+1 The current GTK+ theme looks nothing like a native gnome app. This is mostly due to the Microsoft Edge & Google Chrome looking icons. Many GTK apps are now integrating these action icons within the titlebar. Gnome Web (Epiphany) is a great example for comparison, as @ripefig mentioned. Gedit gnome-terminal, nautilus.

brave://settings/appearance > Theme > pop-out icon > Chrome web store for themes, that does not have the default GTK+ theme. Odd.